/* blocks.css — стили блоков библиотеки. Порядок соответствует семействам A…H. */

/* ═══════════ A · каркас ═══════════ */

.statusbar {
  background: var(--l-ink); color: var(--l-ink-invert);
  font-family: var(--l-font-mono); font-stretch: var(--l-stretch-mono); font-size: var(--l-text-label);
  letter-spacing: 0.02em;
}
.statusbar__in { display: flex; align-items: center; gap: var(--l-s3); min-height: 40px; flex-wrap: wrap; }
.statusbar__text { margin: 0; }
.statusbar__dot { width: 7px; height: 7px; border-radius: 50%; background: var(--l-ink-mute); flex: none; }
/* красный горит только когда есть решение: продажи открыты */
.statusbar--open .statusbar__dot { background: var(--l-accent); animation: pulse 2.4s var(--l-ease) infinite; }
.statusbar--closed { background: var(--l-bg-sunk); color: var(--l-ink-mute); }
.statusbar--closed .statusbar__dot { background: currentColor; }
.statusbar__cta { margin-left: auto; color: inherit; }
@keyframes pulse { 0%, 70%, 100% { opacity: 1; } 85% { opacity: 0.25; } }

.topbar {
  position: sticky; top: 0; z-index: 40;
  background: color-mix(in oklab, var(--l-bg) 88%, transparent);
  backdrop-filter: blur(10px);
  border-bottom: var(--l-hair) solid var(--l-hairline);
}
.topbar__in { display: flex; align-items: center; gap: var(--l-s5); min-height: var(--l-topbar-h); }
/* якорь из меню встаёт под шапкой, а не под ней: высота шапки одна для обоих правил */
html { --l-topbar-h: 62px; scroll-padding-top: calc(var(--l-topbar-h) + var(--l-s3)); }
.topbar__brand { display: flex; align-items: center; gap: var(--l-s3); text-decoration: none; flex: none; }
.topbar__mark {
  width: 26px; height: 26px; flex: none; background: currentColor;
  -webkit-mask: url(../assets/aim-mark.png) center/contain no-repeat;
  mask: url(../assets/aim-mark.png) center/contain no-repeat;
}
.topbar__name { font-family: var(--l-logo-font); font-stretch: var(--l-logo-stretch); font-weight: var(--l-logo-weight); font-size: var(--l-logo-size); letter-spacing: var(--l-logo-tracking); }   /* стиль «логотип», tokens.css */
.topbar__sub { color: var(--l-ink-mute); font-size: var(--l-text-label); }
.topbar__nav { display: flex; gap: var(--l-s5); margin-left: auto; font-family: var(--l-font-mono); font-stretch: var(--l-stretch-mono); font-weight: var(--l-note-weight); font-size: var(--l-note-size); line-height: var(--l-note-leading); letter-spacing: var(--l-note-tracking); }   /* роль «надпись»: меню мельче бирки (Кирилл, 21.09) */
.topbar__nav a { color: var(--l-ink-2); text-decoration: none; display: inline-flex; align-items: center; min-height: 44px; }
.topbar__nav a:hover { color: var(--l-ink); }
.topbar__cta { flex: none; }
/* переключатель темы (22.09): показывает, куда переключит – луна на светлой, солнце на тёмной.
   Без скрипта кнопки нет (hidden в разметке снимает landing.js) */
.topbar__theme {
  flex: none; display: inline-flex; align-items: center; justify-content: center;
  width: 44px; height: 44px; margin: 0; padding: 0;
  background: transparent; color: var(--l-ink-2); border: 0; border-radius: 50%; cursor: pointer;
  transition: color var(--l-t-hover) var(--l-ease), background var(--l-t-hover) var(--l-ease);
}
.topbar__theme:hover { color: var(--l-ink); background: color-mix(in oklab, var(--l-ink) 8%, transparent); }
.topbar__theme:focus-visible { outline: 2px solid var(--l-accent); outline-offset: 2px; }
.topbar__theme[hidden] { display: none; }
.topbar__theme-sun { display: none; }
@media (prefers-color-scheme: dark) {
  :root:not([data-force="light"]) .topbar__theme-sun { display: block; }
  :root:not([data-force="light"]) .topbar__theme-moon { display: none; }
}
:root[data-force="dark"] .topbar__theme-sun { display: block; }
:root[data-force="dark"] .topbar__theme-moon { display: none; }
:root[data-force="light"] .topbar__theme-sun { display: none; }
:root[data-force="light"] .topbar__theme-moon { display: block; }
@media (max-width: 900px) { .topbar__nav, .topbar__sub { display: none; } .topbar__brand { margin-right: auto; } .topbar__cta { margin-left: 0; } }   /* кнопка к правому краю и тогда, когда переключателя темы нет (29.09) */

.footer { padding-block: var(--l-s7) var(--l-s6); }
.footer__top { display: flex; justify-content: space-between; gap: var(--l-s6); flex-wrap: wrap; margin-bottom: var(--l-s6); }
/* стили текста (tokens.css): формула – заголовок пункта (вывод), ссылки и строка «сделано» – надпись (у .footer__made класс .mono) */
.footer__formula { font-family: var(--l-h3-font); font-stretch: var(--l-h3-stretch); font-weight: var(--l-h3-weight); font-size: var(--l-h3-size); line-height: var(--l-h3-leading); letter-spacing: var(--l-h3-tracking); max-width: 22ch; }
.footer__links { display: flex; flex-wrap: wrap; gap: var(--l-s3) var(--l-s5); font-family: var(--l-font-mono); font-stretch: var(--l-stretch-mono); font-weight: var(--l-note-weight); font-size: var(--l-note-size); line-height: var(--l-note-leading); letter-spacing: var(--l-note-tracking); align-content: start; }
.footer__made { color: var(--l-ink-mute); }
.footer__prompt { color: var(--l-ink-mute); }

.stickycta {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 45;
  padding: var(--l-s3) var(--l-gutter) calc(var(--l-s3) + env(safe-area-inset-bottom));
  background: color-mix(in oklab, var(--l-bg) 92%, transparent);
  backdrop-filter: blur(10px);
  border-top: var(--l-hair) solid var(--l-line);
}
.stickycta .btn { width: 100%; }
@media (min-width: 901px) { .stickycta { display: none; } }

/* ═══════════ B · первый экран ═══════════ */

.hero { padding-block: var(--l-s8) var(--l-s7); overflow: hidden; }
.hero__in { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: var(--l-s7); align-items: center; }
.hero__in--pain { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.hero__eyebrow { margin-bottom: var(--l-s4); }
.hero__title { margin-bottom: var(--l-s4); }
.hero__title--pain { font-size: clamp(2.1rem, 1.4rem + 3vw, 3.9rem); line-height: var(--l-leading-tight); }
.hero__explain { font-size: var(--l-text-lead); line-height: var(--l-leading-snug); max-width: 30ch; margin-bottom: var(--l-s5); }
.hero__proof { margin-bottom: var(--l-s3); max-width: var(--l-measure); }
.hero__who { color: var(--l-ink-mute); margin-bottom: var(--l-s6); }
.hero__actions { margin-bottom: var(--l-s4); }
.hero__note { display: block; }
@media (max-width: 900px) {
  .hero { padding-block: var(--l-s6) var(--l-s6); }
  .hero__in, .hero__in--pain { grid-template-columns: minmax(0, 1fr); gap: var(--l-s6); }
  /* на узком экране заголовок идёт первым; крючок болевого лендинга (ролик) остаётся сверху */
  .hero__loop { order: -1; }
  .hero__fig { order: 0; margin-top: var(--l-s2); }
}

/* метафора отгрузки */
.ship { width: 100%; height: auto; overflow: visible; }
.ship__rail line, .ship__rail-line { stroke: var(--l-line); stroke-width: 2; }
.ship__gate line, .ship__gates line { stroke: var(--l-ink-mute); stroke-width: 1.5; }
.ship__gate text, .ship__threshold text {
  fill: var(--l-ink-mute); font-family: var(--l-font-mono); font-stretch: var(--l-stretch-mono); font-size: 11px;
  letter-spacing: 0.06em; text-anchor: middle; text-transform: uppercase;
}
.ship__threshold line, .ship__threshold-line { stroke: var(--l-ink); stroke-width: 2.5; }
.ship__people { fill: none; stroke: var(--l-ink-2); stroke-width: 1.8; }
.ship__people circle { fill: var(--l-ink-2); stroke: none; }
.ship__dot { fill: var(--l-ink-mute); }
.ship__dot--pass, .ship__dot--rest { fill: var(--l-accent); }

@media (prefers-reduced-motion: no-preference) {
  .ship__dot--a { animation: ship-back 5.6s var(--l-ease) infinite; }
  .ship__dot--b { animation: ship-back2 5.6s var(--l-ease) infinite 1.1s; }
  .ship__dot--c { animation: ship-back3 5.6s var(--l-ease) infinite 2.2s; }
  .ship__dot--pass { animation: ship-pass 5.6s var(--l-ease) infinite 3.1s; }
}
/* без движения точки стоят на осмысленных местах */
.ship__dot--a { cx: 110px; } .ship__dot--b { cx: 250px; }
.ship__dot--c { cx: 400px; } .ship__dot--pass { cx: 596px; }

@keyframes ship-back {
  0% { cx: 40px; opacity: 0; } 8% { opacity: 1; }
  26% { cx: 168px; fill: var(--l-ink-mute); }
  38% { cx: 96px; }            /* гейт вернул */
  60% { cx: 168px; } 74% { cx: 120px; } 100% { cx: 120px; opacity: 0.35; }
}
@keyframes ship-back2 {
  0% { cx: 40px; opacity: 0; } 8% { opacity: 1; }
  34% { cx: 318px; } 48% { cx: 214px; }
  70% { cx: 318px; } 84% { cx: 250px; } 100% { cx: 250px; opacity: 0.35; }
}
@keyframes ship-back3 {
  0% { cx: 40px; opacity: 0; } 8% { opacity: 1; }
  40% { cx: 468px; } 54% { cx: 356px; }
  78% { cx: 468px; } 100% { cx: 400px; opacity: 0.35; }
}
@keyframes ship-pass {
  0% { cx: 40px; opacity: 0; fill: var(--l-ink-mute); } 6% { opacity: 1; }
  30% { cx: 170px; } 52% { cx: 320px; } 72% { cx: 470px; fill: var(--l-ink); }
  88% { cx: 560px; fill: var(--l-ink); } 100% { cx: 596px; fill: var(--l-accent); }
}
/* «конвейер»: цикл не затихает, точки идут непрерывно */
.ship[data-mode="conveyor"] .ship__dot--pass { animation-duration: 4.2s; }

/* B2 рейл фактов */
.rail { padding-block: var(--l-s6); border-block: var(--l-hair) solid var(--l-hairline); }
.rail__list { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: var(--l-s5); }
.rail__item { display: grid; gap: var(--l-s1); }
.rail__v { font-family: var(--l-font-display); font-stretch: var(--l-stretch-display); font-size: var(--l-text-h3); font-weight: 700; }
.rail__k { color: var(--l-ink-mute); font-family: var(--l-font-mono); font-stretch: var(--l-stretch-mono); font-size: var(--l-text-label); }

/* B3 пруф-лист */
.proof__item { display: grid; gap: var(--l-s4); }
.proof__viz { height: 72px; display: flex; align-items: center; }
.proof__viz svg { width: 100%; height: 100%; }
.proof__claim { font-size: var(--l-text-lead); line-height: var(--l-leading-snug); margin-bottom: var(--l-s2); }
.viz-cell { fill: var(--l-line); }
.viz-cell--on { fill: var(--l-ok); }
.viz-bar { fill: var(--l-line); }
.viz-bar--on { fill: var(--l-ink); }

/* ═══════════ C · боль и механизм ═══════════ */

.voices { border-top: var(--l-hair) solid var(--l-line); max-width: 52rem; }
.voices__item {
  display: grid; grid-template-columns: 9rem minmax(0, 1fr); gap: var(--l-s4);
  align-items: baseline; padding-block: var(--l-s5);
  border-bottom: var(--l-hair) solid var(--l-hairline);
}
.voices__text { font-size: var(--l-text-lead); line-height: var(--l-leading-snug); }
@media (max-width: 620px) { .voices__item { grid-template-columns: minmax(0, 1fr); gap: var(--l-s2); } }

.diag { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 0.9fr); gap: var(--l-s7); align-items: center; }
.diag__text h2 { margin-block: var(--l-s3) var(--l-s4); }
.diag__note { display: block; margin-top: var(--l-s4); }
.diag__fig { display: grid; gap: var(--l-s3); }
@media (max-width: 900px) { .diag { grid-template-columns: minmax(0, 1fr); gap: var(--l-s5); } }

.fig { width: 100%; height: auto; }
.fig__label { fill: var(--l-ink-mute); font-family: var(--l-font-mono); font-stretch: var(--l-stretch-mono); font-size: 11px; letter-spacing: 0.06em; }
.fig__label--stop { fill: var(--l-ink); }
.fig__loop { fill: none; stroke: var(--l-line); stroke-width: 2; }
.fig__exit { fill: none; stroke: var(--l-line); stroke-width: 2; stroke-dasharray: 4 6; }
.fig__bugs circle { fill: var(--l-ink-mute); opacity: 0.5; }
.fig__spin { fill: var(--l-ink); }
@media (prefers-reduced-motion: no-preference) {
  .fig__spin { offset-path: path("M160 40 a80 80 0 1 1 -0.1 0"); animation: spin-loop 4.4s linear infinite; }
}
.fig__spin { offset-distance: 12%; }
@keyframes spin-loop { to { offset-distance: 100%; } }
.fig__scatter circle { fill: var(--l-ink-mute); opacity: 0.55; }
.fig__split { stroke: var(--l-hairline); stroke-width: 1; stroke-dasharray: 3 5; }
.fig__tree path { fill: none; stroke: var(--l-line); stroke-width: 1.5; }
.fig__tree circle { fill: var(--l-ok); }
.fig__done { fill: none; stroke: var(--l-ink); stroke-width: 3; }
.fig__gap { fill: none; stroke: var(--l-ink-mute); stroke-width: 3; stroke-dasharray: 5 7; }
.fig__ticks line { stroke: var(--l-ink-mute); stroke-width: 1.5; }
.fig__people { fill: none; stroke: var(--l-ink-2); stroke-width: 1.8; }
.fig__people circle { fill: var(--l-ink-2); stroke: none; }

/* C3 до → после */
.ba { display: grid; gap: var(--l-s4); }
.ba__row {
  display: grid; grid-template-columns: minmax(0, 1fr) 40px minmax(0, 1fr);
  gap: var(--l-s4); align-items: center;
  padding: var(--l-s5);
}
.ba__arrow svg { width: 40px; stroke: var(--l-ink-mute); fill: none; stroke-width: 1.5; }
.ba__text { font-size: var(--l-text-body); }
.ba__before .ba__text { color: var(--l-ink-2); }
.ba__layer { color: var(--l-ink); }
@media (max-width: 700px) {
  .ba__row { grid-template-columns: minmax(0, 1fr); }
  .ba__arrow { transform: rotate(90deg); justify-self: start; }
}

/* терминальный реплей: буквальный экран, цвета из --l-term-* */
.replay {
  --sq-r: var(--l-radius-l); --sq-fill: var(--l-term-bg); --sq-line: var(--l-term-line);
  color: var(--l-term-ink); font-family: var(--l-font-mono); font-stretch: var(--l-stretch-mono);
}
.replay__bar {
  --sq-r: var(--sq-r-in);
  display: flex; align-items: center; gap: 6px;
  padding: var(--l-s2) var(--l-s3); border-bottom: var(--l-hair) solid var(--l-term-line);
  background: var(--l-term-bar);
}
.replay__bar span { width: 9px; height: 9px; border-radius: 50%; background: var(--l-term-line); flex: none; }
.replay__bar b { margin-left: var(--l-s2); color: var(--l-term-mute); font-size: var(--l-text-label); font-weight: 500; }
.replay__body {
  margin: 0; padding: var(--l-s4); font-size: 0.82rem; line-height: 1.75;
  white-space: pre-wrap; word-break: break-word; overflow-x: auto;
}
.replay__line { display: block; color: var(--l-term-out); }
.replay__line--cmd { color: var(--l-term-ink); }
.replay__line--cmd::before { content: "$ "; color: var(--l-term-ok); }
.replay__line--ok { color: var(--l-term-ok); }
.replay__line--err { color: var(--l-term-err); }
.replay__line--mute { color: var(--l-term-mute); }
@media (prefers-reduced-motion: no-preference) {
  [data-replay] .replay__line { opacity: 0; animation: line-in 0.01s linear forwards; }
  [data-replay].is-run .replay__line { animation: line-in 0.2s var(--l-ease) forwards; }
}
@keyframes line-in { to { opacity: 1; } }
[data-replay]:not(.is-run) .replay__line { opacity: 1; }

.screen { display: grid; gap: var(--l-s3); }
.screen__cap { display: block; }

.bridge { padding-block: var(--l-s7); }
.bridge__text {
  font-family: var(--l-font-display); font-stretch: var(--l-stretch-display); font-size: var(--l-text-h3);
  max-width: 40rem; line-height: var(--l-leading-snug);
}

/* ═══════════ D · оффер ═══════════ */

.ticks { display: grid; gap: var(--l-s3); }
.ticks li { position: relative; padding-left: var(--l-s5); }
.ticks li::before {
  content: ""; position: absolute; left: 0; top: 0.55em;
  width: 10px; height: 6px; border-left: 2px solid var(--l-ok); border-bottom: 2px solid var(--l-ok);
  transform: rotate(-45deg);
}
.ticks--off li::before { border-color: var(--l-ink-mute); transform: rotate(-45deg) scaleX(0.6); opacity: 0.6; }

.formula__side h3 { margin-block: var(--l-s2) var(--l-s4); }
.formula__line { margin-top: var(--l-s5); color: var(--l-ink-2); max-width: var(--l-measure); }

/* D2 стек слоёв: разрез правилом слева, реальное дерево контура справа */
.stack { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: var(--l-s7); align-items: start; }
.stack__list { border-top: var(--l-hair) solid var(--l-line); }
.stack__layer { border-bottom: var(--l-hair) solid var(--l-line); }
.stack__layer--outside { border-bottom-style: dashed; color: var(--l-ink-mute); }
.stack__btn {
  width: 100%; display: grid; grid-template-columns: 3.2rem minmax(0, 1fr) auto;
  gap: var(--l-s4); align-items: baseline; text-align: left; min-height: 56px;
  padding: var(--l-s4) 0; background: none; border: 0; cursor: pointer;
}
.stack__id { color: var(--l-ink); font-weight: 600; }
.stack__name { font-family: var(--l-font-display); font-stretch: var(--l-stretch-display); font-weight: 500; font-size: var(--l-text-h3); }
.stack__who { color: var(--l-ink-mute); font-size: var(--l-text-label); }
.stack__body { padding: 0 0 var(--l-s5) 3.2rem; color: var(--l-ink-2); max-width: var(--l-measure); }
.stack__files { color: var(--l-ink-mute); font-size: var(--l-text-label); margin-top: var(--l-s2); }
.stack__btn[aria-expanded="true"] .stack__name { font-weight: 700; }
.stack__fig { display: grid; gap: var(--l-s3); position: sticky; top: calc(62px + var(--l-s4)); }
/* рамку и фон дерева несёт обёртка .stack__frame: у скролл-контейнера псевдо уехали бы с содержимым.
   Дуга на внутреннем радиусе держит полосу прокрутки внутри кривой обёртки: дуга срезает угол сильнее
   суперэллипса. То же у .made__code и .letter__body */
.stack__tree {
  margin: 0; padding: var(--l-s5); border-radius: var(--sq-r-in); font-size: var(--l-text-label); line-height: 1.7;
  color: var(--l-ink-mute);
  white-space: pre-wrap; word-break: break-word;
  max-height: calc(100vh - 140px); overflow: auto;
}
.stack__tree b { font-weight: 600; color: var(--l-ink); }
.stack__tree i { font-style: normal; color: var(--l-ink); }
.stack__tree [data-layer] { display: block; transition: opacity var(--l-t-hover) var(--l-ease); }
.stack__tree.is-focus [data-layer] { opacity: 0.38; }
.stack__tree.is-focus [data-layer].is-on { opacity: 1; }
.stack__tree.is-focus [data-layer].is-on b { color: var(--l-ok); }
@media (max-width: 900px) {
  .stack { grid-template-columns: minmax(0, 1fr); gap: var(--l-s5); }
  .stack__fig { position: static; }
  .stack__tree { max-height: 24rem; }
  .stack__btn { grid-template-columns: 2.6rem minmax(0, 1fr); }
  .stack__who { grid-column: 2; }
  .stack__body { padding-left: 2.6rem; }
}

.dashlist { display: grid; gap: var(--l-s2); margin-top: var(--l-s3); color: var(--l-ink-2); }
.dashlist li { padding-left: var(--l-s4); position: relative; }
.dashlist li::before { content: "–"; position: absolute; left: 0; color: var(--l-ink-mute); }

/* D3 планка выпускника: настоящий чек-лист, отмеченное уходит в бота как трек */
.dod { --sq-fill: var(--l-bg-sunk); }
.dod__tracks { --sq-r: var(--sq-r-in); display: flex; flex-wrap: wrap; gap: 0; border-bottom: var(--l-hair) solid var(--l-line); }
.dod__track {
  flex: 1 1 auto; padding: var(--l-s4); min-height: 48px; background: var(--l-bg-sunk); border: 0;
  border-right: var(--l-hair) solid var(--l-line); cursor: pointer;
  font-family: var(--l-font-mono); font-stretch: var(--l-stretch-mono); font-size: var(--l-text-small); color: var(--l-ink-mute);
  transition: color var(--l-t-hover) var(--l-ease), background var(--l-t-hover) var(--l-ease);
}
.dod__track:last-child { border-right: 0; }
.dod__track:focus-visible { outline-offset: -2px; } /* полоса табов под маской: кольцо снаружи срезалось бы */
.dod__track[aria-selected="true"] { background: var(--l-bg-card); color: var(--l-ink); font-weight: 600; box-shadow: inset 0 -2px 0 var(--l-ok); }
.dod__list { padding: var(--l-s3) var(--l-s5); display: grid; background: var(--l-bg-card); }
.dod__item[hidden] { display: none; }
.dod__item label {
  display: grid; grid-template-columns: 20px minmax(0, 1fr); gap: var(--l-s4); align-items: center;
  min-height: 44px; padding-block: var(--l-s1); cursor: pointer;
}
.dod__item input { position: absolute; opacity: 0; width: 0; height: 0; }
.dod__box {
  width: 20px; height: 20px; flex: none;
  border: var(--l-hair) solid var(--l-ink-2); border-radius: var(--l-radius-s); background: var(--l-bg);
  display: grid; place-items: center;
  transition: border-color var(--l-t-hover) var(--l-ease), background var(--l-t-hover) var(--l-ease);
}
.dod__box::after {
  content: ""; width: 9px; height: 5px; border-left: 2px solid var(--l-ink-invert);
  border-bottom: 2px solid var(--l-ink-invert); transform: rotate(-45deg) scale(0.3); opacity: 0;
  transition: opacity var(--l-t-hover) var(--l-ease), transform var(--l-t-hover) var(--l-ease-out);
}
.dod__item input:checked + .dod__box { background: var(--l-ok); border-color: var(--l-ok); }
.dod__item input:checked + .dod__box::after { opacity: 1; transform: rotate(-45deg) scale(1); }
.dod__item input:checked ~ .dod__text { color: var(--l-ink-mute); }
.dod__item input:focus-visible + .dod__box { outline: var(--l-focus) solid var(--l-accent); outline-offset: 2px; }
.dod__foot {
  display: flex; flex-wrap: wrap; gap: var(--l-s3) var(--l-s5); align-items: center; justify-content: space-between;
  padding: var(--l-s3) var(--l-s5); border-top: var(--l-hair) solid var(--l-line);
}
.dod__meter { color: var(--l-ink-mute); }
.dod__after { margin-top: var(--l-s4); }
.dod__promise { margin-top: var(--l-s5); max-width: var(--l-measure); }
.dod__check { margin-top: var(--l-s5); max-width: 60rem; }
.dod__layers { margin-top: var(--l-s2); border-top: var(--l-hair) solid var(--l-line); }
.dod__layer { display: grid; grid-template-columns: 8rem minmax(0, 1fr); gap: var(--l-s3); padding-block: var(--l-s3); border-bottom: var(--l-hair) solid var(--l-hairline); }
.dod__layer dt { color: var(--l-ink-2); font-size: var(--l-text-small); padding-top: 0.15em; }
@media (max-width: 520px) { .dod__layer { grid-template-columns: minmax(0, 1fr); gap: var(--l-s1); } }

/* D5 объём */
.scope__head { margin-bottom: var(--l-s4); }
.scope__head--yes { color: var(--l-ink); }
.scope__head--no { color: var(--l-ink-mute); }
.ticks--off li { color: var(--l-ink-mute); }
.scope__note { display: block; margin-top: var(--l-s5); }

/* D6 лестница */
.ladder__pick { display: flex; flex-wrap: wrap; gap: var(--l-s2); margin-bottom: var(--l-s5); }
.ladder__kind {
  padding: var(--l-s2) var(--l-s4); background: none; cursor: pointer;
  border: var(--l-hair) solid var(--l-line); border-radius: var(--l-radius-s);
  font-family: var(--l-font-label); font-stretch: var(--l-stretch-label); font-size: var(--l-text-label); color: var(--l-ink-2);
  transition: all var(--l-t-hover) var(--l-ease);
}
.ladder__kind[aria-selected="true"] { background: var(--l-ink); color: var(--l-ink-invert); border-color: var(--l-ink); }
.ladder__steps { display: grid; gap: var(--l-s1); counter-reset: step; }
.ladder__step {
  display: grid; grid-template-columns: 2rem minmax(0, 1.4fr) 5rem 7rem minmax(0, 1.2fr);
  gap: var(--l-s4); align-items: baseline;
  padding: var(--l-s4); border-bottom: var(--l-hair) solid var(--l-hairline);
  transition: opacity var(--l-t-base) var(--l-ease);
}
.ladder__step.is-dim { opacity: 0.32; }
.ladder__n { color: var(--l-ink-mute); }
.ladder__name { font-weight: 600; }
.ladder__cost, .ladder__time { color: var(--l-ink-2); font-size: var(--l-text-small); }
.ladder__risk { color: var(--l-ink-mute); font-size: var(--l-text-small); }
@media (max-width: 860px) {
  .ladder__step { grid-template-columns: 1.6rem minmax(0, 1fr); }
  .ladder__cost, .ladder__time, .ladder__risk { grid-column: 2; }
}

/* D7 не курс: обещания курсов зачёркиваются линией, которая рисуется по скроллу */
.nc__struck li { color: var(--l-ink-mute); margin-bottom: var(--l-s3); font-size: var(--l-text-lead); }
.nc__struck s {
  text-decoration: none;
  background: linear-gradient(currentColor, currentColor) no-repeat 0 58% / 100% 2px;
}
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    .nc__struck s { background-size: 0 2px; animation: strike linear both; animation-timeline: view(); animation-range: entry 30% cover 45%; }
    @keyframes strike { to { background-size: 100% 2px; } }
  }
}
.nc__ours li { font-size: var(--l-text-lead); }
.quote { margin-top: var(--l-s6); padding-top: var(--l-s5); border-top: var(--l-hair) solid var(--l-line); max-width: 44rem; }
.quote p { font-family: var(--l-font-display); font-stretch: var(--l-stretch-display); font-size: var(--l-text-h3); line-height: var(--l-leading-snug); margin-bottom: var(--l-s3); }
.quote p::before { content: "«"; } .quote p::after { content: "»"; }

/* ═══════════ E · как устроено ═══════════ */

.week {
  display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: var(--l-s3);
  align-items: end; padding-bottom: var(--l-s3); border-bottom: var(--l-hair) solid var(--l-ink);
}
.week__day { display: grid; gap: var(--l-s2); align-content: end; min-width: 0; }
.week__bar { display: block; height: calc(var(--min) * 0.55px); min-height: 6px; background: var(--l-ink); order: -1; margin-bottom: var(--l-s2); }
.week__day--room .week__bar { background: transparent; border: var(--l-hair) solid var(--l-ink); }
.week__day--solo .week__bar { background: repeating-linear-gradient(-45deg, var(--l-ink) 0 1px, transparent 1px 6px); border: var(--l-hair) solid var(--l-ink); }
.week__day--buffer .week__bar { background: transparent; border: var(--l-hair) dashed var(--l-line); }
.week__day--buffer { color: var(--l-ink-mute); }
.week__name { color: var(--l-ink-mute); font-family: var(--l-font-label); font-stretch: var(--l-stretch-label); font-size: var(--l-text-label); letter-spacing: var(--l-tracking-label); }
.week__what { font-weight: 600; font-size: var(--l-text-small); line-height: var(--l-leading-snug); }
.week__len { color: var(--l-ink-mute); font-size: var(--l-text-label); }
.week__load { margin-top: var(--l-s5); font-size: var(--l-text-lead); max-width: var(--l-measure); }
@media (max-width: 700px) {
  .week { grid-template-columns: minmax(0, 1fr); gap: 0; border-bottom: 0; align-items: stretch; }
  .week__day { grid-template-columns: 5rem minmax(0, 1fr) auto; align-items: center; gap: var(--l-s3); padding-block: var(--l-s3); border-bottom: var(--l-hair) solid var(--l-hairline); }
  .week__bar { order: 4; grid-column: 1 / -1; height: 8px; width: calc(var(--min) * 0.9px); margin: 0; }
}

/* E2 дуга недель: точка пройденного расстояния едет по ленте */
.arc { display: grid; gap: var(--l-s4); position: relative; padding-left: var(--l-s6); }
.arc::before { content: ""; position: absolute; left: 7px; top: 8px; bottom: 8px; width: 2px; background: var(--l-line); }
.arc__week { position: relative; }
.arc__week::before {
  content: ""; position: absolute; left: calc(var(--l-s6) * -1 + 1px); top: 10px;
  width: 14px; height: 14px; border-radius: 50%;
  background: var(--l-bg); border: 2px solid var(--l-line);
}
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    .arc__week::before {
      animation: arc-pass linear both; animation-timeline: view(); animation-range: entry 20% cover 40%;
    }
    @keyframes arc-pass {
      to { background: var(--l-ok); border-color: var(--l-ok); transform: scale(1.15); }
    }
  }
}
.arc__head { display: flex; align-items: baseline; gap: var(--l-s3); margin-bottom: var(--l-s2); max-width: var(--l-measure); }
.arc__id { color: var(--l-ink); font-weight: 600; }
.arc__dates { margin-left: auto; color: var(--l-ink-mute); white-space: nowrap; }
.arc__name { font-size: var(--l-text-h3); }
.arc__body { color: var(--l-ink-2); max-width: var(--l-measure); margin-bottom: var(--l-s2); }
.arc__out .label { color: var(--l-ink-mute); }
.arc__check { display: block; margin-top: var(--l-s1); }
.arc__note { display: block; margin-top: var(--l-s5); }

.entry { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--l-s7); align-items: center; }
.entry__text h2 { margin-block: var(--l-s3) var(--l-s4); }
.entry__text .ticks { margin-block: var(--l-s5); }
.entry__fig { display: grid; gap: var(--l-s3); }
@media (max-width: 900px) { .entry { grid-template-columns: minmax(0, 1fr); gap: var(--l-s5); } }

.frames { border-top: var(--l-hair) solid var(--l-line); }
.frames__head, .frames__row {
  display: grid; grid-template-columns: 10rem repeat(3, minmax(0, 1fr)); gap: var(--l-s5);
  padding-block: var(--l-s4); border-bottom: var(--l-hair) solid var(--l-hairline);
}
.frames__head { padding-block: var(--l-s3); }
.frames__row { padding-block: var(--l-s5); }
.frames__name { font-size: var(--l-text-lead); font-weight: 600; overflow-wrap: anywhere; }
.frames__cell { color: var(--l-ink-2); }
.frames__cell .frames__k { display: none; }
.frames__note { display: block; margin-top: var(--l-s5); }
@media (max-width: 900px) {
  .frames__head { display: none; }
  .frames__row { grid-template-columns: minmax(0, 1fr); gap: var(--l-s3); }
  .frames__cell { display: grid; grid-template-columns: 7rem minmax(0, 1fr); gap: var(--l-s3); }
  .frames__cell .frames__k { display: block; }
}

/* ═══════════ F · люди и доказательства ═══════════ */

.people__card { display: grid; grid-template-columns: 128px minmax(0, 1fr); gap: var(--l-s5); align-items: start; }
.people__photo { --sq-r: var(--l-radius-m); width: 128px; height: 128px; background: var(--l-bg-sunk); display: grid; place-items: center; }
.people__photo img { width: 100%; height: 100%; object-fit: cover; }
.people__ph { color: var(--l-ink-mute); font-size: var(--l-text-h3); }
.people__text h3 { margin-bottom: var(--l-s1); }
.people__text .label { margin-bottom: var(--l-s3); }
@media (max-width: 620px) { .people__card { grid-template-columns: 64px minmax(0, 1fr); gap: var(--l-s4); } .people__photo { width: 64px; height: 64px; } }

.shipped__item { display: grid; grid-template-rows: auto 1fr; gap: var(--l-s4); padding: 0; }

/* однколоночная карточка-грид: без явного трека колонка тянется по самому длинному
   слову и вылезает за рамку, а соседние карточки разъезжаются по высоте картинки */
.shipped__item, .route__step, .frames__card, .revs__item, .plans__card,
.stats__item, .rail__item, .proof__item {
  grid-template-columns: minmax(0, 1fr);
}
.shipped__shot { --sq-r: var(--sq-r-in); aspect-ratio: 16 / 10; background: var(--l-bg-sunk); display: grid; place-items: center; border-bottom: var(--l-hair) solid var(--l-line); }
.shipped__shot img { width: 100%; height: 100%; object-fit: cover; }
.shipped__ph { color: var(--l-ink-mute); font-size: var(--l-text-label); }
.shipped__item figcaption { padding: 0 var(--l-s5) var(--l-s5); display: grid; gap: var(--l-s2); overflow-wrap: anywhere; }
.shipped__badge { color: var(--l-ink-mute); font-family: var(--l-font-label); font-stretch: var(--l-stretch-label); font-size: var(--l-text-label); letter-spacing: var(--l-tracking-label); }

/* F4a стена: набор без карточек, первая цитата — крупно на всю ширину */
.revs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 var(--l-s6); border-top: var(--l-hair) solid var(--l-line); }
.revs__item { display: grid; gap: var(--l-s3); align-content: start; padding-block: var(--l-s5); border-bottom: var(--l-hair) solid var(--l-hairline); }
.revs__item:first-child { grid-column: 1 / -1; }
.revs__item:first-child .revs__quote p { font-family: var(--l-font-display); font-stretch: var(--l-stretch-display); font-size: var(--l-text-h3); max-width: 44rem; }
.revs__quote p { font-size: var(--l-text-body); line-height: var(--l-leading-snug); }
.revs__quote p::before { content: "«"; color: var(--l-ink-mute); }
.revs__quote p::after { content: "»"; color: var(--l-ink-mute); }
.revs__who { font-weight: 600; }
.revs__link a { color: var(--l-ink-2); }
@media (max-width: 900px) { .revs { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 620px) { .revs { grid-template-columns: minmax(0, 1fr); } }

.revlong { display: grid; gap: var(--l-s6); max-width: 52rem; }
.revlong__lead p { font-family: var(--l-font-display); font-stretch: var(--l-stretch-display); font-size: var(--l-text-h3); line-height: var(--l-leading-snug); }
.revlong__who { margin-top: var(--l-s3); font-weight: 600; }
.revlong__more summary { cursor: pointer; font-family: var(--l-font-mono); font-stretch: var(--l-stretch-mono); font-size: var(--l-text-small); color: var(--l-ink-2); margin-top: var(--l-s3); }
.revlong__full { display: grid; gap: var(--l-s3); margin-top: var(--l-s4); color: var(--l-ink-2); max-width: var(--l-measure); }

.pull { padding-block: var(--l-s7); border-block: var(--l-hair) solid var(--l-hairline); background: var(--l-bg-sunk); }
.pull__quote p { font-family: var(--l-font-display); font-stretch: var(--l-stretch-display); font-size: var(--l-text-h2); line-height: var(--l-leading-snug); max-width: 26ch; margin-bottom: var(--l-s3); }

.stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: var(--l-s5); }
.stats__item { display: grid; gap: var(--l-s1); }
.stats__v { font-family: var(--l-font-display); font-stretch: var(--l-stretch-display); font-size: var(--l-text-h2); font-weight: 700; }
.stats__k { color: var(--l-ink-mute); font-family: var(--l-font-mono); font-stretch: var(--l-stretch-mono); font-size: var(--l-text-label); }
.stats__src { display: block; margin-top: var(--l-s5); }

.made { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--l-s7); align-items: center; }
.made h2 { margin-block: var(--l-s3) var(--l-s4); }
.made__frame { --sq-fill: var(--l-bg-sunk); }
.made__code {
  margin: 0; padding: var(--l-s5); border-radius: var(--sq-r-in); overflow-x: auto;
  font-size: var(--l-text-label); line-height: 1.7;
  color: var(--l-ink-2);
}
@media (max-width: 900px) { .made { grid-template-columns: minmax(0, 1fr); gap: var(--l-s5); } }

/* оверлей структуры: показывает границы блоков с их ID */
body.show-structure [id] { outline: 1px dashed color-mix(in oklab, var(--l-accent) 60%, transparent); outline-offset: -1px; position: relative; }
body.show-structure .section::after, body.show-structure .hero::after {
  content: attr(data-block); position: absolute; top: 4px; right: 4px; z-index: 5;
  font-family: var(--l-font-mono); font-stretch: var(--l-stretch-mono); font-size: 10px; letter-spacing: 0.06em;
  background: var(--l-accent); color: #fff; padding: 2px 6px; border-radius: 2px;
}

/* D8 чем отличаемся: нумерованные строки с линиями */
.diff { border-top: var(--l-hair) solid var(--l-line); counter-reset: diff; max-width: 60rem; }
.diff__row {
  display: grid; grid-template-columns: 2.5rem 8rem minmax(0, 1fr); gap: var(--l-s5);
  padding-block: var(--l-s5); border-bottom: var(--l-hair) solid var(--l-hairline);
}
.diff__row::before { counter-increment: diff; content: counter(diff, decimal-leading-zero); font-family: var(--l-font-mono); font-stretch: var(--l-stretch-mono); font-size: var(--l-text-label); color: var(--l-ink-mute); padding-top: 0.35em; }
.diff__row h3 { margin-bottom: var(--l-s2); }
.diff__row p:not(.label) { color: var(--l-ink-2); max-width: var(--l-measure); }
@media (max-width: 700px) { .diff__row { grid-template-columns: 2.5rem minmax(0, 1fr); } .diff__row > .label, .diff__row > div { grid-column: 2; } }

/* ═══════════ G · цена и вход ═══════════ */

/* тарифов бывает два или три: жёсткая пара оставляла третью карточку одну
   в ряду с пустой половиной. колонки считаются по числу карточек. */
.plans { grid-template-columns: repeat(auto-fit, minmax(18rem, 1fr)); }
@media (max-width: 620px) { .plans { grid-template-columns: minmax(0, 1fr); } }
.plans__card { display: grid; gap: var(--l-s4); align-content: start; }
.plans__card--main { --sq-line: var(--l-ink); }
.plans__name { font-size: var(--l-text-h3); }
.plans__price { font-family: var(--l-font-display); font-stretch: var(--l-stretch-display); font-size: var(--l-text-h2); font-weight: 700; line-height: 1; }
.plans__note { display: block; }
.plans__list { margin-block: var(--l-s2); }
.plans__cta { margin-top: var(--l-s2); justify-self: start; }
.plans__extra { margin-top: var(--l-s5); display: grid; gap: var(--l-s2); color: var(--l-ink-2); font-size: var(--l-text-small); }

.guarantee { display: grid; gap: var(--l-s4); }
.guarantee__list, .guarantee .src { max-width: 52rem; }
.guarantee__list { display: grid; gap: var(--l-s3); }
.guarantee__list li { padding-left: var(--l-s5); position: relative; color: var(--l-ink-2); }
.guarantee__list li::before { content: ""; position: absolute; left: 0; top: 0.62em; width: 10px; height: 2px; background: var(--l-ink-mute); }
.guarantee__list strong { color: var(--l-ink); }

.apply { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: var(--l-s7); align-items: center; }
.apply__text h2 { margin-block: var(--l-s3) var(--l-s4); }
.apply__text .ticks { margin-top: var(--l-s5); }
.apply__cta { display: grid; gap: var(--l-s3); justify-items: start; }
@media (max-width: 900px) { .apply { grid-template-columns: minmax(0, 1fr); gap: var(--l-s5); } }

.faq { display: grid; gap: 0; border-top: var(--l-hair) solid var(--l-line); max-width: 52rem; }
.faq__item { border-bottom: var(--l-hair) solid var(--l-line); }
.faq__q {
  display: flex; gap: var(--l-s4); align-items: baseline;
  padding: var(--l-s5) 0; cursor: pointer; list-style: none;
  font-family: var(--l-h3-font); font-stretch: var(--l-h3-stretch); font-weight: var(--l-h3-weight); font-size: var(--l-h3-size); line-height: var(--l-h3-leading); letter-spacing: var(--l-h3-tracking);   /* роль «заголовок пункта» */
}
.faq__q::-webkit-details-marker { display: none; }
.faq__n { color: var(--l-ink-mute); flex: none; min-width: 1.6rem; }   /* роль «надпись» – класс .mono в разметке; колонка номера одной ширины
   для 1 и для 14 (та же 1,6rem, что в отступе ответа .faq__a): вопросы и ответы начинаются с одной линии (02.10) */
.faq__text { flex: 1 1 0; min-width: 0; overflow-wrap: break-word; }
.faq__q::after { content: "+"; margin-left: auto; color: var(--l-ink-mute); font-family: var(--l-font-mono); font-stretch: var(--l-stretch-mono); }
.faq__item[open] .faq__q::after { content: "–"; }
.faq__a { padding-bottom: var(--l-s5); padding-left: calc(var(--l-s4) + 1.6rem); display: grid; gap: var(--l-s3); color: var(--l-ink-2); max-width: var(--l-measure); }

.closing { padding-block: var(--l-s8); text-align: center; }
.closing__in { display: grid; gap: var(--l-s5); justify-items: center; }
.closing__title { font-size: var(--l-text-hero); letter-spacing: var(--l-tracking-hero); line-height: var(--l-leading-flat); max-width: 16ch; }
.closing__body { max-width: 40ch; }
.closing__fig { width: 100%; max-width: 560px; }
.closing__actions { justify-content: center; }
.closing__dates { display: block; }

@media (max-width: 620px) { body:has(.stickycta:not([hidden])) .closing { padding-bottom: calc(var(--l-s8) + 72px); } }

/* ═══════════ добор: D4, E3, E6, F6, G3/G4, H1–H4, H6 ═══════════ */

/* D4 как считаем результат: веса одной полосой, ширина сегмента = вес */
.rubric { display: flex; gap: 3px; margin-bottom: var(--l-s6); }
.rubric__seg { flex: 0 0 var(--w); min-width: 0; display: grid; gap: var(--l-s2); align-content: start; padding-right: var(--l-s3); }
.rubric__seg::before { content: ""; display: block; height: 12px; background: var(--l-ink); margin-bottom: var(--l-s2); }
.rubric__seg:nth-child(2)::before { background: var(--l-ink-2); }
.rubric__seg:nth-child(3)::before { background: var(--l-ink-mute); }
.rubric__seg:nth-child(4)::before { background: var(--l-line); }
.rubric__pct { font-family: var(--l-font-display); font-stretch: var(--l-stretch-display); font-size: var(--l-text-h3); font-weight: 700; line-height: 1; }
.rubric__name { font-weight: 600; }
.rubric__what { font-size: var(--l-text-small); color: var(--l-ink-mute); }
.score__side { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--l-s6); max-width: 60rem; }
.score__side > div { display: grid; gap: var(--l-s2); align-content: start; }
.score__t1 { display: grid; gap: var(--l-s2); margin-top: var(--l-s2); }
.score__t1 li { display: grid; grid-template-columns: 8rem minmax(0, 1fr); gap: var(--l-s3); }
@media (max-width: 700px) {
  .rubric { flex-direction: column; gap: var(--l-s4); }
  .rubric__seg { flex-basis: auto; padding-right: 0; }
  .rubric__seg::before { width: var(--w); }
  .score__side { grid-template-columns: minmax(0, 1fr); }
}

/* E3 сетка дат */
.dates { width: 100%; border-collapse: collapse; text-align: left; }
.dates th {
  font-family: var(--l-font-label); font-stretch: var(--l-stretch-label); font-size: var(--l-text-label); font-weight: 500;
 letter-spacing: var(--l-tracking-label); color: var(--l-ink-mute);
  padding: var(--l-s3) var(--l-s3) var(--l-s3) 0; border-bottom: var(--l-hair) solid var(--l-line);
}
.dates td { padding: var(--l-s4) var(--l-s3) var(--l-s4) 0; border-bottom: var(--l-hair) solid var(--l-hairline); vertical-align: baseline; }
.dates__d { white-space: nowrap; color: var(--l-ink-2); }
.dates__t { font-weight: 600; }
.dates__row--room .dates__k { color: var(--l-ink-mute); }
@media (max-width: 700px) {
  .dates thead { display: none; }
  .dates tr { display: grid; gap: var(--l-s1); padding-block: var(--l-s4); border-bottom: var(--l-hair) solid var(--l-hairline); }
  .dates td { border: 0; padding: 0; }
}

/* E6 · H1 таймлайн-биты */
.tl { display: grid; gap: 0; border-top: var(--l-hair) solid var(--l-line); }
.tl__beat {
  display: grid; grid-template-columns: 6.5rem minmax(0, 1.1fr) minmax(0, 1fr);
  gap: var(--l-s4); align-items: baseline;
  padding: var(--l-s4) 0; border-bottom: var(--l-hair) solid var(--l-hairline);
}
.tl__t { color: var(--l-ok); }
.tl__what { font-weight: 600; }
.tl__why { font-size: var(--l-text-small); }
.tl__after { margin-top: var(--l-s6); max-width: var(--l-measure); display: grid; gap: var(--l-s3); }
@media (max-width: 700px) { .tl__beat { grid-template-columns: minmax(0, 1fr); gap: var(--l-s1); } }

/* F6 мини-тул */
.tool { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: var(--l-s7); align-items: center; }
.tool__text h2 { margin-block: var(--l-s3) var(--l-s4); }
.tool__frame { --sq-r: var(--l-radius-l); }
.tool__iframe { --sq-r: var(--sq-r-in); width: 100%; min-height: 420px; border: 0; display: block; }
.tool__soon { display: grid; gap: var(--l-s4); place-items: center; padding: var(--l-s7) var(--l-s5); text-align: center; color: var(--l-ink-mute); }
@media (max-width: 900px) { .tool { grid-template-columns: minmax(0, 1fr); gap: var(--l-s5); } }

/* G3/G4 тизеры */
.teaser { border-block: var(--l-hair) solid var(--l-hairline); background: var(--l-bg-sunk); }
.teaser__in { display: flex; gap: var(--l-s5); align-items: center; justify-content: space-between; flex-wrap: wrap; padding-block: var(--l-s5); }
.teaser__text { font-size: var(--l-text-lead); max-width: 46ch; margin-top: var(--l-s2); }

/* H2 событие */
.event { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: var(--l-s7); align-items: start; padding-block: var(--l-s7); }
.event__title { font-size: var(--l-text-h2); margin-block: var(--l-s3) var(--l-s4); }
.event__facts { display: grid; gap: var(--l-s4); padding: var(--l-s5); }
.event__fact dd { margin: var(--l-s1) 0 0; font-weight: 600; }
@media (max-width: 900px) { .event { grid-template-columns: minmax(0, 1fr); gap: var(--l-s5); } }

/* H3 письмо менеджеру */
.letter { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: var(--l-s7); align-items: start; }
/* minmax(0, 1fr): обёртка .letter__frame не прокручивается сама, и длинная ссылка в письме иначе раздвинет колонку */
.letter__doc { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--l-s4); }
.letter__body {
  margin: 0; padding: var(--l-s5); border-radius: var(--sq-r-in); white-space: pre-wrap; overflow-x: auto;
  font-family: var(--l-font-body);
  font-stretch: var(--l-stretch-body);
  font-size: var(--l-text-small); line-height: 1.7; color: var(--l-ink-2);
}
.letter__args { align-self: start; }
@media (max-width: 900px) { .letter { grid-template-columns: minmax(0, 1fr); gap: var(--l-s5); } }

/* H4 командный маршрут */
.route { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: var(--l-s5); }
.route__step {
  display: grid; gap: var(--l-s2); align-content: start; padding: var(--l-s5);
}
.route__n { color: var(--l-ok); font-weight: 600; }
.route__name { font-size: var(--l-text-h3); }
.route__what { color: var(--l-ink-2); }
.route__out { font-size: var(--l-text-label); }

/* H6 полоса согласия */
.consent {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 60;
  background: var(--l-ink); color: var(--l-ink-invert);
  padding-block: var(--l-s4);
}
.consent__in { display: flex; gap: var(--l-s5); align-items: center; justify-content: space-between; flex-wrap: wrap; }
.consent__text { font-size: var(--l-text-small); max-width: 62ch; }
.consent .btn--ghost { --btn-line: color-mix(in oklab, currentColor 40%, transparent); --btn-ink: var(--l-ink-invert); }

/* G8 расход поверх билета */
.cost__note { margin-top: var(--l-s5); max-width: 68ch; color: var(--l-ink-2); }
.cost__src { margin-top: var(--l-s3); }

/* хит-таргеты ≥44px: ссылки шапки и футера, пилюли лестницы, вопросы FAQ (аудит 09.09) */
.statusbar__cta, .topbar__brand, .footer__links a, .footer__made a { display: inline-flex; align-items: center; min-height: 44px; }
.ladder__kind { min-height: 44px; }
summary.faq__q, .faq__q { min-height: 44px; }
/* подписи гейтов в hero на узком экране: svg масштабируется, шрифт в его единицах растёт */
@media (max-width: 620px) { .ship text { font-size: 17px; } }

/* B4 коротко: что это, когда, сколько длится, сколько стоит */
.brief { max-width: 64rem; border-top: var(--l-hair) solid var(--l-line); }
.brief__row { display: grid; grid-template-columns: 12rem minmax(0, 1fr); gap: var(--l-s5); padding-block: var(--l-s5); border-bottom: var(--l-hair) solid var(--l-hairline); }
.brief__k { color: var(--l-ink-mute); font-family: var(--l-font-label); font-stretch: var(--l-stretch-label); font-size: var(--l-text-label); letter-spacing: var(--l-tracking-label); padding-top: 0.5em; }
.brief__v { display: grid; gap: var(--l-s2); justify-items: start; }
.brief__main { font-family: var(--l-font-display); font-stretch: var(--l-stretch-display); font-size: var(--l-text-h3); font-weight: 700; line-height: 1.15; }
.brief__sub { color: var(--l-ink-2); max-width: var(--l-measure); }
.brief__link { font-family: var(--l-font-mono); font-stretch: var(--l-stretch-mono); font-size: var(--l-text-small); }
@media (max-width: 620px) { .brief__row { grid-template-columns: minmax(0, 1fr); gap: var(--l-s2); } }