/* Низ страницы темы (templates/public/topic.html, от «НИЗ страницы темы»
   до «конец НИЗА», и ручные темы templates/public/topics/*.html).
   Макеты — _lab/24-pages/topic-bottom: шпаргалка v2, тетрадь v3, ошибки v1,
   оглавление главы v2, «в разработке» v1, дорожка v1, совет родителю v2,
   переписка v3, призыв v1. Все классы — с префиксом tb-. */

/* ── общее ──────────────────────────────────────────────────────────── */
.tb {
  --s1: #4d97ff; --s2: #33d0ec; --s-soft: #ebf4ff; --s-ink: #2b67d9;
  --s-grad: linear-gradient(120deg, var(--s1), var(--s2));
  --tb-grad: linear-gradient(95deg, #1f7bff 0%, #17bfe0 55%, #2ee59d 100%);
  --tb-sh: 0 30px 60px -30px rgba(25, 30, 80, .28), 0 2px 6px rgba(25, 30, 80, .05);
  --tb-sh-s: 0 14px 30px -20px rgba(25, 30, 80, .32), 0 1px 3px rgba(25, 30, 80, .05);
  --tb-green: #14a874; --tb-green-soft: #e3f7ef;
  --tb-navy: #141a3a;
  /* статья страницы узкая (.page) — низ темы занимает всю ширину содержимого */
  width: min(1264px, calc(100vw - 2 * clamp(16px, 4vw, 48px)));
  max-width: none;
  margin-top: 96px;
}
.tb-s-alg  { --s1: #5b8cff; --s2: #a779ff; --s-soft: #eceffe; --s-ink: #3b55d9; }
.tb-s-geo  { --s1: #17c19c; --s2: #4fd3f0; --s-soft: #e4f8f2; --s-ink: #0d8a6e; }
.tb-s-prob { --s1: #ffb02e; --s2: #ff7a59; --s-soft: #fff4e4; --s-ink: #c4620f; }
.tb-s-bio  { --s1: #34c759; --s2: #a3e635; --s-soft: #e8f7e5; --s-ink: #23873d; }
.tb-s-phys { --s1: #e8613c; --s2: #ff9f43; --s-soft: #fdece5; --s-ink: #b8401f; }
.tb-s-chem { --s1: #7c4dff; --s2: #c06cff; --s-soft: #f0eaff; --s-ink: #5a2fd6; }

.page .tb section { margin-top: 0; }
.page div.tb > * + *, .tb > * + * { margin-top: 96px; }
.tb h2, .tb h3, .tb p, .tb ul, .tb ol, .tb li { margin: 0; }
.tb ul, .tb ol { padding: 0; list-style: none; }
.tb h2 { font-size: clamp(28px, 3.4vw, 38px); line-height: 1.1; letter-spacing: -.03em; font-weight: 800; }
.tb h3 { font-size: 22px; line-height: 1.25; letter-spacing: -.02em; font-weight: 800; }
.tb h2 em { font-style: normal; color: transparent; background: var(--tb-grad); -webkit-background-clip: text; background-clip: text; }
.tb img { display: block; max-width: 100%; }
.tb-kicker { color: var(--s-ink); }
.tb-kicker-red::before, .tb-par-t .tb-kicker::before { background-color: currentColor; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath d='M9 3.6l1.5 3.9L14.4 9l-3.9 1.5L9 14.4l-1.5-3.9L3.6 9l3.9-1.5z' fill='%23fff'/%3E%3C/svg%3E"); background-size: 100%; }
.tb-kicker-red { color: var(--red); }
.tb-hd { display: grid; gap: 12px; margin-bottom: 28px; }
.tb-card { background: var(--surface); border-radius: 26px; box-shadow: var(--tb-sh); }
.tb-lead { font-size: 17px; line-height: 1.6; color: var(--ink-2); }
.tb-acts { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; }
.tb-acts .btn { gap: 8px; }
.tb-ok { display: inline-grid; place-items: center; flex: none; width: 30px; height: 30px; border-radius: 50%; font-size: 14px; font-weight: 800; line-height: 1; color: #fff; background: var(--s-grad); }
.tb-ok-g { background: var(--tb-green); }
/* текст с дробями в строке: ровный шаг строк */
.tb p, .tb li { line-height: 1.75; }
/* крупные формулы: черта дроби тоньше относительно кегля, числа табличные */
.tb-fx { font-variant-numeric: tabular-nums; letter-spacing: -.01em; }
.tb-fx .frac { font-size: .82em; line-height: 1.12; margin: 0 .14em; }
.tb-fx .frac i { border-bottom-width: max(2px, .055em); padding: 0 .12em .04em; }
.tb-fx .frac b { padding: .04em .12em 0; }
/* этажи дроби не наследуют жирность и цвет «b» вокруг */
.tb .frac > i, .tb .frac > b { font-size: inherit; font-weight: inherit; color: inherit; display: block; }
.tb mark.tb-hl { color: inherit; background: none; padding: 0 .08em; border-radius: .2em; box-shadow: inset 0 -.38em 0 color-mix(in srgb, var(--s2) 35%, transparent); -webkit-text-fill-color: currentColor; }

/* ── 1. шпаргалка ───────────────────────────────────────────────────── */
.tb-sheet { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 14px; padding: 14px; }
.tb-sheet.is-solo { grid-template-columns: 1fr; }
.tb-sheet-l { display: grid; align-content: start; gap: 18px; padding: 34px 32px; border-radius: 20px; background: var(--s-soft); }
.tb-pill { justify-self: start; display: inline-flex; align-items: center; gap: 6px; padding: 5px 12px; border-radius: 999px; font-size: 13px; font-weight: 700; color: var(--s-ink); background: #fff; }
.tb-sheet-l > p { font-size: 17px; color: var(--ink-2); }
.tb-disp { padding: 20px 22px; border-radius: 18px; background: #fff; font-size: 40px; font-weight: 650; line-height: 1.3; overflow-x: auto; }
.tb-disp-cap { display: block; margin-bottom: 6px; font-size: 13px; font-weight: 650; color: var(--muted); letter-spacing: 0; }
.tb-box { padding: 18px 20px; border-radius: 18px; background: #fff; font-size: 16px; color: var(--ink-2); }
.tb-box b { color: var(--ink); }
.tb-rules { padding: 18px 26px 18px 18px; }
.tb-rules li { display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: 16px; padding: 20px 0; border-top: 1px solid var(--border-2); }
.tb-rules li:first-child { border-top: 0; }
.tb-rules b { display: block; font-size: 17px; line-height: 1.4; }
.tb-rules p { margin-top: 3px; color: var(--ink-2); line-height: 1.85; }
.tb-rules .tb-ok { margin-top: 1px; }
/* нумерованные шаги вместо галочек */
.tb-rules.is-steps { counter-reset: tbs; }
.tb-rules.is-steps li { counter-increment: tbs; }
.tb-rules.is-steps .tb-ok::before { content: counter(tbs); }
/* краткое содержание темы у биологии, физики, химии (topic.py, science):
   слева формулы темы, справа главное правило каждого урока */
.tb-sum-r { display: grid; align-content: start; }
.tb-sum-r > h2 { padding: 26px 26px 4px 18px; }
.tb-fl { display: grid; gap: 10px; }
.tb-fl li { display: grid; gap: 4px; padding: 14px 18px; border-radius: 16px; background: #fff; }
.tb-fl .tb-fx { display: flex; flex-wrap: wrap; gap: 2px 22px; font-size: 26px; font-weight: 650; line-height: 1.3; overflow-x: auto; }
.tb-fl small { font-size: 14px; line-height: 1.5; color: var(--muted); }
.tb-refs { padding: 4px 26px 20px 64px; font-weight: 600; color: var(--muted); }
.tb-refs a { color: var(--s-ink); text-decoration: none; }
.tb-refs a:hover { text-decoration: underline; }
.tb-fl-all { justify-self: start; font-weight: 650; color: var(--s-ink); text-decoration: none; }
.tb-fl-all:hover { text-decoration: underline; }
/* таблица из уроков темы */
.tb-tab { padding: 30px 30px 26px; }
.tb-tab h2 { margin-bottom: 20px; }
.tb-tab-w { overflow-x: auto; border-radius: 16px; border: 1px solid var(--border-2); }
.tb-tab table { width: 100%; border-collapse: collapse; font-size: 16px; line-height: 1.5; }
.tb-tab th, .tb-tab td { padding: 12px 16px; text-align: left; vertical-align: top; border-top: 1px solid var(--border-2); }
.tb-tab thead th { border-top: 0; font-size: 14px; font-weight: 750; color: var(--s-ink); background: var(--s-soft); }
.tb-tab tbody th { font-weight: 700; }
/* формулы — тёмной доской (алгебра) */
.tb-board { position: relative; overflow: hidden; padding: 38px 40px 30px; border-radius: 28px; color: #fff; background: radial-gradient(120% 140% at 100% 0%, #2a2160 0%, var(--tb-navy) 55%); box-shadow: var(--tb-sh); }
.tb-board::before { content: ""; position: absolute; inset: 0; background-image: linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px); background-size: 28px 28px; pointer-events: none; }
.tb-board > * { position: relative; }
.tb-board .tb-kicker { color: #c9b6ff; }
.tb-board h2 { margin: 8px 0 22px; color: #fff; }
.tb-board li { display: grid; grid-template-columns: 220px minmax(0, 1fr); align-items: center; gap: 24px; padding: 18px 0; border-top: 1px solid rgba(255,255,255,.12); }
.tb-board li > span { font-size: 15px; font-weight: 600; color: #b9bce0; }
.tb-board .tb-fx { font-size: 30px; font-weight: 600; line-height: 1.3; }
.tb-board mark.tb-hl { color: #ffd0ea; box-shadow: none; background: rgba(255, 122, 184, .2); }
.tb-board-note { margin-top: 18px !important; padding-top: 18px; border-top: 1px solid rgba(255,255,255,.12); color: #c3c5e6; }
/* ручные темы: шпаргалка + доп. карточки одним блоком */
.page div.tb-about > * + * { margin-top: 34px; }
.tb .tb-mm-sec h3 { margin-bottom: 14px; }
.tb-disp.is-s { font-size: 28px; }
/* счёт в уме и т. п. — карточки под доской или шпаргалкой */
.tb-mm { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.tb-mm li { display: grid; gap: 8px; align-content: start; padding: 20px 22px; border-radius: 22px; background: #fff; box-shadow: var(--tb-sh-s); }
.tb-mm .q { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; font-size: 30px; font-weight: 750; line-height: 1.2; font-variant-numeric: tabular-nums; }
.tb-mm .q em { font-style: normal; color: transparent; background: var(--s-grad); -webkit-background-clip: text; background-clip: text; }
.tb-mm small { font-size: 13px; font-weight: 650; color: var(--s-ink); }
.tb-mm p { font-size: 14px; line-height: 1.6; color: var(--muted); font-variant-numeric: tabular-nums; }

/* ── 1a. «в разработке» ─────────────────────────────────────────────── */
.tb-wip { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); overflow: hidden; }
.tb-wip-l { display: grid; align-content: start; gap: 18px; padding: 40px; }
.tb-wip-top { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.tb-wip-top img { width: 64px; height: 64px; object-fit: contain; }
.tb-wip-pill { display: inline-flex; align-items: center; gap: 8px; padding: 6px 14px 6px 10px; border-radius: 999px; font-size: 13.5px; font-weight: 700; color: var(--s-ink); background: var(--s-soft); }
.tb-wip-pill::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--s1); box-shadow: 0 0 0 4px color-mix(in srgb, var(--s1) 25%, transparent); }
.tb-wip-l .tb-acts { margin-top: 6px; }
.tb-wip-r { display: grid; align-content: start; gap: 22px; padding: 40px; background: var(--surface-2); }
.tb-wip-r h3 { font-size: 15px; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.tb-wip-r ul { display: grid; gap: 10px; margin-top: 10px; }
.tb-wip-r li { display: flex; align-items: center; gap: 12px; padding: 14px 16px; border-radius: 16px; background: #fff; font-weight: 600; line-height: 1.4; }
.tb-wip-r .tb-ok { width: 24px; height: 24px; font-size: 12px; }
.tb-wip-r li.is-soon { color: var(--muted); background: transparent; border: 1.5px dashed #d5d8e6; }
.tb-wip-r li.is-soon i { flex: none; width: 24px; height: 24px; border-radius: 50%; border: 2px dashed #c5c8da; }

/* ── 2. разобранный пример: тетрадь ─────────────────────────────────── */
.tb-ex { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 40px; padding: 40px 44px 44px 92px; border-radius: 26px; background-color: #fff; background-image: linear-gradient(#e3ecfb 1px, transparent 1px), linear-gradient(90deg, #e3ecfb 1px, transparent 1px); background-size: 26px 26px; background-position: -1px -1px; box-shadow: var(--tb-sh); overflow: hidden; }
.tb-ex::before { content: ""; position: absolute; top: 0; bottom: 0; left: 64px; width: 2px; background: #ffb3b8; }
.tb-ex-t { display: grid; align-content: start; gap: 22px; min-width: 0; }
.tb .tb-ex-t h2 { font-size: 32px; }
.tb-ex-t p { font-size: 18px; color: var(--ink-2); }
.tb-ex-t p b { color: var(--ink); }
.tb-ex-big { display: block; margin-top: 10px; font-size: 40px; font-weight: 650; line-height: 1.3; color: var(--ink); }
.tb-ex-ans { display: inline; padding: 0 .2em; font-weight: 650; color: var(--ink); background: linear-gradient(transparent 22%, #fff07a 22%, #ffe75a 88%, transparent 88%); box-decoration-break: clone; -webkit-box-decoration-break: clone; }
.tb-ex-ans.is-l { font-size: 38px; line-height: 1.4; }
.tb-ex-ans.is-m { font-size: 26px; line-height: 1.55; }
.tb-ex-ans.is-s { font-size: 19px; line-height: 1.75; font-weight: 600; }
.tb-ex-note { align-self: start; display: grid; gap: 12px; padding: 24px 22px 22px; margin-top: 10px; background: #fff3b5; border-radius: 4px 4px 18px 4px; transform: rotate(2deg); box-shadow: 0 18px 30px -18px rgba(120, 90, 0, .45); }
.tb-ex-note b { font-size: 18px; line-height: 1.3; }
.tb-ex-note p { font-size: 15px; line-height: 1.6; color: #6b5a12; }
.tb-ex-note a { justify-self: start; font-weight: 700; color: var(--ink); text-decoration: none; border-bottom: 2px solid var(--ink); }
.tb-ex-note a:hover { color: var(--s-ink); border-color: var(--s-ink); }

/* ── 3. частые ошибки ───────────────────────────────────────────────── */
.tb-mis-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.tb-mis-list > li { display: grid; grid-template-rows: auto 1fr; border-radius: 26px; background: #fff; box-shadow: var(--tb-sh-s); overflow: hidden; }
.tb-mis-top { display: grid; place-items: center; align-content: center; gap: 10px; min-height: 150px; padding: 20px; text-align: center; background: linear-gradient(170deg, #fff1f1, #fff 120%); }
.tb-mis-top img { width: 84px; height: 84px; }
.tb-mis-top .tb-fx { font-size: 26px; font-weight: 650; line-height: 1.35; }
.tb-x, .tb-v { display: inline-grid; place-items: center; flex: none; width: 26px; height: 26px; border-radius: 50%; font-size: 13px; font-weight: 800; line-height: 1; color: #fff; vertical-align: middle; font-style: normal; }
.tb-x { margin-right: 4px; background: var(--red); }
.tb-v { width: 22px; height: 22px; font-size: 12px; background: var(--tb-green); }
.tb-wrong { position: relative; display: inline-block; color: var(--red); text-decoration: none; }
.tb-wrong::after { content: ""; position: absolute; left: -4px; right: -4px; top: 50%; height: 2.5px; border-radius: 2px; background: var(--red); transform: rotate(-6deg); }
/* у дроби зачёркивание сбивает с черты — дробь просто красная */
.tb-wrong.is-frac::after { display: none; }
.tb-right { display: inline-flex; align-items: center; gap: 8px; max-width: 100%; padding: 5px 14px 5px 6px; border-radius: 999px; color: var(--tb-green); background: var(--tb-green-soft); }
.tb-right .tb-fx { font-size: 24px; }
.tb-mis-b { display: grid; align-content: start; gap: 8px; padding: 20px 22px 24px; }
.tb-mis-b small { font-size: 12.5px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--red); }
.tb-mis-b p { color: var(--ink-2); line-height: 1.85; }

/* ── 4. что внутри темы: оглавление главы ───────────────────────────── */
.tb-in-top { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: 44px; align-items: center; }
.tb-in-cv { position: relative; border-radius: 28px; overflow: hidden; box-shadow: var(--tb-sh); aspect-ratio: 16 / 9; }
.tb-in-cv .tb-in-img { width: 100%; height: 100%; object-fit: cover; }
.tb-in-cv.is-icon { display: grid; place-items: center; background: radial-gradient(70% 90% at 50% 30%, #fff, var(--s-soft) 70%); }
.tb-in-cv.is-icon .tb-in-img { width: 38%; height: auto; object-fit: contain; margin-bottom: 40px; }
.tb-in-pill { position: absolute; left: 18px; top: 18px; display: inline-flex; align-items: center; gap: 8px; padding: 5px 12px 5px 8px; border-radius: 999px; font-size: 13px; font-weight: 650; color: var(--ink); background: rgba(255,255,255,.86); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.tb-in-pill img { width: 20px; height: 20px; object-fit: contain; }
.tb-in-glass { position: absolute; left: 18px; right: 18px; bottom: 18px; display: flex; gap: 8px; flex-wrap: wrap; padding: 12px; border-radius: 18px; background: rgba(255,255,255,.72); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); }
.tb-in-glass span { padding: 6px 12px; border-radius: 999px; font-size: 13.5px; font-weight: 650; background: #fff; }
.tb-in-toc h2 { margin: 8px 0 10px; font-size: 30px; }
.tb-in-toc li { display: flex; align-items: baseline; gap: 10px; padding: 12px 0; font-size: 17px; font-weight: 600; line-height: 1.4; }
.tb-in-toc li + li { border-top: 1px solid var(--border-2); }
.tb-in-toc li small { flex: none; width: 66px; font-size: 13px; font-weight: 700; color: var(--s-ink); }
.tb-in-toc p { margin-top: 12px; font-size: 15px; line-height: 1.6; color: var(--muted); }
.tb-goals { margin-top: 40px; }
.tb-in-top + .tb-goals h3 { margin-bottom: 0; }
.tb-goals h2, .tb-goals h3 { margin-bottom: 16px; }
.tb .tb-goals h3 { margin-bottom: 16px; }
.tb-goals ul { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; }
.tb-goals li { display: grid; gap: 12px; align-content: start; padding: 22px; border-radius: 22px; background: #fff; box-shadow: var(--tb-sh-s); font-size: 17px; font-weight: 600; line-height: 1.5; }
.tb-goals .tb-ok { width: 26px; height: 26px; font-size: 12px; }
.tb-in > :first-child { margin-top: 0; }
.tb-in-ft { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; align-items: center; margin-top: 16px; }
.tb-terms { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.tb-terms > b { margin-right: 6px; font-size: 15px; }
.tb-chip { display: inline-flex; align-items: center; padding: 8px 14px; border-radius: 999px; font-size: 14.5px; font-weight: 550; line-height: 1.35; background: var(--surface); box-shadow: inset 0 0 0 1.5px var(--border); }
.tb-fgos { display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: 18px; align-items: center; padding: 22px 26px; border-radius: 22px; background: #fff; box-shadow: inset 0 0 0 1.5px var(--border); }
.tb-fgos img { width: 56px; height: 56px; }
.tb .tb-fgos h3 { font-size: 17px; letter-spacing: 0; }
.tb-fgos p { margin-top: 3px; color: var(--ink-2); line-height: 1.6; }

/* ── 5. повторить → вы здесь → дальше ───────────────────────────────── */
.tb-path { display: grid; grid-template-columns: minmax(0, 1fr) 48px minmax(0, 1.15fr) 48px minmax(0, 1fr); align-items: center; }
.tb-path.no-b { grid-template-columns: minmax(0, 1.15fr) 48px minmax(0, 1fr); }
.tb-path.no-a { grid-template-columns: minmax(0, 1fr) 48px minmax(0, 1.15fr); }
.tb-path.no-b.no-a { grid-template-columns: minmax(0, 1fr); }
.tb-path-col { display: grid; gap: 12px; }
.tb-path-col > small { font-size: 12.5px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; color: var(--muted); }
.tb-path-ar { display: grid; place-items: center; color: #b7bbd3; }
a.tb-path-t { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 14px; align-items: center; padding: 10px; border-radius: 20px; color: var(--ink); text-decoration: none; background: #fff; box-shadow: var(--tb-sh-s); transition: transform .15s, box-shadow .15s; }
a.tb-path-t:hover { color: var(--ink); transform: translateY(-2px); box-shadow: var(--tb-sh); }
a.tb-path-t img { width: 96px; height: 54px; border-radius: 12px; object-fit: cover; }
a.tb-path-t img.is-icon { object-fit: contain; padding: 4px; background: var(--s-soft); }
a.tb-path-t b { display: block; font-size: 15.5px; line-height: 1.3; }
a.tb-path-t span span { font-size: 13px; line-height: 1.4; color: var(--muted); }
a.tb-path-t:hover b { color: var(--s-ink); }
.tb-path-cur { display: grid; gap: 12px; padding: 12px 12px 18px; border-radius: 26px; background: #fff; box-shadow: var(--tb-sh), 0 0 0 2px color-mix(in srgb, var(--s1) 55%, transparent); }
.tb-path-cv { aspect-ratio: 16 / 9; border-radius: 18px; overflow: hidden; }
.tb-path-cv img { width: 100%; height: 100%; object-fit: cover; }
.tb-path-cv.is-icon { display: grid; place-items: center; background: radial-gradient(70% 90% at 50% 30%, #fff, var(--s-soft) 70%); }
.tb-path-cv.is-icon img { width: 40%; height: auto; object-fit: contain; }
.tb-path-cur > div:last-child { display: grid; gap: 6px; padding: 0 8px; }
.tb-path-cur b { font-size: 18px; line-height: 1.25; }
.tb-tag { justify-self: start; display: inline-flex; align-items: center; padding: 4px 10px; border-radius: 999px; font-size: 12.5px; font-weight: 700; color: #fff; background: var(--s-grad); }
.tb-sdot { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; color: var(--muted); }
.tb-sdot img { width: 20px; height: 20px; object-fit: contain; }
/* ссылки-пилюли ручных тем (block see) — сразу под дорожкой */
.tb .tb-see { display: flex; flex-wrap: wrap; gap: 10px; }
.page div.tb > .tb-ln + .tb-see { margin-top: 26px; }
.page div.tb > .tb-ln + .tb-more { margin-top: 44px; }
.tb-more { display: grid; gap: 12px; max-width: 860px; }
.tb-more p { color: var(--ink-2); }
.tb-more .tb-see { margin-top: 6px; }
.tb-see li { margin: 0; }
.tb-see a { display: inline-flex; align-items: center; gap: 8px; min-height: 42px; padding: 8px 18px; border-radius: 999px; font-size: 14.5px; font-weight: 650; line-height: 1.3; color: var(--ink); text-decoration: none; background: #fff; box-shadow: inset 0 0 0 1.5px var(--border); }
.tb-see a::after { content: "→"; font-weight: 700; }
.tb-see a:hover { color: var(--s-ink); box-shadow: inset 0 0 0 1.5px var(--s1); }

/* ── 6. родителю ────────────────────────────────────────────────────── */
.tb-par { display: grid; grid-template-columns: 320px minmax(0, 1fr); gap: 44px; align-items: center; padding: 36px 44px; }
.tb-par-art { display: grid; justify-items: center; gap: 16px; }
.tb-par-art .tb-fx { font-size: 40px; font-weight: 700; line-height: 1.3; }
.tb-par-art .tb-fx .frac:first-child { color: #e2702f; }
.tb-par-art > img { max-width: 240px; height: auto; }
.tb-par-art.is-photo > img { width: 100%; max-width: none; aspect-ratio: 16 / 10; object-fit: cover; border-radius: 22px; box-shadow: var(--tb-sh-s); }
.tb-par-t { display: grid; gap: 14px; }
.tb-par-t .tb-kicker { color: var(--yellow-deep); }
.tb-par-t p { font-size: 17.5px; line-height: 1.9; color: var(--ink-2); }
.tb-par-link { justify-self: start; display: inline-flex; align-items: center; gap: 8px; font-weight: 700; color: var(--yellow-deep); text-decoration: none; }
.tb-par-link:hover { color: #8a5a00; text-decoration: underline; }

/* ── 7. вопросы: переписка ──────────────────────────────────────────── */
.tb-faq-hd { display: grid; justify-items: center; gap: 10px; text-align: center; }
.tb-chat { display: grid; gap: 14px; max-width: 900px; margin: 24px auto 0; padding: 26px; border-radius: 28px; background: #fff; box-shadow: var(--tb-sh); }
.tb-chat-top { display: flex; align-items: center; gap: 10px; padding-bottom: 14px; border-bottom: 1px solid var(--border-2); font-size: 14px; font-weight: 650; color: var(--muted); }
.tb-chat-top img { width: 28px; height: 28px; object-fit: contain; }
.tb .tb-q { justify-self: end; max-width: 70%; padding: 14px 18px; border-radius: 22px 22px 6px 22px; font-size: 16px; line-height: 1.45; font-weight: 650; letter-spacing: 0; color: #fff; background: var(--tb-navy); }
.tb .tb-a { position: relative; justify-self: start; max-width: calc(82% - 46px); margin-left: 46px; padding: 14px 18px; border-radius: 22px 22px 22px 6px; font-size: 16px; line-height: 1.75; color: var(--ink-2); background: var(--surface-2); }
.tb-a::before { content: ""; position: absolute; left: -46px; bottom: 0; width: 34px; height: 34px; background: var(--tb-ico, none) center / contain no-repeat; }
.tb-a a { color: var(--s-ink); text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: 3px; text-decoration-color: color-mix(in srgb, currentColor 35%, transparent); }

/* ── 8. финальный призыв ────────────────────────────────────────────── */
.tb-cta { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .95fr); min-height: 440px; border-radius: 32px; background: #fff; box-shadow: var(--tb-sh); overflow: hidden; }
.tb-cta-t { position: relative; z-index: 1; display: grid; align-content: center; gap: 18px; padding: 48px 20px 48px 52px; }
.tb-cta-chk { display: flex; align-items: center; gap: 12px; justify-self: start; padding: 10px 16px 10px 10px; border-radius: 18px; background: #fff7e8; }
.tb-cta-chk img { width: 40px; height: 40px; flex: none; }
.tb-cta-chk b { display: block; font-size: 15px; line-height: 1.35; }
.tb-cta-chk span { font-size: 13.5px; line-height: 1.4; color: var(--ink-2); }
.tb .tb-cta h2 { font-size: clamp(30px, 3.6vw, 44px); }
.tb-note { font-size: 14px; color: var(--muted); }
.tb-cta-mos { position: relative; min-height: 220px; overflow: hidden; }
.tb-cta-mos > div { position: absolute; left: 10px; top: -60px; display: grid; grid-template-columns: repeat(3, 230px); gap: 14px; transform: rotate(-10deg); }
.tb-cta-mos img { width: 230px; height: auto; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 18px; box-shadow: 0 18px 30px -20px rgba(25, 30, 80, .5); }
.tb-cta-mos::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, #fff 0%, rgba(255,255,255,0) 30%); }

/* ── планшет ────────────────────────────────────────────────────────── */
@media (max-width: 1080px) {
  .tb-ex { grid-template-columns: 1fr; }
  .tb-mis-list { grid-template-columns: 1fr; }
  .tb-in-top, .tb-in-ft { grid-template-columns: 1fr; }
  .tb-in-top { gap: 28px; }
  .tb-wip { grid-template-columns: 1fr; }
  .tb-path, .tb-path.no-a, .tb-path.no-b { grid-template-columns: 1fr; gap: 6px; }
  .tb-path-ar { transform: rotate(90deg); height: 40px; }
  .tb-path-cur { max-width: 520px; }
  .tb-par { grid-template-columns: 1fr; }
  .tb-par-art.is-photo { max-width: 420px; }
  .tb-cta { grid-template-columns: 1fr; }
  .tb-cta-t { padding: 40px 32px 10px; }
  .tb-cta-mos { height: 240px; }
  .tb-cta-mos::after { background: linear-gradient(180deg, #fff 0%, rgba(255,255,255,0) 35%); }
}

/* ── телефон ────────────────────────────────────────────────────────── */
@media (max-width: 760px) {
  .tb { margin-top: 64px; }
  .page div.tb > * + *, .tb > * + * { margin-top: 64px; }
  .tb h3 { font-size: 19px; }
  .tb-lead { font-size: 16px; }
  .tb-sheet { grid-template-columns: 1fr; padding: 8px; }
  .tb-sheet-l { padding: 24px 20px; }
  .tb-sheet-l > p { font-size: 16px; }
  .tb-rules { padding: 4px 14px 8px; }
  .tb-sum-r > h2 { padding: 20px 14px 0; }
  .tb-refs { padding: 0 14px 14px 58px; }
  .tb-fl .tb-fx { font-size: 21px; }
  .tb-tab { padding: 22px 8px 12px; }
  .tb-tab table { font-size: 14px; }
  .tb-tab th, .tb-tab td { padding: 9px 8px; }
  .tb-tab thead th { font-size: 12.5px; }
  /* слова в ячейках переносим по слогам, а названия строк — нет */
  .tb-tab td { hyphens: auto; overflow-wrap: break-word; }
  .tb-tab tbody th { hyphens: manual; }
  .tb-disp { font-size: 30px; padding: 16px 18px; }
  .tb-disp.is-s { font-size: 21px; }
  .tb-board { padding: 28px 20px 18px; border-radius: 24px; }
  .tb-board li { grid-template-columns: 1fr; gap: 6px; padding: 14px 0; }
  .tb-board .tb-fx { font-size: 22px; }
  .tb-mm { grid-template-columns: 1fr; }
  .tb-wip-l, .tb-wip-r { padding: 24px 20px; }
  .tb-ex { padding: 28px 18px 28px 44px; gap: 26px; }
  .tb-ex::before { left: 28px; }
  .tb .tb-ex-t h2 { font-size: 26px; }
  .tb-ex-t p { font-size: 16.5px; }
  .tb-ex-big { font-size: 32px; }
  .tb-ex-ans.is-l { font-size: 32px; }
  .tb-ex-ans.is-m { font-size: 22px; }
  .tb-ex-ans.is-s { font-size: 17px; }
  .tb-ex-note { transform: rotate(1deg); }
  .tb-mis-top { min-height: 120px; }
  .tb-mis-top .tb-fx { font-size: 22px; }
  .tb-right .tb-fx { font-size: 20px; }
  .tb-in-cv { border-radius: 22px; }
  .tb-in-pill { left: 10px; top: 10px; font-size: 12px; }
  .tb-in-glass { left: 10px; right: auto; bottom: 10px; padding: 6px; gap: 6px; border-radius: 14px; }
  .tb-in-glass span { font-size: 12px; padding: 4px 9px; }
  .tb-in-glass span:nth-child(3) { display: none; }
  .tb-in-toc h2 { font-size: 26px; }
  .tb-in-toc li { font-size: 16px; }
  .tb-in-toc li small { width: 58px; }
  .tb-goals { margin-top: 28px; }
  .tb-goals li { display: flex; align-items: center; padding: 16px 18px; font-size: 16px; }
  .tb-fgos { grid-template-columns: 44px minmax(0, 1fr); padding: 18px; }
  .tb-fgos img { width: 44px; height: 44px; }
  a.tb-path-t { grid-template-columns: 80px minmax(0, 1fr); }
  a.tb-path-t img { width: 80px; height: 45px; }
  .tb-par { padding: 24px 18px; gap: 20px; }
  .tb-par-art > img { max-width: 180px; }
  .tb-par-t p { font-size: 16.5px; }
  .tb-chat { padding: 16px; border-radius: 24px; }
  .tb .tb-q { max-width: 88%; font-size: 15.5px; }
  .tb .tb-a { max-width: calc(100% - 42px); margin-left: 42px; font-size: 15.5px; }
  .tb-a::before { left: -42px; width: 30px; height: 30px; }
  .tb-cta { border-radius: 26px; }
  .tb-cta-t { padding: 30px 20px 10px; }
  .tb-cta-mos > div { grid-template-columns: repeat(3, 150px); gap: 10px; left: -20px; top: -10px; }
  .tb-cta-mos img { width: 150px; border-radius: 12px; }
}