/* Внутренние страницы, вторая редакция (27.10, консилиум этапа 1). Основа — прототип арт-директора.
   Первый экран с визиткой; «список + панель»; калькулятор; цены; «папка дела»; финал — одна тёмная плашка.
   Без sticky и pin. Текст на телефоне — не мельче 16 px (НФТ-1). Токены — base.css + themes.css. */

.kick { font: 600 .75rem/1.25 var(--f-sans); letter-spacing: .14em; text-transform: uppercase; color: var(--gold-lo); }
.law { font-size: .8125em; color: var(--t-d2); white-space: normal; }
@media (max-width: 599px) { .kick { font-size: .8125rem; } }

/* кнопка звонка: на компьютере — номер, на телефоне — «Позвонить» */
.btn .x-call { display: none; }
@media (max-width: 599px) { .btn .x-num { display: none; } .btn .x-call { display: inline; } }

/* ================= ПЕРВЫЙ ЭКРАН: текст + визитка ================= */
.xh { position: relative; background: var(--haze); color: var(--ink); padding: calc(var(--hdr) + var(--s4)) 0 var(--s5); }
.xh__grid { display: grid; gap: var(--s5); }
@media (min-width: 960px) { .xh__grid { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); column-gap: var(--s7); align-items: center; } }
.xh .crumbs { margin-bottom: 0; }
.xh__t { margin-top: var(--s2); font: var(--w-h) calc(clamp(2.125rem, 1.4rem + 2.2vw, 3.125rem) * var(--k-h))/1.06 var(--f-serif); letter-spacing: var(--ls-h); text-wrap: balance; }
.xh__t .hero__pre { display: inline; margin: 0; font: inherit; letter-spacing: inherit; color: inherit; }
html[data-theme] .xh__t .gw { color: var(--gold-disp) !important; }
.xh__lead { margin-top: var(--s4); max-width: 34em; font-size: var(--fs-lead); line-height: 1.5; color: var(--ink-2); }
.xh__cta { display: flex; flex-wrap: wrap; gap: var(--s3); margin-top: var(--s5); }
.xh__meta { margin-top: var(--s3); font-size: .9375rem; color: var(--ink-2); }
@media (max-width: 599px) {
  .xh { padding-top: calc(var(--hdr) + var(--s2)); }
  .xh .crumbs ol { flex-wrap: nowrap; overflow: hidden; white-space: nowrap; }
  .xh__cta .btn { flex: 1 1 0; padding-inline: var(--s4); }
  .xh__meta { display: none; }
  .xh__lead { font-size: 1.0625rem; }
}

/* сигнал о сроке — ведёт к инструменту */
.dl { display: inline-flex; align-items: center; gap: var(--s3); margin-top: var(--s4); padding: 10px 14px 10px 12px; border-radius: var(--r-card);
  background: color-mix(in srgb, var(--gold) 20%, transparent); color: var(--ink); font-size: 1rem; line-height: 1.4; text-decoration: none; }
.dl > .i { flex: none; width: 22px; height: 22px; color: var(--gold-lo); }
.dl u { text-decoration: none; font-weight: 600; color: var(--gold-hi); white-space: nowrap; }
@media (hover: hover) and (pointer: fine) { .dl:hover { background: color-mix(in srgb, var(--gold) 28%, transparent); } }

/* визитка: телефон — строка «кто ведёт» под H1 (миниатюра 44×55); компьютер — карточка-удостоверение */
.vk { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: var(--s3); align-items: center; margin-top: var(--s3); }
.vk__ph { width: 44px; aspect-ratio: 4 / 5; height: auto; object-fit: cover; object-position: 50% 14%; border-radius: var(--r-sm); }
.vk__n { font: var(--w-h) calc(1.0625rem * var(--k-h))/1.2 var(--f-serif); color: var(--ink); }
.vk__s { display: none; }
.vk__reg { display: flex; flex-wrap: wrap; align-items: center; gap: 0 8px; margin-top: 2px; font-size: .9375rem; line-height: 1.4; color: var(--ink-2); }
.vk__reg a { display: inline-flex; align-items: center; gap: 4px; min-height: 32px; font-weight: 500; color: var(--gold-hi); text-underline-offset: 3px; }
.vk__reg .i { width: 15px; height: 15px; }
.vk__f { display: none; }
@media (max-width: 959px) {
  .xh__grid { display: flex; flex-direction: column; gap: 0; }
  .xh__copy { display: contents; }
  .xh .crumbs { order: 1; } .xh__t { order: 2; } .vk { order: 3; } .xh__lead { order: 4; } .xh__cta { order: 5; } .xh__copy > .dl { order: 6; align-self: stretch; } .xh__meta { order: 7; }
}
@media (min-width: 960px) {
  .vk { grid-template-columns: 152px minmax(0, 1fr); gap: var(--s5); align-items: start; margin-top: 0; padding: var(--s5); border: 1px solid var(--line-l);
    border-radius: var(--r-card); background: var(--white); box-shadow: 0 28px 56px -44px rgba(43, 36, 29, .55); }
  .vk__ph { width: 152px; }
  .vk__n { font-size: calc(1.25rem * var(--k-h)); }
  .vk__s { display: block; margin-top: 4px; font-size: .9375rem; line-height: 1.35; color: var(--ink-2); }
  .vk__reg { margin-top: 6px; }
  .vk__f { display: grid; gap: 6px; margin-top: var(--s3); padding-top: var(--s3); border-top: 1px solid var(--line-l); font-size: .9375rem; color: var(--ink); }
  .vk__f li { position: relative; padding-left: 16px; line-height: 1.4; }
  .vk__f li::before { content: ""; position: absolute; left: 1px; top: .55em; width: 6px; height: 6px; border-radius: 50%; background: var(--gold); }
}

/* «Срочно»: лента чипов; на телефоне листается пальцем (не прокруткой страницы) */
.urg { display: flex; align-items: center; gap: var(--s3) var(--s4); margin-top: var(--s5); padding-top: var(--s4); border-top: 1px solid var(--line-l); }
.urg__k { flex: none; display: inline-flex; align-items: center; gap: 8px; }
.urg__k .i { width: 18px; height: 18px; color: var(--gold-lo); }
.urg__l { display: flex; flex-wrap: wrap; gap: 8px; overflow-x: auto; scroll-snap-type: x proximity; scrollbar-width: none; overscroll-behavior-x: contain; }
.urg__l::-webkit-scrollbar { display: none; }
.urg__l a { scroll-snap-align: start; flex: none; display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 16px;
  border: 1px solid color-mix(in srgb, var(--gold) 65%, transparent); border-radius: var(--r-pill); background: var(--white); color: var(--ink);
  font-size: .9375rem; font-weight: 500; white-space: nowrap; text-decoration: none; transition: background-color 200ms ease, border-color 200ms ease; }
.urg__l a .i { width: 16px; height: 16px; color: var(--gold-hi); }
@media (hover: hover) and (pointer: fine) { .urg__l a:hover { background: color-mix(in srgb, var(--gold) 18%, var(--white)); border-color: var(--gold); } }
@media (max-width: 599px) {
  .urg { flex-direction: column; align-items: stretch; gap: var(--s2); }
  .urg__l { flex-wrap: nowrap; margin-inline: calc(-1 * var(--gut)); padding-inline: var(--gut); scroll-padding-inline: var(--gut); }
  .urg__l a { font-size: 1rem; }
}

/* ================= СПИСОК + ПАНЕЛЬ =================
   Компьютер: слева список, справа панель выбранного пункта. Телефон: раскрывающийся список.
   Одна разметка: панель лежит внутри пункта; на ≥960 px панель — правая колонка общей сетки. */
.x-head { display: grid; gap: var(--s3); }
@media (min-width: 960px) { .x-head { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); column-gap: var(--s6); align-items: end; } }
.x-head .h2 + * { margin-top: 0; }
.x-head__lead { max-width: 36em; color: var(--t-d2); font-size: 1.0625rem; line-height: 1.5; }
.x-head--stack { grid-template-columns: 1fr !important; }
.x-head--stack .x-head__lead { max-width: 44em; }
.md { position: relative; margin-top: var(--s5); }
.md__list { border-top: 1px solid var(--line-l); }
.md__i { border-bottom: 1px solid var(--line-l); }
.md__btn { position: relative; isolation: isolate; overflow: hidden; display: grid; grid-template-columns: 28px minmax(0, 1fr) 20px; align-items: center;
  gap: var(--s4); width: 100%; min-height: 72px; padding: var(--s3) var(--s3) var(--s3) var(--s4); text-align: left; color: var(--t-d); scroll-margin-top: calc(var(--hdr) + 16px); }
.md__fill { position: absolute; inset: 0; z-index: -1; background: color-mix(in srgb, var(--gold) 17%, transparent); transform: translateY(101%); }
.md__btn[aria-expanded="true"] .md__fill { transform: none; }
.md__btn[aria-expanded="true"]::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: var(--gold); }
.md__ic { width: 28px; height: 28px; color: var(--gold-lo); stroke-width: 1.35; }
.md__num { font: 500 .875rem/1 var(--f-num); color: var(--gold-lo); letter-spacing: .04em; }
.md__t b { display: block; font: var(--w-h) calc(1.125rem * var(--k-h))/1.22 var(--f-serif); }
.md__t small { display: block; margin-top: 4px; font: 600 .75rem/1.25 var(--f-sans); letter-spacing: .12em; text-transform: uppercase; color: var(--gold-lo); }
.md__go { width: 20px; height: 20px; color: var(--gold-hi); transition: transform 300ms var(--ease-out); }
.md__p { padding: 0 var(--s3) var(--s5) calc(28px + 2 * var(--s4)); }
.md__card { color: var(--t-d); }
.md__k { font: 600 .75rem/1.25 var(--f-sans); letter-spacing: .14em; text-transform: uppercase; color: var(--gold-lo); }
.md__h { display: none; }
.md__intro { margin-top: var(--s2); line-height: 1.55; color: var(--t-d2); }
.md__s { border-top: 1px solid var(--line-l); }
.md__s a { display: grid; grid-template-columns: minmax(0, 1fr) 20px; align-items: center; gap: 2px var(--s3); min-height: 52px; padding: var(--s2) 0;
  border-bottom: 1px solid var(--line-l); color: var(--t-d); text-decoration: none; }
.md__s b { font-weight: 500; font-size: 1rem; line-height: 1.35; }
.md__s span { display: none; }
.md__s .i { grid-column: 2; grid-row: 1 / span 2; color: var(--gold-hi); transition: transform 200ms var(--ease-out); }
.md__f { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s3) var(--s4); margin-top: var(--s4); }
.md__more { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; font-weight: 500; color: var(--gold-hi); text-decoration: none; }
.md__steps { display: grid; gap: var(--s3); margin-top: var(--s3); counter-reset: s; }
.md__steps li { position: relative; padding-left: 36px; line-height: 1.45; color: var(--t-d2); }
.md__steps li::before { counter-increment: s; content: counter(s); position: absolute; left: 0; top: -1px; display: grid; place-items: center; width: 26px; height: 26px;
  border-radius: 50%; background: var(--gold); color: var(--white); font: 600 .8125rem/1 var(--f-num); }
.md__steps b { color: var(--t-d); }
.md--sit .md__p { padding-left: var(--s4); }
@media (max-width: 959px) {
  .md__btn[aria-expanded="true"] .md__go { transform: rotate(90deg); }
  .md__btn[aria-expanded="false"] + .md__p { display: none; }
  .md__t small { font-size: .8125rem; }
  .md__k--desk { display: none; }
}
@media (max-width: 599px) { .md__p { padding-left: var(--s4); padding-right: 0; } .md__steps li, .md__intro { font-size: 1rem; } }
@media (hover: hover) and (pointer: fine) {
  .md__btn:hover .md__go { transform: translateX(4px); }
  .md__s a:hover b { color: var(--gold-hi); }
  .md__s a:hover .i { transform: translateX(4px); }
}
@media (min-width: 960px) {
  .md__list { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); grid-template-rows: repeat(var(--rows), auto) 1fr; column-gap: var(--s6); border-top: 0; }
  .md__i { display: contents; }
  .md__btn { grid-column: 1; border-bottom: 1px solid var(--line-l); }
  .md__i:first-child .md__btn { border-top: 1px solid var(--line-l); }
  .md__p { grid-column: 2; grid-row: 1 / -1; align-self: start; padding: 0; }
  .md__btn[aria-expanded="false"] + .md__p { display: none; }
  .md__btn[aria-expanded="true"] .md__go { transform: translateX(4px); }
  .md__card { padding: var(--s6); border: 1px solid var(--line-l); border-radius: var(--r-card); background: var(--white); box-shadow: 0 32px 64px -52px rgba(43, 36, 29, .6); }
  .md__h { display: block; margin-top: var(--s2); font: var(--w-h) calc(1.625rem * var(--k-h))/1.15 var(--f-serif); color: var(--t-d); text-wrap: balance; }
  .md--sit .md__h { margin: 0 0 var(--s4); }
  .md__h + .md__k { margin-top: var(--s4); }
  .md--sit .md__h + .md__k { margin-top: 0; }
  .md__s { margin-top: var(--s4); }
  .md__s a { padding: var(--s3) 0; }
  .md__s b { font-weight: 600; font-size: 1.0625rem; }
  .md__s span { display: block; grid-column: 1; color: var(--t-d2); font-size: .9375rem; line-height: 1.45; }
  .md__f { justify-content: space-between; margin-top: var(--s5); }
}
.nf2 { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s2) var(--s4); margin-top: var(--s5); color: var(--t-d); }
.nf2 a { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; font-weight: 600; color: var(--gold-hi); text-decoration: none; }
@media (min-width: 960px) { .nf2 { width: calc((100% - var(--s6)) * 5 / 12); } }

/* ответ в навигаторе ситуаций: что сделать сейчас → срок → чего не делать → чем помогу → кнопки */
.sn__now { margin-top: var(--s2); padding: var(--s3) var(--s4); border-left: 3px solid var(--gold); border-radius: 0 var(--r-sm) var(--r-sm) 0;
  background: color-mix(in srgb, var(--gold) 13%, transparent); font-size: 1.0625rem; line-height: 1.5; color: var(--t-d); }
ol.sn__now { display: grid; gap: var(--s2); counter-reset: n; }
ol.sn__now li { position: relative; padding-left: 30px; }
ol.sn__now li::before { counter-increment: n; content: counter(n); position: absolute; left: 0; top: .1em; display: grid; place-items: center; width: 22px; height: 22px;
  border-radius: 50%; background: var(--gold); color: var(--white); font: 600 .75rem/1 var(--f-num); }
.sn__term { display: flex; align-items: flex-start; gap: 8px; margin-top: var(--s3); padding: 8px 14px; border-radius: var(--r-card);
  border: 1px solid color-mix(in srgb, var(--gold) 55%, transparent); font-size: .9375rem; font-weight: 500; line-height: 1.45; color: var(--t-d); }
.sn__term .i { flex: none; width: 16px; height: 16px; margin-top: .2em; color: var(--gold-lo); }
.sn__k2 { margin-top: var(--s4); }
.sn__do, .sn__dont { display: grid; gap: 8px; margin-top: var(--s2); }
.sn__do li, .sn__dont li { position: relative; padding-left: 22px; line-height: 1.45; color: var(--t-d); }
.sn__do li::before { content: ""; position: absolute; left: 3px; top: .5em; width: 8px; height: 4px; border-left: 1.7px solid var(--gold-lo); border-bottom: 1.7px solid var(--gold-lo); transform: rotate(-45deg); }
.sn__dont li::before, .sn__dont li::after { content: ""; position: absolute; left: 3px; top: .72em; width: 10px; height: 1.6px; background: color-mix(in srgb, var(--t-d) 55%, transparent); transform: rotate(45deg); }
.sn__dont li::after { transform: rotate(-45deg); }
.sn__say { display: flex; gap: 10px; margin-top: var(--s4); padding: var(--s3) var(--s4); border-radius: var(--r-card); background: color-mix(in srgb, var(--gold) 9%, var(--white)); line-height: 1.5; color: var(--t-d); }
.sn__say .i { flex: none; width: 18px; height: 18px; margin-top: .15em; color: var(--gold-lo); }
.sn__cta { display: flex; flex-wrap: wrap; gap: var(--s3); }
@media (min-width: 960px) { .sn__now { font-size: 1.125rem; } }
@media (max-width: 599px) { .sn__term, .sn__do li, .sn__dont li, .sn__say { font-size: 1rem; } .sn__cta .btn { flex: 1 1 100%; } }

/* ================= ИНСТРУМЕНТ: калькулятор / чек-лист ================= */
.tl { display: grid; gap: var(--s5); margin-top: var(--s5); }
@media (min-width: 960px) { .tl.is-live { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); column-gap: var(--s6); align-items: stretch; } }
.tl__fb { max-width: 46em; line-height: 1.55; color: var(--t-d); }
.tl__f { display: grid; gap: var(--s3); align-content: start; }
.seg { display: inline-flex; flex-wrap: wrap; gap: 4px; padding: 4px; margin: 0 0 var(--s2); border: 1px solid var(--line-l); border-radius: 26px; background: color-mix(in srgb, var(--white) 60%, transparent); }
.seg legend { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.seg label { position: relative; display: inline-flex; align-items: center; min-height: 44px; padding: 6px 16px; border-radius: 22px; font-weight: 500; font-size: .9375rem; line-height: 1.25; cursor: pointer; color: var(--t-d2); }
.seg input { position: absolute; opacity: 0; pointer-events: none; }
.seg label:has(input:checked) { background: var(--gold); color: var(--white); }
.seg label:has(input:focus-visible) { outline: 2px solid var(--gold-hi); outline-offset: 2px; }
.tl__lab { font-weight: 500; color: var(--t-d); }
.tl__inp { width: 100%; min-height: 52px; padding: 0 var(--s4); border: 1px solid color-mix(in srgb, var(--t-d) 30%, transparent); border-radius: var(--r-card); background: var(--white); color: var(--t-d); font: 500 1.0625rem/1 var(--f-num); }
.tl__inp:focus-visible { outline: 2px solid var(--gold-hi); outline-offset: 1px; }
.tl__tg { display: flex; align-items: center; gap: 10px; min-height: 44px; color: var(--t-d); cursor: pointer; }
.tl__tg input { width: 20px; height: 20px; accent-color: var(--gold-hi); }
.tl__hint { font-size: .9375rem; line-height: 1.5; color: var(--t-d2); }
.tl__f .btn { justify-self: start; }
.tl__r { position: relative; display: flex; flex-direction: column; padding: var(--s5); border-radius: var(--r-card); background: var(--white); border: 1px solid var(--line-l); box-shadow: 0 32px 64px -52px rgba(43, 36, 29, .6); }
.tl__date { margin-top: var(--s2); overflow: hidden; font: var(--w-h) calc(clamp(1.75rem, 1.3rem + 1.6vw, 2.5rem) * var(--k-h))/1.12 var(--f-serif); color: var(--t-d); }
.tl__date span { display: inline-block; }
.tl__date small { font: 500 1rem/1 var(--f-sans); color: var(--t-d2); }
.tl__line { display: block; width: 100%; height: 44px; margin-top: var(--s4); overflow: visible; }
.tl__line .base { stroke: var(--line-l); stroke-width: 2; stroke-dasharray: 2 6; stroke-linecap: round; fill: none; }
.tl__line .done { stroke: var(--gold); stroke-width: 3; stroke-linecap: round; fill: none; }
.tl__line .p { fill: var(--white); stroke: var(--gold); stroke-width: 2; }
.tl__line .now { fill: var(--gold); }
.tl__line .end { fill: var(--t-d); }
.tl__lbl { display: flex; justify-content: space-between; gap: var(--s3); margin-top: 4px; font-size: .875rem; line-height: 1.35; color: var(--t-d2); }
.tl__lbl span:last-child { text-align: right; }
.tl__lbl b { display: block; color: var(--t-d); font-weight: 600; }
.tl__after { margin-top: var(--s4); line-height: 1.5; color: var(--t-d); }
.tl__exp { margin-top: var(--s2); padding: var(--s3) var(--s4); border-left: 3px solid var(--gold); background: color-mix(in srgb, var(--gold) 13%, transparent); line-height: 1.5; color: var(--t-d); }
.tl__cta { display: flex; flex-wrap: wrap; gap: var(--s3); margin-top: auto; padding-top: var(--s5); }
.tl__note { margin-top: var(--s4); max-width: 60em; font-size: .9375rem; line-height: 1.5; color: var(--t-d2); }
.tl__sum { margin-top: var(--s2); font: var(--w-h) calc(clamp(1.75rem, 1.3rem + 1.6vw, 2.5rem) * var(--k-h))/1.12 var(--f-serif); color: var(--t-d); }
.tl__sum small { font: 500 1rem/1.3 var(--f-sans); color: var(--t-d2); }
.tl__ck { display: grid; gap: 2px; }
.tl__ck label { display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: 12px; align-items: start; padding: 10px 0; border-bottom: 1px solid var(--line-l); line-height: 1.45; color: var(--t-d); cursor: pointer; }
.tl__ck input { width: 20px; height: 20px; margin-top: 1px; accent-color: var(--gold-hi); }
.tl__ck label:has(input:checked) span { color: var(--t-d2); text-decoration: line-through; text-decoration-color: color-mix(in srgb, var(--gold) 70%, transparent); }
.tl__prog { font: 500 1rem/1.3 var(--f-num); color: var(--gold-hi); }
.tl__meter { height: 6px; margin-top: var(--s3); border-radius: 3px; background: var(--line-l); overflow: hidden; }
.tl__meter i { display: block; height: 100%; width: 0; background: var(--gold); transition: width 400ms var(--ease-out); }
@media (max-width: 599px) {
  .seg { display: grid; grid-template-columns: 1fr; border-radius: 16px; } .seg label { border-radius: 12px; }
  .tl__lbl { display: grid; grid-template-columns: 1fr 1fr; } .tl__lbl [data-left] { grid-column: 1 / -1; grid-row: 2; text-align: left; }
  .tl__r { padding: var(--s4); } .tl__cta .btn { flex: 1 1 0; padding-inline: var(--s3); }
  .tl__note, .tl__hint, .tl__lbl, .tl__fb, .tl__ck label { font-size: 1rem; }
}

/* ================= ЦЕНЫ: вкладки на телефоне, две колонки на компьютере ================= */
.pz { margin-top: var(--s5); }
.pz__tabs { display: inline-flex; gap: 4px; padding: 4px; border: 1px solid var(--line-l); border-radius: var(--r-pill); background: color-mix(in srgb, var(--white) 60%, transparent); }
.pz__tabs button { min-height: 44px; padding: 0 18px; border-radius: var(--r-pill); font-weight: 500; color: var(--t-d2); }
.pz__tabs button[aria-selected="true"] { background: var(--gold); color: var(--white); }
.pz__cols { display: grid; gap: var(--s5); margin-top: var(--s4); }
.pz__h { display: none; }
.pz__l { border-top: 1px solid var(--line-l); }
.pz__l li { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: baseline; gap: 4px var(--s4); padding: var(--s3) 0; border-bottom: 1px solid var(--line-l); }
.pz__l b { font-weight: 500; color: var(--t-d); }
.pz__l i { font-style: normal; font: 500 1.0625rem/1.2 var(--f-num); color: var(--gold-hi); white-space: nowrap; text-align: right; }
.pz__l small { grid-column: 1 / -1; color: var(--t-d2); font-size: .9375rem; }
.pz__l .pz__free i { color: var(--t-d); }
.pz__n { margin-top: var(--s3); font-size: .9375rem; line-height: 1.5; color: var(--t-d2); }
.pz__gets { margin-top: var(--s4); padding: var(--s3) var(--s4); border-left: 3px solid var(--gold); background: color-mix(in srgb, var(--gold) 10%, transparent); line-height: 1.55; color: var(--t-d); }
.pz__cta { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s3) var(--s4); margin-top: var(--s5); }
@media (min-width: 960px) {
  .pz__tabs { display: none; }
  .pz__cols { grid-template-columns: 1fr 1fr; column-gap: var(--s7); margin-top: 0; }
  .pz__cols > [hidden] { display: block !important; }
  .pz__h { display: block; margin-bottom: var(--s3); font: 600 .8125rem/1.2 var(--f-sans); letter-spacing: .14em; text-transform: uppercase; color: var(--gold-lo); }
}
@media (max-width: 599px) { .pz__l small, .pz__n { font-size: 1rem; } .pz__cta .btn { flex: 1 1 100%; } }

/* ================= ПРИМЕР: «папка дела» ================= */
.exf { position: relative; margin-top: var(--s6); }
.exf__tab { display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 18px; border-radius: var(--r-card) var(--r-card) 0 0; background: var(--g9); font: 600 .75rem/1 var(--f-sans); letter-spacing: .14em; text-transform: uppercase; color: var(--gold-lo); }
.exf__sheet { padding: var(--s5); border-radius: 0 var(--r-card) var(--r-card) var(--r-card); background: var(--g9); }
.exf__paper { padding: var(--s5); border-radius: var(--r-sm); background: var(--white); box-shadow: 0 18px 40px -30px rgba(43, 36, 29, .5); }
.exf h3 { font: var(--w-h) calc(1.375rem * var(--k-h))/1.2 var(--f-serif); color: var(--t-d); }
.exf__cols { display: grid; gap: var(--s4); margin-top: var(--s4); }
@media (min-width: 900px) { .exf__cols { grid-template-columns: 1fr 1fr; gap: var(--s6); } }
.exf__cols p, .exf__cols li { color: var(--t-d); line-height: 1.5; }
.exf__cols .md__k { margin-bottom: 6px; }
.exf__cols ol { display: grid; gap: 6px; padding-left: 1.2em; list-style: decimal; }
.exf__res { margin-top: var(--s4); padding-top: var(--s3); border-top: 1px solid var(--line-l); line-height: 1.55; color: var(--t-d); }
.exf__note { margin-top: var(--s2); font-size: .875rem; line-height: 1.5; color: var(--t-d2); }
.exf__more { margin-top: var(--s4); }
@media (max-width: 599px) { .exf__sheet { padding: var(--s2); } .exf__paper { padding: var(--s4); } .exf__note { font-size: .9375rem; } }

/* ================= СМОТРИТЕ ТАКЖЕ: одна строка ================= */
.see-sec { padding: 0 0 var(--s2); }
.see { display: flex; align-items: center; gap: var(--s3) var(--s4); padding-block: var(--s5); border-top: 1px solid var(--line-l); }
.see__k { flex: none; }
.see__l { display: flex; flex-wrap: wrap; gap: 8px; }
.see__l a { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 16px; border: 1px solid var(--line-l); border-radius: var(--r-pill);
  background: color-mix(in srgb, var(--white) 60%, transparent); color: var(--t-d); text-decoration: none; white-space: nowrap; }
.see__l a .i { width: 16px; height: 16px; color: var(--gold-hi); }
@media (hover: hover) and (pointer: fine) { .see__l a:hover { border-color: var(--gold); background: var(--white); } }
@media (max-width: 599px) {
  .see { flex-direction: column; align-items: stretch; }
  .see__l { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin-inline: calc(-1 * var(--gut)); padding-inline: var(--gut); }
  .see__l::-webkit-scrollbar { display: none; }
}

/* ================= ФИНАЛ: одна тёмная плашка на странице, фото в кабинете ================= */
.fin { background: var(--ink); color: var(--haze); padding: var(--s8) 0; }
.fin__in { display: grid; gap: var(--s5); align-items: center; }
@media (min-width: 960px) { .fin__in { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); column-gap: var(--s8); } }
.fin__fig { margin: 0; }
.fin__ph { display: block; width: 100%; aspect-ratio: 4 / 5; height: auto; object-fit: cover; object-position: 50% 32%; border-radius: var(--r-card); }
.fin__cap { margin-top: var(--s2); font-size: .875rem; color: color-mix(in srgb, var(--haze) 62%, transparent); }
@media (max-width: 959px) { .fin { padding: var(--s6) 0 var(--s7); } .fin__ph { aspect-ratio: 3 / 2; object-position: 50% 30%; } }
.fin .kick { color: var(--gold); }
.fin .h2 { margin-top: var(--s2); color: var(--haze); }
html[data-theme] .fin .gw { color: var(--gold) !important; }
.fin__p { margin-top: var(--s4); max-width: 34em; color: color-mix(in srgb, var(--haze) 80%, transparent); font-size: var(--fs-lead); line-height: 1.55; }
.fin__tel { display: inline-block; margin-top: var(--s5); font: 500 clamp(1.875rem, 1.3rem + 2vw, 2.75rem)/1 var(--f-num); color: var(--haze); text-decoration: none; letter-spacing: .01em; }
.fin__b { display: flex; flex-wrap: wrap; gap: var(--s3); margin-top: var(--s5); }
.fin .btn--ghost-l { --bg: transparent; --fg: var(--haze); --bd: color-mix(in srgb, var(--haze) 45%, transparent); }
@media (hover: hover) and (pointer: fine) { .fin .btn--ghost-l:hover { --bg: var(--haze); --fg: var(--ink); --bd: var(--haze); } }
.fin__facts { display: grid; gap: 6px; margin-top: var(--s6); padding-top: var(--s4); border-top: 1px solid color-mix(in srgb, var(--haze) 18%, transparent);
  font-size: .9375rem; line-height: 1.5; color: color-mix(in srgb, var(--haze) 78%, transparent); }
.fin__facts b { color: var(--haze); font-weight: 500; }
.fin__facts a { color: var(--gold); text-underline-offset: 3px; }
@media (max-width: 599px) { .fin__b .btn { flex: 1 1 100%; } .fin__facts, .fin__p { font-size: 1rem; } }

/* ================= ПУТЬ РАБОТЫ: нить как на главной ================= */
.path .thread-steps { margin-top: var(--s6); }
.path .tstep p { font-size: 1rem; }
.path .tstep__you { margin-top: 6px !important; font-size: .9375rem !important; color: var(--t-d2); }
.path .tstep__you b { color: var(--t-d); font-weight: 600; }
.path .tstep__note { display: inline-block; margin-top: 8px; padding: 4px 10px; border-radius: var(--r-pill); background: color-mix(in srgb, var(--gold) 16%, transparent); font-size: .875rem; color: var(--t-d); }
@media (max-width: 767px) { .path .tsteps { gap: var(--s5); } .path .tstep__you { display: none; } .path .tstep__note { font-size: .9375rem; } }

/* ================= ВОПРОСЫ: аккордеон ================= */
.faq .qa__a p { font-size: 1rem; line-height: 1.6; }

/* телефон: вместо цепочки крошек — одна ссылка «‹ раздел выше» (BreadcrumbList остаётся в разметке) */
@media (max-width: 599px) {
  .xh .crumbs li { display: none; }
  .xh .crumbs li:has(+ li[aria-current="page"]) { display: inline-flex; }
  .xh .crumbs li:has(+ li[aria-current="page"])::before { content: ""; width: 6px; height: 6px; border-top: 1.5px solid var(--gold-lo); border-right: 1.5px solid var(--gold-lo); transform: rotate(-135deg); }
}

/* длинные подписи — обычным регистром: срок в строке ситуации, заголовок результата калькулятора */
.md--sit .md__t small { font: 500 .875rem/1.35 var(--f-sans); letter-spacing: 0; text-transform: none; color: var(--gold-lo); }
.tl__r > .md__k:first-child { font: 600 .9375rem/1.4 var(--f-sans); letter-spacing: 0; text-transform: none; color: var(--gold-lo); }
@media (max-width: 599px) { .md--sit .md__t small { font-size: .9375rem; } .tl__r > .md__k:first-child { font-size: 1rem; } }
/* чек-лист: карточка результата по высоте содержимого */
.tl--checklist.is-live { align-items: start; }
.tl--checklist .tl__cta { margin-top: 0; }

/* 29.10: строка о срочных вызовах (вечер, выходные) видна и на телефоне */
@media (max-width: 599px) { .xh__meta--urgent { display: block; order: 7; font-size: 1rem; line-height: 1.45; } }

/* 29.10 (конверсия, этап 2): в визитке — «с 2008 года · более 1000 дел»; на телефоне видна бесплатная консультация; строка часов видна везде */
.vk__s2 { margin-top: 2px; font-size: .9375rem; line-height: 1.4; color: var(--ink); font-weight: 500; }
.vk__free { margin-top: 2px; font-size: .9375rem; line-height: 1.4; color: var(--gold-hi); font-weight: 600; }
@media (min-width: 960px) { .vk__free { display: none; } .vk__s2 { margin-top: 6px; } }
@media (max-width: 959px) { .vk__s2 { font-size: .875rem; } }
@media (max-width: 599px) { .xh__meta { display: block; order: 7; font-size: 1rem; line-height: 1.45; } .vk__s2, .vk__free { font-size: .9375rem; } }

/* сумма в результате: выезжает из маски, не наезжая на текст ниже */
.tl__sum { overflow: hidden; }
.tl__sum span { display: inline-block; }


/* Этап 2, дизайнер-аниматор (29.10). Сквозные правки шаблона направлений — по 8 страницам сразу.
   Отчёт — 02_Исследование/Консилиум — внутренние страницы/Этап 2. Без sticky и pin. */

/* ---------- [1] «Узнаёте свою ситуацию?» ---------- */
/* [1.1] компьютер: все ответы стоят в одной ячейке сетки, неактивные — невидимы, но занимают место.
   Высота блока = самый длинный ответ, поэтому при переключении страница ниже не прыгает (было ±29…113 px) */
@media (min-width: 960px) {
  .md--sit .md__btn[aria-expanded="false"] + .md__p { display: block; visibility: hidden; pointer-events: none; }
}
/* [1.2] телефон и планшет: в раскрытом пункте подпись-срок под заголовком не дублирует плашку срока в ответе */
@media (max-width: 959px) {
  .md--sit .md__btn[aria-expanded="true"] .md__t small { display: none; }
}
/* [1.3] строка «Нет вашей ситуации?» последним пунктом списка (разметка — в отчёте, blocks2.sitnav).
   На компьютере встаёт в пустоту под коротким списком (3–4 ситуации: 150–240 px пустоты слева) */
.md__nf { padding: var(--s4) 0 0; color: var(--t-d2); line-height: 1.5; }
.md__nf a { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; font-weight: 600; color: var(--gold-hi); text-decoration: none; }
.md__nf .i { width: 18px; height: 18px; }
@media (min-width: 960px) { .md__nf { grid-column: 1; align-self: start; padding: var(--s5) var(--s3) 0 var(--s4); } }

/* ---------- [2] Телефон: текст не мельче 16 px (НФТ-1), подписи капсом — 13 px, как .kick ---------- */
@media (max-width: 599px) {
  .seg label, .vk__reg, .md--sit .md__t small, .exf__note, .fin__cap { font-size: 1rem; }
  .md__num { font-size: .9375rem; }
  .md__k, .exf__tab, .see__k { font-size: .8125rem; }
  .ftr__note { font-size: .9375rem; }
}

/* ---------- [3] Зоны нажатия не меньше 44 px ---------- */
.vk__reg a { min-height: 44px; }                                             /* было 32 px */
.fin__tel { display: inline-flex; align-items: center; min-height: 44px; }   /* было 30 px */
.dl { min-height: 44px; }                                                    /* было 42 px на планшете и компьютере */

/* ---------- [4] Инструменты ---------- */
/* [4.1] дата результата: «28 апреля 2027 / среда, включительно» — без висячего «включительно» на третьей строке */
.tl__date small { white-space: nowrap; }
@media (max-width: 599px) { .tl__date small { display: block; margin-top: 6px; } }
/* [4.2] пустое состояние срока: на месте даты — прочерк, карточка той же высоты, что и с результатом */
.tl__date--idle span { color: color-mix(in srgb, var(--t-d) 28%, transparent); }
/* [4.3] маска для суммы алиментов и неустойки — уже внесена в inner2.css 29.10 (02:54), здесь не повторяется */
/* [4.4] ошибка ввода — у поля; цвет — как у ошибок формы на главной */
.tl__ferr { margin-top: -4px; color: #B3261E; font-size: .9375rem; line-height: 1.4; }
.tl__inp[aria-invalid="true"] { border-color: #B3261E; }
@media (max-width: 599px) { .tl__ferr { font-size: 1rem; } }
/* [4.5] алименты до ввода: три доли, выбранная подсвечена — карточка не пустая */
.tl__shares { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: var(--s3); }
.tl__shares li { display: grid; align-content: start; gap: 4px; padding: 10px 12px; border: 1px solid var(--line-l); border-radius: var(--r-sm); transition: border-color 200ms ease, background-color 200ms ease; }
.tl__shares b { font: var(--w-h) calc(1.75rem * var(--k-h))/1 var(--f-serif); color: var(--t-d); }
.tl__shares span { font-size: .9375rem; line-height: 1.3; color: var(--t-d2); }
.tl__shares .is-on { border-color: var(--gold); background: color-mix(in srgb, var(--gold) 12%, transparent); }
.tl__shares .is-on span { color: var(--t-d); }
@media (max-width: 599px) { .tl__shares li { padding: 8px 10px; } .tl__shares span { font-size: 1rem; } }
/* [4.6] чек-лист: отмеченный пункт не зачёркивается (зачёркнутое читается как «неверно»), галочка говорит сама */
.tl__ck label:has(input:checked) span { color: var(--t-d); text-decoration: none; }
/* [4.7] iOS Safari: дата в поле по левому краю, как остальные поля */
@supports (-webkit-touch-callout: none) {
  .tl__inp[type="date"], .tl__inp[type="datetime-local"] { -webkit-appearance: none; appearance: none; text-align: left; }
  .tl__inp::-webkit-date-and-time-value { text-align: left; }
}

/* ---------- [5] «Как это бывает на практике»: ярлык папки на телефоне не сминается в 40 px ---------- */
.exf__tab { height: auto; min-height: 40px; padding: 9px 18px; line-height: 1.35; max-width: calc(100% - 24px); }
/* рубрика в ярлыке — в <span class="exf__rub"> (blocks2.example_x); на телефоне ярлык короткий: «Типичная ситуация» */
@media (max-width: 599px) { .exf__rub { display: none; } }

/* ---------- [6] «Как будет идти работа» ---------- */
/* [6.1] плашка срока у шага — по ширине текста, а не во всю колонку (на телефоне растягивалась сеткой шага) */
.path .tstep__note { justify-self: start; border-radius: 14px; text-wrap: balance; }
/* [6.2] планшет 768–959: пять колонок по 110 px давали шаги по 17 строк — нить вертикальная, как на телефоне */
@media (min-width: 768px) and (max-width: 959px) {
  .path .thread--h { display: none; }
  .path .thread--v { display: block; left: 19px; top: 24px; width: 10px; height: var(--v-len, 80%); }
  .path .tsteps { grid-template-columns: 1fr; gap: var(--s5); }
  .path .tstep { display: grid; grid-template-columns: 48px minmax(0, 1fr); column-gap: var(--s4); text-align: left; padding: 0; }
  .path .tstep__dot { grid-row: span 2; margin: 0; }
  .path .tstep__t { align-self: center; }
  .path .tstep p { grid-column: 2; }
}

/* ---------- [7] Вопросы: заголовок слева в две строки, без одинокого «делам» / «спорах» на третьей ---------- */
@media (min-width: 960px) { .faq__side .h2 { font-size: calc(var(--fs-h2) * var(--k-h) * .8); } }

/* [8] старый раскрывающийся подвал удалён 05.11 — подвал один для всех страниц, стили в base.css */

/* визитка на телефоне — 16 px */
@media (max-width: 599px) { .vk__s2, .vk__free { font-size: 1rem; } }
/* 29.10: у тарифов одна строка действий вместо кнопки в каждой карточке */
.tf__cta { display: flex; flex-wrap: wrap; gap: var(--s3); margin-top: var(--s5); }
@media (max-width: 599px) { .tf__cta .btn { flex: 1 1 100%; } }
/* 29.10: на телефоне кнопки первого экрана повторяли нижнюю панель «Позвонить / Написать» — убраны, панель всегда под рукой */
@media (max-width: 767px) { .xh__cta, .ab-h__cta { display: none; } }
/* финал: крупный номер сам по себе кнопка звонка (вторая кнопка «Позвонить» убрана) */
.fin__tel { display: inline-flex; align-items: center; gap: 12px; }
.fin__tel .i { width: .8em; height: .8em; color: var(--gold); }
/* 29.10, этап 4: строки списка без одинокого слова на второй строке; планшет — подпись ряда «Срочно» над плашками */
.md__t b { text-wrap: balance; }
@media (min-width: 600px) and (max-width: 959px) { .urg { flex-direction: column; align-items: flex-start; gap: var(--s2); } }
/* памятка на случай обыска — нумерованные шаги без галочек */
.tl__memo { display: grid; counter-reset: m; }
.tl__memo li { position: relative; padding: 10px 0 10px 40px; border-bottom: 1px solid var(--line-l); line-height: 1.45; color: var(--t-d); }
.tl__memo li::before { counter-increment: m; content: counter(m); position: absolute; left: 0; top: 9px; display: grid; place-items: center; width: 26px; height: 26px;
  border-radius: 50%; background: var(--gold); color: var(--white); font: 600 .8125rem/1 var(--f-num); }
.tl__after--1 { margin-top: var(--s2); }
@media (max-width: 599px) { .tl__memo li { font-size: 1rem; } }

/* 30.10: выбор вариантов блоков (assets/js/vpick.js, только по ссылке с ?review). Перед релизом удалить */
.pk { display: contents; }
.pk__bar { position: relative; z-index: 5; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 10px max(16px, calc((100vw - 1180px) / 2));
  background: #1F1F24; color: #F4F1EA; font: 500 .875rem/1.3 var(--f-sans); }
.pk__t { margin-right: 6px; font-size: .75rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--gold, #B49C73); }
.pk__bar button { min-height: 36px; padding: 0 14px; border: 1px solid rgba(244, 241, 234, .3); border-radius: 999px; background: none; color: inherit; font: inherit; cursor: pointer; }
.pk__bar button b { font-weight: 700; }
.pk__bar button[aria-pressed="true"] { background: var(--gold, #B49C73); border-color: var(--gold, #B49C73); color: #1F1F24; }
.pk-sum { padding: 32px 0 40px; background: #1F1F24; color: #F4F1EA; }
.pk-sum__t { margin-bottom: 12px; font-weight: 600; }
.pk-sum ul { margin: 0 0 16px; padding-left: 1.2em; line-height: 1.6; }
.pk-sum__ok { margin-left: 12px; color: var(--gold, #B49C73); }

/* 30.10: документы — политика обработки персональных данных и согласие (page_legal.py) */
.lg__in { max-width: 820px; }
.lg__t { margin-top: var(--s4); font: var(--w-h) calc(clamp(2rem, 1.5rem + 2vw, 3rem) * var(--k-h))/1.1 var(--f-serif); color: var(--t-d); text-wrap: balance; }
.lg__ver { margin-top: var(--s3); color: var(--t-d2); font-size: .9375rem; }
.lg__toc { margin-top: var(--s5); padding: var(--s4) var(--s5); border-radius: var(--r-card); background: color-mix(in srgb, var(--white) 55%, transparent); }
.lg__toc ol { margin: 0; padding-left: 1.3em; columns: 2 18em; column-gap: var(--s6); line-height: 1.6; }
.lg__toc a { color: var(--t-d); text-underline-offset: 3px; }
.lg__body { margin-top: var(--s6); color: var(--t-d); line-height: 1.65; }
.lg__body p + p { margin-top: var(--s3); }
.lg__h { margin: var(--s6) 0 var(--s3); font: var(--w-h) calc(1.5rem * var(--k-h))/1.25 var(--f-serif); scroll-margin-top: 96px; }
.lg__body a { color: var(--gold-lo); text-underline-offset: 3px; }
.lg__todo { padding: 0 3px; border-radius: 3px; background: color-mix(in srgb, var(--gold) 35%, transparent); color: inherit; }

/* 05.11: красным — изменённые и новые цены и услуги, заказчик проверяет. Перед релизом снять: убрать class="chg" в _src/site */
/* .chg — красные пометки сняты 05.11 (позиции подтверждены) */
/* 05.11 (тестирование): оглавление политики — зона нажатия не меньше 32 px */
.lg__toc a { display: inline-block; padding-block: 6px; }

/* 05.11, заказчик: «Что случилось?» на компьютере — аккордеон: тема раскрывается под строкой, правой панели нет */
@media (min-width: 960px) {
  .md--hub .md__list { display: block; max-width: 920px; }
  .md--hub .md__i { display: block; }
  .md--hub .md__i:first-child .md__btn { border-top: 1px solid var(--line-l); }
  .md--hub .md__p { margin: 0; padding: var(--s3) 0 var(--s5); }
  .md--hub .md__btn[aria-expanded="false"] + .md__p { display: none; }
  .md--hub .md__k--desk, .md--hub .md__h { display: none; }   /* название темы уже в строке */
  .md--hub .md__s { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: var(--s5); }
  .md--hub .md__btn[aria-expanded="true"] .md__go { transform: rotate(90deg); }
}
@media (hover: hover) and (pointer: fine) {
  .md--hub .md__btn[aria-expanded="false"]:hover { background: color-mix(in srgb, var(--gold) 6%, transparent); }   /* наведение — легче выбранной */
}
@media (min-width: 960px) { .md--hub .md__card { padding-top: var(--s4); } }
/* 05.11 (тестирование): на узких экранах сетки финалов — одна колонка шириной экрана */
@media (max-width: 959px) { .vfm__in, .fin__in { grid-template-columns: minmax(0, 1fr); } .vfm__in > *, .fin__in > * { min-width: 0; } }

/* 05.11, заказчик: окно справа стоит на месте; если помещается в экран — закреплено, пока листаешь список (inner.js → is-stick) */
@media (min-width: 960px) {
  .is-stick .md__p, .js .is-stick .vc-ch__a { position: sticky; top: var(--stick, 88px); align-self: start; }
}

/* ---------- 05.11, заказчик: «зачем эта информация, если есть раздел обо мне? не дублирование ли?» ----------
   Визитка в первом экране повторяла «Обо мне» на каждой странице — убрана (имя и фото — в финале). Первый экран — в одну колонку */
.xh__grid { display: flex; flex-direction: column; gap: 0; }
.xh__copy { display: contents; }
.xh .crumbs { order: 1; } .xh__t { order: 2; } .xh .vk { order: 3; } .xh__lead { order: 4; } .xh__cta { order: 5; } .xh__copy > .dl { order: 6; } .xh__meta { order: 7; }
@media (min-width: 960px) { .xh__copy > .dl { align-self: center; } }   /* первый экран на компьютере центрирован */

/* 05.11: «Сколько стоит» на направлении — одна колонка: строка о консультации, цены направления, одна кнопка */
.pz--one { max-width: 820px; }
.pz__c { margin-bottom: var(--s4); padding: var(--s3) var(--s4); border-left: 3px solid var(--gold); background: color-mix(in srgb, var(--gold) 10%, transparent); line-height: 1.55; color: var(--t-d); }
.pz__c a { color: var(--gold-hi); font-weight: 500; text-underline-offset: 3px; }
.pz__more { display: none; }
@media (max-width: 599px) {
  .pz--one:not(.is-all) .pz__l li:nth-child(n+5) { display: none; }
  .pz--one:not(.is-all) .pz__more { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; margin-top: var(--s2); font-weight: 600; color: var(--gold-hi); }
  .pz__more .i { width: 16px; height: 16px; }
}
