/* Раскладка страницы «разбор дела» (/uslugi/vozrazhenie-na-iskovoe-zayavlenie/).
 *
 * Вёрстка из макета оператора. Селекторы ОГРАНИЧЕНЫ .rz-root намеренно: имена в
 * макете общие (.form, .step, .terms, .page), и без корня они пересеклись бы с
 * правилами темы и Kadence.
 *
 * Компонентный слой и токены (dh-*) — в dh-design-system.css, он грузится первым.
 * Значения не хардкодить: если у величины есть токен --dh-*, брать токен
 * (.design-sync/conventions.md, раздел «Идиома»).
 */

/* Контейнер колонки страницы. Раньше он приходил от .dh-wrap оболочки (правило копии
   системы), и вместе с колонкой в него попадали общие шапка и подвал: знак шапки стоял на
   x=164 вместо 64, на 390 — на 32 вместо 16. Оболочка теперь как на всех тёмных страницах
   (без контейнера), а тот же контейнер — те же токены и пороги 1100/768 — держит корень
   страницы: тело страницы остаётся там, где было. */
.rz-root{max-width:var(--dh-content-max);margin-inline:auto;padding-inline:var(--dh-space-2xl)}
@media (max-width:1100px){.rz-root{padding-inline:var(--dh-space-lg)}}
@media (max-width:768px){.rz-root{padding-inline:var(--dh-space-md)}}
.rz-root .page{max-width:1100px;margin:0 auto;padding:var(--dh-space-xl) 24px 140px}
.rz-root .hero{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(280px,1fr);gap:var(--dh-space-2xl);align-items:start;padding:var(--dh-space-2xl) 0 var(--dh-space-xl)}
.rz-root .hero h1{margin:14px 0 var(--dh-space-md);font-size:clamp(32px,4.4vw,52px);line-height:1.06;letter-spacing:-.035em;font-weight:var(--dh-weight-black);text-wrap:balance}
.rz-root .hero__sub{margin:0;font-size:19px;line-height:1.5;color:var(--dh-text-2);max-width:46ch;text-wrap:pretty}
.rz-root .ctas{display:flex;gap:var(--dh-space-md);flex-wrap:wrap;margin-top:var(--dh-space-xl)}
.rz-root .trust{margin:var(--dh-space-md) 0 0;font-size:var(--dh-body-sm);color:var(--dh-text-3)}
.rz-root .terms{background:var(--dh-surface);border:1px solid var(--dh-border);border-radius:var(--dh-radius-lg);padding:var(--dh-space-lg)}
.rz-root .terms__row{display:flex;gap:var(--dh-space-md);padding:14px 0;border-top:1px solid var(--dh-border)}
.rz-root .terms__row:first-of-type{border-top:0;padding-top:4px}
.rz-root .terms__row b{flex:0 0 96px;font-size:23px;font-weight:var(--dh-weight-black);letter-spacing:-.02em;line-height:1.1}
.rz-root .terms__row span{font-size:13.5px;line-height:1.45;color:var(--dh-text-3)}
.rz-root .terms__foot{margin:var(--dh-space-md) 0 0;font-size:13px;line-height:1.45;color:var(--dh-text-4);border-top:1px solid var(--dh-border);padding-top:var(--dh-space-md)}
.rz-root section{padding:var(--dh-space-2xl) 0;border-top:1px solid var(--dh-border)}
.rz-root .sec__eyebrow{font-size:12.5px;letter-spacing:var(--dh-tracking-eyebrow);text-transform:uppercase;color:var(--dh-text-4);font-weight:var(--dh-weight-bold);margin:0 0 10px}
.rz-root h2.sec{margin:0 0 var(--dh-space-lg);font-size:clamp(24px,2.6vw,32px);letter-spacing:-.025em;font-weight:var(--dh-weight-bold)}
.rz-root .steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:var(--dh-space-lg)}
.rz-root .step b{display:block;font-size:13px;letter-spacing:.1em;color:var(--dh-glyph-lt);font-weight:var(--dh-weight-bold);margin-bottom:10px}
.rz-root .step h3{margin:0 0 8px;font-size:18px;font-weight:var(--dh-weight-bold)}
.rz-root .step p{margin:0;font-size:var(--dh-body-sm);line-height:1.55;color:var(--dh-text-3)}
.rz-root .step{border-top:2px solid var(--dh-blue);padding-top:var(--dh-space-md)}
.rz-root .formwrap{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(260px,1fr);gap:var(--dh-space-2xl);align-items:start}
.rz-root .form{background:var(--dh-surface);border:1px solid var(--dh-border);border-radius:var(--dh-radius-xl);padding:var(--dh-space-xl);display:grid;gap:var(--dh-space-lg)}
.rz-root .fld label{display:block;font-size:15px;font-weight:var(--dh-weight-bold);margin-bottom:4px}
.rz-root .fld p{margin:0 0 10px;font-size:13px;color:var(--dh-text-4);line-height:1.45}
.rz-root .fld input, .rz-root .fld textarea{width:100%;box-sizing:border-box;background:var(--dh-bg);border:1px solid var(--dh-border);border-radius:var(--dh-radius-md);padding:13px 14px;color:var(--dh-text);font:inherit;font-size:15px;min-height:48px}
.rz-root .fld textarea{min-height:104px;resize:vertical}
/* Кольцо фокуса полей — канон из общего слоя (outline 2px #5fa0ff, offset 2px, без transition):
   свой `outline` здесь перебивал его по специфичности и рисовал #1a6ef5 с offset 1px, а
   `border-color: transparent` стирал рамку под кольцом. Остаётся только рамка цветом кольца. */
.rz-root .fld input:focus-visible, .rz-root .fld textarea:focus-visible{border-color:var(--dh-focus)}
.rz-root .fld input[type="date"]::-webkit-calendar-picker-indicator{filter:invert(1) opacity(.65);cursor:pointer}
/* Поле в ошибке (razbor-form.js ставит aria-invalid="true"): рамка цветом ошибки, DESIGN.md
   States. Меняется ТОЛЬКО цвет — ширина рамки одна во всех состояниях, иначе поле дёргается.
   Отдельный :focus-вариант нужен, потому что правила фокуса выше задают цвет рамки при
   фокусе — без него красная рамка пропадала бы, едва человек ставит курсор исправлять поле.
   Его специфичность (0,4,1) выше любого из них, поэтому исход не зависит от порядка правил.
   Кольцо фокуса не трогаем: своего outline этот блок не задаёт. */
.rz-root .fld input[aria-invalid="true"], .rz-root .fld textarea[aria-invalid="true"],
.rz-root .fld input[aria-invalid="true"]:focus, .rz-root .fld textarea[aria-invalid="true"]:focus{border-color:var(--dh-error)}
.rz-root .drop{border:1.5px dashed var(--dh-border-strong);border-radius:var(--dh-radius-lg);padding:var(--dh-space-xl);text-align:center;background:var(--dh-bg)}
.rz-root .drop b{display:block;font-size:15px;margin-bottom:6px}
.rz-root .drop span{font-size:13px;color:var(--dh-text-4)}
.rz-root #dzin-rz-files{list-style:none;padding:0;margin:var(--dh-space-md) 0 0;display:grid;gap:var(--dh-space-sm)}
.rz-root #dzin-rz-files:empty{display:none}
.rz-root #dzin-rz-files li{display:flex;align-items:center;justify-content:space-between;gap:var(--dh-space-sm);padding:12px var(--dh-space-md);border:1px solid var(--dh-border);border-radius:var(--dh-radius-md);background:var(--dh-surface);color:var(--dh-text-2);font-size:var(--dh-body-sm);overflow-wrap:anywhere}
.rz-root .dzin-form-upload__remove{flex:none;margin:0;padding:0 0 0 12px;border:0;background:none;color:var(--dh-text-3);font:inherit;font-size:18px;line-height:1;cursor:pointer}
.rz-root .dzin-form-upload__remove:hover{color:var(--dh-text)}
.rz-root .consent{display:flex;gap:12px;align-items:flex-start;font-size:13px;line-height:1.5;color:var(--dh-text-3)}
.rz-root .consent input{margin-top:3px;width:18px;height:18px;flex:0 0 auto;accent-color:var(--dh-blue)}
.rz-root .submit{display:flex;gap:var(--dh-space-md);align-items:center;flex-wrap:wrap}
.rz-root .submit small{font-size:13px;color:var(--dh-text-4)}
.rz-root .aside{position:sticky;top:24px;display:grid;gap:var(--dh-space-md)}
.rz-root .tl{background:var(--dh-surface-strong);border:1px solid var(--dh-border);border-radius:var(--dh-radius-lg);padding:var(--dh-space-lg)}
.rz-root .tl h3{margin:0 0 var(--dh-space-md);font-size:16px;font-weight:var(--dh-weight-bold)}
.rz-root .tl ol{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.rz-root .tl li{display:grid;grid-template-columns:auto minmax(0,1fr);gap:12px;font-size:13.5px;line-height:1.45;color:var(--dh-text-2)}
.rz-root .tl li i{width:9px;height:9px;border-radius:50%;background:var(--dh-blue);margin-top:5px;font-style:normal}
.rz-root .tl li:last-child i{background:var(--dh-success)}
.rz-root .tl li b{display:block;font-weight:var(--dh-weight-bold);color:var(--dh-text)}
.rz-root .refusal{background:rgba(245,124,26,.09);border:1px solid rgba(245,124,26,.32);border-radius:var(--dh-radius-lg);padding:var(--dh-space-lg)}
.rz-root .refusal h3{margin:0 0 8px;font-size:16px;font-weight:var(--dh-weight-bold)}
.rz-root .refusal p{margin:0;font-size:13.5px;line-height:1.5;color:var(--dh-text-2)}
.rz-root .limits{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:var(--dh-space-lg)}
.rz-root .limits div{border-left:2px solid var(--dh-border-strong);padding-left:var(--dh-space-md)}
.rz-root .limits h3{margin:0 0 6px;font-size:15px;font-weight:var(--dh-weight-bold)}
.rz-root .limits p{margin:0;font-size:13.5px;line-height:1.5;color:var(--dh-text-3)}
.rz-root .faq{display:grid;gap:2px}
.rz-root .faq details{background:var(--dh-surface);border:1px solid var(--dh-border);border-radius:var(--dh-radius-md);padding:16px var(--dh-space-lg)}
.rz-root .faq summary{display:flex;align-items:center;justify-content:space-between;gap:var(--dh-space-md);cursor:pointer;font-size:16px;font-weight:var(--dh-weight-bold);list-style:none}
.rz-root .faq summary::-webkit-details-marker{display:none}
.rz-root .faq summary::after{content:'+';flex:none;color:var(--dh-blue-300);font-size:1.25em;line-height:1}
.rz-root .faq details[open] summary::after{content:'−'}
.rz-root .faq p{margin:10px 0 0;font-size:var(--dh-body-sm);line-height:1.55;color:var(--dh-text-3);max-width:66ch}
.rz-root .disclaimer{margin-top:var(--dh-space-xl);font-size:13px;line-height:1.55;color:var(--dh-text-4);max-width:72ch}
.rz-root a{color:var(--dh-blue-300);text-decoration:none}
.rz-root a:hover{color:var(--dh-blue-200);text-decoration:underline}
/* Ссылки в сплошном тексте — подпись согласия («согласие», «политика») и почта на экране «заявка
   принята». Цвет ссылки #7facf7 в тексте #9db4d0 даёт 1,07:1 при минимуме 3:1: отличает ссылку
   только оттенок (WCAG 1.4.1, axe link-in-text-block). Подчёркивание — признак, не зависящий от
   цвета. Кнопки-ссылки .dh-btn исключены: у них своё правило ниже (a.dh-btn — без подчёркивания). */
.rz-root .consent a,.rz-root p a:not(.dh-btn){text-decoration:underline;text-underline-offset:3px}
@media (max-width:860px){
.rz-root .hero,.rz-root .formwrap{grid-template-columns:minmax(0,1fr)}
.rz-root .aside{position:static}
.rz-root .page{padding-bottom:96px}
}

/* Служебные элементы формы. В макете их нет — он статичный, без состояний:
   предупреждение о близкой дате заседания, ошибка отправки и экраны ожидания/успеха
   появляются только в рабочей версии. Значения — токенами системы, не хардкодом. */
.rz-root .rz-warn{margin:8px 0 0;color:var(--dh-text-3);font-size:var(--dh-body-sm);line-height:1.5}
.rz-root .rz-error{margin:var(--dh-space-md) 0 0;color:var(--dh-error);font-size:var(--dh-body-sm);line-height:1.5}
.rz-root .rz-state{margin:0;color:var(--dh-text-2);font-size:var(--dh-body-sm);line-height:1.6}
.rz-root #dzin-rz-done h3{margin:0 0 var(--dh-space-sm)}

/* ВОЗВРАТ СИСТЕМНЫХ ЦВЕТОВ. Тема Kadence красит h1-h3 и ссылки своими правилами, и её
   специфичность выше, чем у наследования от .dh-root и у одноклассовых правил системы.
   В макете этого не видно — там темы нет вовсе; на сайте заголовки получали #1a1a2e на
   тёмном фоне (контраст 1.1:1, текст практически невидим), а кнопка CTA — голубой цвет
   ссылок Kadence на оранжевом (2.08:1). Замер: WCAG-аудит страницы 15.09.2026.
   Значения берём ТОКЕНАМИ системы, а не пишем цвет заново. */
.rz-root h1,
.rz-root h2,
.rz-root h3,
.rz-root h4{color:var(--dh-text)}
.rz-root .dh-btn--primary{color:var(--dh-on-cta)}
.rz-root .dh-btn--outline{color:var(--dh-text)}
.rz-root a.dh-btn{text-decoration:none}

/* [hidden] обязан побеждать. Экраны «отправляем» и «заявка принята» размечены атрибутом
   hidden и лежат на .form, а у .form задан display:grid — явный display отменяет
   display:none, который hidden даёт лишь дефолтным стилем браузера. Без этого правила
   клиент видит форму, «отправляем заявку» и «заявка принята» ОДНОВРЕМЕННО, ещё ничего не
   отправив. Поймано скриншотом живой страницы 15.09.2026: расчёт контрастов эту поломку
   не видит в принципе. Тот же приём применён к предупреждению о дате и блоку ошибки. */
.rz-root [hidden]{display:none !important}