/* ПравоРадар — страницы (D1 публичные + D3 портальные) */

/* ══ HERO (публичная главная) ══ */
.hero { padding-block: var(--space-10) var(--space-8); }
.hero-grid { display: grid; grid-template-columns: 1fr 0.8fr; gap: var(--space-10); align-items: center; }
.hero h1 { margin-top: var(--space-3); }
.hero .lead { margin-top: var(--space-4); max-width: 42ch; }
.hero-cta { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3); margin-top: var(--space-6); }
.hero-assurance { display: flex; flex-direction: column; gap: 8px; margin-top: var(--space-5); }
.hero-assurance .trust-item { font-size: 14px; }

/* Упрощённая hero-карточка */
.preview-card {
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--radius-lg); padding: var(--space-5);
  box-shadow: var(--shadow-md);
}
.preview-card__title { font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.06em; color: var(--text-muted); margin-bottom: var(--space-3); }
.check-list { display: flex; flex-direction: column; gap: var(--space-3); }
.check-list li { display: flex; gap: 10px; align-items: flex-start; font-size: 14px; color: var(--text-main); }
.check-list .ic { flex: 0 0 auto; width: 18px; height: 18px; margin-top: 1px; }
.check-list .done { color: var(--success); }
.check-list .pending { color: var(--text-muted); }
.preview-divider { height: 1px; background: var(--border); margin: var(--space-4) 0; }
.preview-result { font-size: 14px; color: var(--text-secondary); line-height: 1.5; }
.preview-result strong { color: var(--text-main); }

@media (max-width: 860px) {
  .hero { padding-block: var(--space-8) var(--space-6); }
  .hero-grid { grid-template-columns: 1fr; gap: var(--space-6); }
  .hero-cta .btn { width: 100%; }
  .preview-card { padding: var(--space-4); }
}

/* ══ Публичные секции ══ */
.section-head { margin-bottom: var(--space-8); }
.section-head .h2 { margin-top: var(--space-2); }
.section-head .lead { margin-top: var(--space-3); max-width: 56ch; }

.steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-4); }
.step-card {
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--radius-lg); padding: var(--space-4);
}
.step-card__num {
  display: inline-flex; align-items: center; justify-content: center;
  width: 32px; height: 32px; border-radius: 50%;
  background: var(--info-soft); color: var(--info); font-weight: 700; font-size: 14px;
  margin-bottom: var(--space-3);
}
.step-card h3 { font-size: 16px; font-weight: 600; margin-bottom: var(--space-2); }
.step-card p  { font-size: 14px; color: var(--text-secondary); }
@media (max-width: 760px) { .steps { grid-template-columns: 1fr; } }

.value-card {
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--radius-lg); padding: var(--space-4);
  display: flex; flex-direction: column; gap: 8px;
}
.value-card .ic { width: 22px; height: 22px; color: var(--accent); }
.value-card h3  { font-size: 16px; font-weight: 600; }
.value-card p   { font-size: 14px; color: var(--text-secondary); }

.card-grid { display: grid; gap: var(--space-3); }
.card-grid--2 { grid-template-columns: repeat(2, 1fr); }
.card-grid--3 { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 860px) { .card-grid--3 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .card-grid--2, .card-grid--3 { grid-template-columns: 1fr; } }

.case-list-chips { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.chip {
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--radius-pill); padding: 6px 14px;
  font-size: 14px; color: var(--text-secondary);
}

.security-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--space-3); }
.security-item { display: flex; gap: 10px; align-items: flex-start; font-size: 14px; color: var(--text-secondary); }
.security-item svg { color: var(--success); flex: 0 0 auto; margin-top: 2px; }
@media (max-width: 640px) { .security-grid { grid-template-columns: 1fr; } }

.lawyer-band {
  background: var(--primary); color: #fff; border-radius: var(--radius-lg);
  padding: var(--space-8);
}
.lawyer-band .h2 { color: #fff; }
.lawyer-band p   { color: rgba(255,255,255,0.82); margin-top: var(--space-3); max-width: 50ch; font-size: 15px; }

.final-cta { text-align: center; }
.final-cta .h2 { max-width: 22ch; margin-inline: auto; }
.final-cta p   { margin-top: var(--space-3); }
.final-cta .btn { margin-top: var(--space-5); }

/* ══ Auth ══ */
.auth-wrap { display: flex; justify-content: center; padding-block: var(--space-12); }
.auth-card { width: 100%; max-width: 400px; }
.auth-card .h3 { font-size: 22px; font-weight: 700; margin-bottom: var(--space-2); }
.auth-card .intro { color: var(--text-secondary); font-size: 14px; margin-bottom: var(--space-5); }
.consent-block { margin: var(--space-4) 0; display: flex; flex-direction: column; gap: var(--space-2); }
.turnstile-holder { margin: var(--space-4) 0; min-height: 65px; }
.resend-line { margin-top: var(--space-4); font-size: 14px; color: var(--text-secondary); }
@media (max-width: 480px) { .auth-wrap { padding-block: var(--space-8); } }

/* ══ Портальный ОБЗОР ══ */
.overview-grid {
  display: grid; grid-template-columns: 1fr 272px; gap: var(--space-5); align-items: start;
}
.overview-grid__main  { min-width: 0; }
.overview-grid__aside { position: sticky; top: calc(var(--topbar-h) + var(--portal-pad)); }
@media (max-width: 900px) {
  .overview-grid { grid-template-columns: 1fr; }
  .overview-grid__aside { position: static; }
}

.case-list-mini { display: flex; flex-direction: column; }
.case-row {
  display: flex; align-items: center; gap: var(--space-3);
  padding: 12px 0; border-bottom: 1px solid var(--border); text-decoration: none;
}
.case-row:last-child { border-bottom: none; }
.case-row:hover { text-decoration: none; background: transparent; }
.case-row__body { flex: 1; min-width: 0; }
.case-row__title { font-size: 14px; font-weight: 500; color: var(--text-main); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.case-row__sub   { font-size: 13px; color: var(--text-secondary); margin-top: 2px; }
.case-row__arrow { color: var(--text-muted); flex: 0 0 auto; }

.next-actions { display: flex; flex-direction: column; }
.next-action-item {
  display: flex; gap: var(--space-3); padding: 12px 0;
  border-bottom: 1px solid var(--border); align-items: flex-start;
}
.next-action-item:last-child { border-bottom: none; }
.next-action-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--accent); flex: 0 0 auto; margin-top: 5px; }
.next-action-body { flex: 1; min-width: 0; }
.next-action-title { font-size: 14px; font-weight: 500; color: var(--text-main); line-height: 1.4; }
.next-action-case  { font-size: 13px; color: var(--text-secondary); margin-top: 2px; }

/* ══ Карточка дела — детали ══ */
.case-head { margin-bottom: var(--space-5); }
.case-head__row { display: flex; align-items: center; gap: var(--space-3); flex-wrap: wrap; margin-bottom: var(--space-2); }
.case-head__title { font-size: 20px; font-weight: 700; color: var(--text-main); }
.back-link { display: inline-flex; align-items: center; gap: 5px; font-size: 13px; color: var(--text-secondary); margin-bottom: var(--space-3); }
.back-link:hover { color: var(--text-main); text-decoration: none; }

.extracted-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.extracted-table th { text-align: left; font-size: 12px; font-weight: 600; color: var(--text-muted); padding: 8px 10px; border-bottom: 1px solid var(--border); background: var(--surface-soft); }
.extracted-table td { padding: 10px 10px; border-bottom: 1px solid var(--border); vertical-align: top; }
.extracted-table tr:last-child td { border-bottom: none; }

/* ══ Юридические страницы ══ */
.legal-wrap { max-width: 720px; margin-inline: auto; padding-block: var(--space-12); }
.legal-wrap h1 { font-size: 26px; font-weight: 700; margin-bottom: var(--space-6); }
.legal-wrap h2 { font-size: 18px; font-weight: 600; margin-top: var(--space-8); margin-bottom: var(--space-3); }
.legal-wrap p  { font-size: 15px; color: var(--text-secondary); margin-bottom: var(--space-4); line-height: 1.65; }

/* ══ Survey (dev) ══ */
.survey-shell { max-width: 600px; margin-inline: auto; }
.survey-step { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg); padding: var(--space-6); margin-top: var(--space-5); }
.choice { display: block; border: 1px solid var(--border-strong); border-radius: var(--radius-md); padding: 12px 14px; margin-bottom: 8px; cursor: pointer; font-size: 14px; }
.choice:hover { border-color: var(--primary); background: var(--surface-soft); }
.showcase-block { margin-bottom: var(--space-10); }

/* ════════════════════════════════════════════════════════════
   D4B — публичная главная как стартовый рабочий экран портала
   (без лендинг-hero; всё помещается в первый экран на 1366×768)
   ════════════════════════════════════════════════════════════ */
.start { padding-block: 20px 22px; }

.start__head { margin-bottom: var(--space-3); }
.start__title { font-size: 25px; line-height: 1.2; font-weight: 700; letter-spacing: -0.01em; color: var(--text-main); }
.start__desc {
  margin-top: 5px; font-size: 14px; line-height: 1.45; color: var(--text-secondary);
  max-width: 86ch;
}
.start__example-link { margin-left: 6px; font-size: 14px; color: var(--accent); white-space: nowrap; }

/* Рабочая сетка 70 / 30 */
.start__grid {
  display: grid; grid-template-columns: minmax(0, 1fr) 320px;
  gap: var(--space-5); align-items: start;
}
.start__main { min-width: 0; }

/* Выбор типа документа — компактная строка переключателей */
.doctype-switch { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-bottom: var(--space-3); }
.doctype-switch__item {
  display: inline-flex; align-items: center; height: 34px; padding: 0 13px;
  border: 1px solid var(--border-strong); border-radius: var(--radius-sm);
  background: var(--surface); cursor: pointer;
  font-size: 13px; color: var(--text-secondary); white-space: nowrap;
  transition: border-color var(--transition), background var(--transition), color var(--transition);
}
.doctype-switch__item input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.doctype-switch__item:hover { border-color: var(--primary); color: var(--text-main); }
.doctype-switch__item:has(input:checked) {
  background: var(--primary); border-color: var(--primary); color: #fff; font-weight: 500;
}
.doctype-switch__item:focus-within { outline: 2px solid var(--focus); outline-offset: 2px; }

/* Загрузчик — плоский, без больших иконок и тени */
.dropzone {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 5px; min-height: 188px;
  border: 1.5px dashed var(--border-strong); border-radius: var(--radius-md);
  background: var(--surface); padding: var(--space-5);
  text-align: center;
  transition: border-color var(--transition), background var(--transition);
}
.dropzone:hover { border-color: var(--primary); background: var(--surface-soft); }
.dropzone__title { font-size: 15px; font-weight: 600; color: var(--text-main); }
.dropzone__hint { font-size: 13px; color: var(--text-muted); }
.dropzone .btn { margin-top: 10px; }
.dropzone-note { margin-top: 10px; font-size: 12px; color: var(--text-muted); }

/* Правая колонка — одна панель, три раздела */
.side-panel {
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--radius-md); box-shadow: var(--shadow-sm); overflow: hidden;
}
.side-block { padding: 13px var(--space-4); }
.side-block + .side-block { border-top: 1px solid var(--border); }
.side-block__title { font-size: 17px; line-height: 1.25; font-weight: 600; color: var(--text-main); margin-bottom: 8px; }
.side-list { display: flex; flex-direction: column; gap: 6px; }
.side-list li { position: relative; padding-left: 15px; font-size: 13.5px; color: var(--text-secondary); line-height: 1.35; }
.side-list li::before { content: ""; position: absolute; left: 0; top: 7px; width: 5px; height: 5px; border-radius: 50%; background: var(--accent); }
.side-tools { display: flex; flex-direction: column; gap: 6px; }
.side-tools li { display: flex; align-items: center; gap: 8px; font-size: 13.5px; color: var(--text-main); }
.side-tools .badge { margin-left: auto; }
.side-block--login p { font-size: 13.5px; color: var(--text-secondary); line-height: 1.4; margin-bottom: 10px; }

/* Нижняя компактная строка поддерживаемых документов */
.start__support {
  display: flex; flex-wrap: wrap; align-items: center; gap: 4px var(--space-4);
  margin-top: var(--space-4);
  background: var(--surface-soft); border: 1px solid var(--border);
  border-radius: var(--radius-sm); padding: 9px var(--space-4);
  font-size: 13px; color: var(--text-secondary);
}
.start__support b { color: var(--text-main); font-weight: 600; }
.start__support-sep { color: var(--text-muted); }

@media (max-width: 860px) {
  .start__grid { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
  .start { padding-block: 16px 18px; }
  .doctype-switch__item { font-size: 12px; height: 32px; padding: 0 10px; }
  .start__support { gap: 4px; }
}

/* ── Демо-страница «Пример разбора» ── */
.example-note {
  display: flex; gap: 10px; align-items: flex-start;
  background: var(--info-soft); border: 1px solid #ccd9e3;
  border-radius: var(--radius-md); padding: 12px 14px;
  font-size: 14px; color: var(--info); margin-bottom: var(--space-5);
}
.example-note svg { flex: 0 0 auto; margin-top: 1px; }
.example-layout { display: grid; grid-template-columns: 1fr 300px; gap: var(--space-5); align-items: start; }
.example-aside { position: sticky; top: calc(var(--topbar-h) + var(--space-4)); }
@media (max-width: 900px) {
  .example-layout { grid-template-columns: 1fr; }
  .example-aside { position: static; }
}

/* ════════════════════════════════════════════════════════════
   D6 — компактный публичный старт цифровой услуги
   ════════════════════════════════════════════════════════════ */
.start-container {
  width: 100%;
  max-width: 1100px;
  margin-inline: auto;
  padding-inline: var(--container-pad);
}
.start-top {
  height: 56px;
  border-bottom: 1px solid var(--border);
  background: var(--surface);
}
.start-top__inner {
  height: 56px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}
.start-logo {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--primary);
  font-size: 18px;
  line-height: 24px;
  font-weight: 700;
}
.start-logo:hover { color: var(--primary-hover); text-decoration: none; }
.start-logo__mark { flex: 0 0 auto; }
.start-top__actions { display: flex; align-items: center; gap: 16px; }
.start-top__link {
  color: var(--text-secondary);
  font-size: 14px;
  line-height: 20px;
  font-weight: 600;
}
.start-top__link:hover { color: var(--text-main); text-decoration: none; }

.service-start { padding-block: 36px 22px; }
.service-start__grid {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(280px, 1fr);
  gap: 38px;
  align-items: start;
}
.service-start__main { min-width: 0; }
.service-start__eyebrow {
  margin: 0 0 10px;
  color: var(--text-muted);
  font-size: 13px;
  line-height: 18px;
  font-weight: 600;
}
.service-start h1 {
  margin: 0;
  max-width: 680px;
  color: var(--text-main);
  font-size: 30px;
  line-height: 36px;
  font-weight: 700;
  letter-spacing: 0;
}
.service-start__lead {
  margin-top: 12px;
  max-width: 660px;
  color: var(--text-secondary);
  font-size: 16px;
  line-height: 24px;
}
.service-start__actions {
  margin-top: 20px;
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
}
.service-start__example {
  color: var(--accent);
  font-size: 14px;
  line-height: 20px;
  font-weight: 600;
}
.service-start__note {
  margin-top: 12px;
  color: var(--text-muted);
  font-size: 14px;
  line-height: 20px;
}
.supported-docs {
  margin-top: 28px;
  color: var(--text-secondary);
  font-size: 15px;
  line-height: 22px;
}
.supported-docs p {
  margin: 0 0 8px;
  color: var(--text-main);
  font-weight: 700;
}
.supported-docs ul {
  display: grid;
  gap: 4px;
  padding: 0;
  margin: 0;
  list-style: none;
}
.supported-docs li::before { content: "— "; color: var(--text-muted); }

.start-requirements {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 18px;
  box-shadow: var(--shadow-sm);
}
.start-requirements h2 {
  margin: 0 0 14px;
  color: var(--text-main);
  font-size: 17px;
  line-height: 22px;
  font-weight: 700;
}
.start-requirements dl {
  margin: 0;
  display: grid;
  gap: 12px;
}
.start-requirements dl > div {
  padding-top: 12px;
  border-top: 1px solid var(--border);
}
.start-requirements dl > div:first-child {
  padding-top: 0;
  border-top: 0;
}
.start-requirements dt {
  color: var(--text-muted);
  font-size: 13px;
  line-height: 18px;
  font-weight: 600;
}
.start-requirements dd {
  margin: 3px 0 0;
  color: var(--text-main);
  font-size: 15px;
  line-height: 22px;
}

.start-footer {
  margin-top: auto;
  border-top: 1px solid var(--border);
  background: var(--surface);
}
.start-footer__links {
  min-height: 52px;
  display: flex;
  align-items: center;
  gap: 18px;
  flex-wrap: wrap;
}
.start-footer a {
  color: var(--text-secondary);
  font-size: 13px;
  line-height: 18px;
}
.start-footer a:hover { color: var(--text-main); text-decoration: none; }

@media (max-width: 860px) {
  .start-top__link { display: none; }
  .service-start { padding-block: 28px 20px; }
  .service-start__grid { grid-template-columns: 1fr; gap: 24px; }
  .service-start h1 { font-size: 28px; line-height: 34px; }
  .service-start__lead { font-size: 16px; line-height: 24px; }
  .service-start__actions .btn { width: 100%; }
}
@media (max-width: 420px) {
  .start-top__actions { gap: 10px; }
  .start-logo { font-size: 17px; }
  .service-start { padding-block: 24px 18px; }
  .service-start h1 { font-size: 27px; line-height: 33px; }
  .start-requirements { padding: 16px; }
  .start-footer__links { align-items: flex-start; flex-direction: column; gap: 7px; padding-block: 12px; }
}