/* ============================================================
   kd.vnesenie-v-reestr.ru — Дизайн-система (kd-ds.css)
   Перенос FindCert Design System v2 на сайт одной компании.
   Спокойная чёрно-белая база с графитовым акцентом, шрифт Onest.
   ============================================================ */

/* ---------- Дизайн-токены ---------- */
:root {
  /* Нейтральные */
  --ds-ink: #17171A;
  --ds-muted: #5B5B63;
  --ds-border: #DADADE;
  --ds-canvas: #F1F1F3;
  --ds-surface: #FFFFFF;
  /* Акцент — графит */
  --ds-tint: #EFEFF2;
  --ds-soft: #CDCDD3;
  --ds-accent: #3F3F46;
  --ds-deep: #1D1D22;
  --ds-ink-plus: #0A0A0C;
  /* Дополнительные серые */
  --ds-caption: #8A8A93;
  --ds-faint: #A9A9B0;
  --ds-body: #3A3A40;
  --ds-quiet: #6E6E76;
  /* Фоны/границы секций */
  --ds-hover-bg: #F4F4F6;
  --ds-tag-bg: #F7F7F8;
  --ds-input-bg: #FBFBFC;
  --ds-strip-bg: #FAFAFB;
  --ds-card-border: #E9E9EC;
  --ds-line: #E4E4E7;
  --ds-soft-line: #F1F1F3;
  /* Тёмные блоки */
  --ds-dark: #141416;
  --ds-dark-border: #26262A;
  --ds-dark-input: #26262B;
  --ds-dark-card-border: #2C2C31;
  --ds-dark-cta-border: #3A3A40;
  --ds-dark-link: #C4C4CB;
  /* Радиусы */
  --ds-r-sm: 7px;
  --ds-r-md: 8px;
  --ds-r-btn: 10px;
  --ds-r-card: 16px;
  /* Тени */
  --ds-shadow-card: 0 12px 32px rgba(23,23,26,.10);
  --ds-shadow-badge: 0 1px 3px rgba(0,0,0,.08);
  /* Контейнер */
  --ds-container: 1200px;
}

/* ---------- Сброс и базовая типографика ---------- */
body.ds-body,
body.kd-ds,
.ds-reset * { margin: 0; padding: 0; box-sizing: border-box; }

body.ds-body,
body.kd-ds {
  background: var(--ds-canvas);
  font-family: 'Onest', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  color: var(--ds-ink);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  line-height: 1.6;
}
::selection { background: var(--ds-tint); color: var(--ds-ink-plus); }

.ds-body h1, .ds-body h2, .ds-body h3, .kd-ds h1, .kd-ds h2, .kd-ds h3,
.ds-h1, .ds-h2, .ds-h3 { line-height: 1.1; letter-spacing: -.02em; }

.ds-h1 { font-size: clamp(34px, 5vw, 56px); font-weight: 800; letter-spacing: -.035em; line-height: 1.04; }
.ds-h1-page { font-size: clamp(30px, 4vw, 46px); font-weight: 800; letter-spacing: -.03em; line-height: 1.08; }
.ds-h2 { font-size: clamp(24px, 3vw, 32px); font-weight: 800; letter-spacing: -.025em; line-height: 1.15; }
.ds-h2-card { font-size: 22px; font-weight: 600; letter-spacing: -.01em; }
.ds-h3 { font-size: clamp(17px, 2vw, 20px); font-weight: 600; letter-spacing: -.01em; }
.ds-h4 { font-size: 16px; font-weight: 600; }
.ds-lead { font-size: clamp(17px, 2vw, 20px); line-height: 1.55; color: var(--ds-muted); font-weight: 400; }
.ds-body-text { font-size: 16px; line-height: 1.65; color: var(--ds-body); }
.ds-small { font-size: 14px; line-height: 1.55; color: var(--ds-muted); }
.ds-caption { font-size: 12px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--ds-caption); }

.ds-h1, .ds-h1-page, .ds-h2, .ds-h2-card, .ds-h3, .ds-h4, .ds-lead, .ds-body-text, .ds-small, .ds-caption { display: block; }

/* ---------- Контейнер и секции ---------- */
.ds-container { max-width: var(--ds-container); margin: 0 auto; padding: 0 40px; }
.ds-section { padding: clamp(56px, 8vw, 96px) 0; }
.ds-section-tight { padding: clamp(40px, 5vw, 64px) 0; }
.ds-section-head { display: flex; align-items: baseline; gap: 14px; margin-bottom: 28px; }
.ds-section-num { font-size: 13px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--ds-caption); white-space: nowrap; }
.ds-section-line { flex: 1; height: 1px; background: var(--ds-line); }

/* ---------- Кнопки ---------- */
.ds-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  font-family: inherit; font-size: 15px; font-weight: 600; line-height: 1;
  padding: 13px 24px; border-radius: var(--ds-r-btn); cursor: pointer;
  transition: background .15s ease, color .15s ease, border-color .15s ease, all .15s ease;
  text-decoration: none; border: none; white-space: nowrap;
}
.ds-btn-primary { background: var(--ds-accent); color: #fff; }
.ds-btn-primary:hover { background: var(--ds-deep); }
.ds-btn-outline { background: transparent; color: var(--ds-ink); border: 1.5px solid var(--ds-border); padding: 12px 24px; }
.ds-btn-outline:hover { background: var(--ds-ink); color: #fff; border-color: var(--ds-ink); }
.ds-btn-ghost { background: transparent; color: var(--ds-accent); border: none; padding: 13px 18px; }
.ds-btn-ghost:hover { background: var(--ds-tint); color: var(--ds-deep); }
.ds-btn-sm { font-size: 13px; padding: 9px 16px; border-radius: var(--ds-r-md); }
.ds-btn-block { width: 100%; }
.ds-btn:disabled { background: #EDEDF0; color: #B5B5BC; cursor: not-allowed; }
.ds-btn-on-dark-outline { background: transparent; color: #fff; border: 1.5px solid var(--ds-dark-cta-border); }
.ds-btn-on-dark-outline:hover { background: var(--ds-accent); color: #fff; border-color: var(--ds-accent); }

/* ---------- Карточки ---------- */
.ds-card {
  background: var(--ds-surface); border: 1px solid var(--ds-card-border);
  border-radius: var(--ds-r-card); overflow: hidden;
  transition: box-shadow .2s ease, transform .2s ease, border-color .2s ease;
}
.ds-card-hover:hover {
  box-shadow: var(--ds-shadow-card); transform: translateY(-3px); border-color: var(--ds-border);
}
.ds-card-body { padding: 22px; }
.ds-card-title { font-size: 17px; font-weight: 600; line-height: 1.3; letter-spacing: -.01em; transition: color .15s ease; }
.ds-card-desc { font-size: 14px; line-height: 1.5; color: var(--ds-caption); margin-top: 8px; }

/* Карточка-документ (каталог) */
.ds-doc-card { cursor: pointer; }
.ds-doc-img {
  height: 150px; background: repeating-linear-gradient(135deg, var(--ds-hover-bg) 0 12px, var(--ds-tint) 12px 24px);
  position: relative; display: flex; align-items: center; justify-content: center;
}
.ds-doc-badge {
  position: absolute; top: 12px; left: 12px; font-size: 12px; font-weight: 600;
  padding: 5px 11px; border-radius: var(--ds-r-sm); background: #fff; color: var(--ds-deep);
  box-shadow: var(--ds-shadow-badge);
}
.ds-doc-cat-label { font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; color: var(--ds-caption); margin-bottom: 6px; }
.ds-price-row {
  display: flex; align-items: flex-end; justify-content: space-between;
  padding-top: 16px; margin-top: 16px; border-top: 1px solid var(--ds-soft-line);
}
.ds-price-from { font-size: 12px; color: var(--ds-faint); }
.ds-price-value { font-size: 22px; font-weight: 700; letter-spacing: -.02em; }
.ds-price-link { font-size: 14px; font-weight: 600; color: var(--ds-accent); }

/* ---------- Теги и бейджи ---------- */
.ds-tag {
  display: inline-flex; align-items: center; cursor: pointer;
  font-size: 13px; font-weight: 500; padding: 7px 13px; border-radius: var(--ds-r-md);
  border: 1px solid var(--ds-line); background: var(--ds-tag-bg); color: var(--ds-body);
  transition: background .15s ease, border-color .15s ease, color .15s ease;
}
.ds-tag:hover { background: var(--ds-tint); border-color: var(--ds-soft); color: var(--ds-deep); }
.ds-tag.active { background: var(--ds-ink); color: #fff; border-color: var(--ds-ink); }

.ds-badge { display: inline-flex; align-items: center; font-size: 12px; font-weight: 600; padding: 5px 11px; border-radius: var(--ds-r-sm); }
.ds-badge-default { background: var(--ds-tint); color: var(--ds-deep); }
.ds-badge-soft { background: #EFEFF1; color: var(--ds-body); }
.ds-badge-dark { background: var(--ds-ink); color: #fff; }
.ds-badge-accent { background: var(--ds-accent); color: #fff; }

/* ---------- Поля ввода ---------- */
.ds-input {
  width: 100%; font-family: inherit; font-size: 15px;
  padding: 13px 16px; border: 1.5px solid var(--ds-border); border-radius: var(--ds-r-btn);
  background: var(--ds-input-bg); color: var(--ds-ink); transition: border-color .15s ease, box-shadow .15s ease;
}
.ds-input::placeholder { color: var(--ds-faint); }
.ds-input:focus { outline: none; border-color: var(--ds-body); box-shadow: 0 0 0 4px var(--ds-tint); }
.ds-label { display: block; font-size: 13px; font-weight: 600; color: var(--ds-muted); margin-bottom: 8px; }

/* ---------- Сетки ---------- */
.ds-grid { display: grid; gap: 20px; }
.ds-grid-2 { grid-template-columns: repeat(2, 1fr); }
.ds-grid-3 { grid-template-columns: repeat(3, 1fr); }
.ds-grid-4 { grid-template-columns: repeat(4, 1fr); }
.ds-grid-auto { grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
@media (max-width: 860px) {
  .ds-grid-2, .ds-grid-3, .ds-grid-4 { grid-template-columns: 1fr; }
  .ds-grid-auto { grid-template-columns: 1fr; }
}

/* ---------- Стат-плитки ---------- */
.ds-stat { display: flex; flex-direction: column; gap: 6px; }
.ds-stat-num { font-size: clamp(28px, 4vw, 44px); font-weight: 800; letter-spacing: -.03em; line-height: 1; }
.ds-stat-label { font-size: 14px; color: var(--ds-muted); font-weight: 500; }

/* ---------- Нумерованные шаги ---------- */
.ds-step-num {
  width: 44px; height: 44px; flex: none; border-radius: var(--ds-r-md);
  background: var(--ds-ink); color: #fff; font-size: 16px; font-weight: 700;
  display: flex; align-items: center; justify-content: center;
}

/* ---------- Тёмные секции ---------- */
.ds-dark { background: var(--ds-dark); color: #fff; }
.ds-dark .ds-card { background: #1B1B1F; border-color: var(--ds-dark-card-border); }
.ds-dark .ds-card-title, .ds-dark .ds-h3 { color: #fff; }
.ds-dark .ds-card-desc, .ds-dark .ds-small { color: #B5B5BC; }

/* ---------- Строка-таблица (прайс) ---------- */
.ds-prow {
  display: grid; align-items: center; padding: 16px 20px;
  border-radius: var(--ds-r-md); transition: background .15s ease; border-bottom: 1px solid var(--ds-soft-line);
}
.ds-prow:hover { background: var(--ds-strip-bg); }
.ds-prow:hover .ds-card-title { color: var(--ds-body); }
.ds-prow:last-child { border-bottom: none; }

/* ---------- Анимации ---------- */
@keyframes dsUp { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: none; } }
@keyframes dsFade { from { opacity: 0; } to { opacity: 1; } }
@keyframes dsPulse { 0%, 100% { opacity: 1; } 50% { opacity: .35; } }
@keyframes dsMarquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }

.ds-hero-el { opacity: 0; animation: dsUp .8s cubic-bezier(.22,.61,.36,1) forwards; }
.ds-live { width: 7px; height: 7px; border-radius: 50%; background: var(--ds-ink); animation: dsPulse 2s ease-in-out infinite; display: inline-block; }
.ds-marquee-wrap { overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.ds-marquee { display: flex; gap: 14px; width: max-content; animation: dsMarquee 32s linear infinite; }
.ds-marquee-wrap:hover .ds-marquee { animation-play-state: paused; }

/* Reveal on scroll */
.ds-reveal { opacity: 0; transform: translateY(24px); transition: opacity .7s cubic-bezier(.22,.61,.36,1), transform .7s cubic-bezier(.22,.61,.36,1); }
.ds-reveal.ds-revealed { opacity: 1; transform: none; }

/* ---------- Логотипы партнёров (marquee) ---------- */
.ds-partner-logo {
  height: 44px; width: auto; object-fit: contain; flex: none;
  filter: grayscale(1); opacity: .6; transition: filter .25s ease, opacity .25s ease;
  border-radius: 8px; padding: 4px 10px; background: #fff; border: 1px solid var(--ds-soft-line);
}
.ds-partner-logo:hover { filter: grayscale(0); opacity: 1; }

/* ---------- Утилиты ---------- */
.ds-text-muted { color: var(--ds-muted); }
.ds-text-accent { color: var(--ds-accent); }
.ds-text-center { text-align: center; }
.ds-mt-0 { margin-top: 0; } .ds-mt-8 { margin-top: 8px; } .ds-mt-16 { margin-top: 16px; } .ds-mt-24 { margin-top: 24px; } .ds-mt-32 { margin-top: 32px; } .ds-mt-48 { margin-top: 48px; }
.ds-mb-0 { margin-bottom: 0; } .ds-mb-8 { margin-bottom: 8px; } .ds-mb-16 { margin-bottom: 16px; } .ds-mb-24 { margin-bottom: 24px; } .ds-mb-32 { margin-bottom: 32px; } .ds-mb-48 { margin-bottom: 48px; }
.ds-flex { display: flex; } .ds-flex-col { flex-direction: column; } .ds-flex-wrap { flex-wrap: wrap; } .ds-items-center { align-items: center; } .ds-justify-between { justify-content: space-between; } .ds-gap-8 { gap: 8px; } .ds-gap-12 { gap: 12px; } .ds-gap-16 { gap: 16px; } .ds-gap-24 { gap: 24px; }
.ds-hidden { display: none; }

@media (max-width: 768px) {
  .ds-container { padding: 0 20px; }
  .ds-section { padding: 48px 0; }
}

/* ============================================================
   Мост совместимости: подавляем legacy-стили jeksport на kd.
   Старые страницы тянули Cormorant Garamond + бежевую палитру.
   Здесь переопределяем шрифты/цвета на Onest + графит глобально,
   чтобы не переписывать каждую inline-декларацию вручную.
   ============================================================ */
.kd-ds, .kd-ds body {
  font-family: 'Onest', system-ui, sans-serif !important;
}
.kd-ds [style*="Cormorant"], .kd-ds [style*="cormorant"],
.kd-ds h1, .kd-ds h2, .kd-ds h3, .kd-ds h4,
.kd-ds .pricing-title, .kd-ds .category-title, .kd-ds .about-h1, .kd-ds .about-h2,
.kd-ds .contacts-stat-num, .kd-ds .legal-page-wrap h1, .kd-ds .sitemap-page h1, .kd-ds .page-404 h1,
.kd-ds .news-card-title {
  font-family: 'Onest', system-ui, sans-serif !important;
}
/* Замена бежевых/золотых цветов на графитовую палитру kd */
.kd-ds [style*="#1c1814"], .kd-ds [style*="#1c1814"] { color: var(--ds-ink) !important; }
.kd-ds [style*="#b07d2e"] { color: var(--ds-accent) !important; }
.kd-ds [style*="background: #b07d2e"], .kd-ds [style*="background:#b07d2e"] { background: var(--ds-accent) !important; }
.kd-ds [style*="background: #ede7de"], .kd-ds [style*="background:#ede7de"],
.kd-ds [style*="background: #f7f3ee"], .kd-ds [style*="background:#f7f3ee"] { background: var(--ds-canvas) !important; }
.kd-ds [style*="#6b6055"] { color: var(--ds-muted) !important; }
.kd-ds [style*="#9a9088"] { color: var(--ds-caption) !important; }
.kd-ds [style*="#ddd5c8"] { border-color: var(--ds-line) !important; }
/* Контейнер страниц */
.kd-ds .cert-main, .kd-ds .cert-container, .kd-ds .pricing-wrapper,
.kd-ds .contacts-wrap, .kd-ds .about-page, .kd-ds .legal-page-wrap,
.kd-ds .sitemap-page, .kd-ds .page-404 {
  background: var(--ds-canvas) !important;
  color: var(--ds-ink) !important;
}
.kd-ds .cert-breadcrumbs a, .kd-ds .cert-breadcrumbs span { color: var(--ds-muted) !important; }
.kd-ds .cert-service-card, .kd-ds .pricing-card {
  background: var(--ds-surface) !important;
  border: 1px solid var(--ds-card-border) !important;
  border-radius: var(--ds-r-card) !important;
}

/* ---------- Модалка лида (forms/lead-modal.html) — дизайн-система v2 ---------- */
.kd-ds .modal {
  display: none; position: fixed; inset: 0; z-index: 1000;
  background: rgba(23,23,26,.5); backdrop-filter: blur(4px);
  align-items: center; justify-content: center; padding: 20px;
}
.kd-ds .modal[aria-hidden="false"], .kds-modal-open .modal { display: flex; }
.kd-ds .modal-content {
  position: relative; background: var(--ds-surface); border-radius: var(--ds-r-card);
  max-width: 480px; width: 100%; max-height: 90vh; overflow-y: auto;
  padding: 36px 32px; box-shadow: 0 24px 60px rgba(23,23,26,.25);
  font-family: 'Onest', sans-serif;
}
.kd-ds .modal-close {
  position: absolute; top: 16px; right: 16px; font-size: 28px; line-height: 1;
  color: var(--ds-caption); cursor: pointer; background: none; border: none;
  width: 36px; height: 36px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
  transition: background .15s ease, color .15s ease;
}
.kd-ds .modal-close:hover { background: var(--ds-tint); color: var(--ds-ink); }
.kd-ds .modal-content h3 { font-size: 24px; font-weight: 700; letter-spacing: -.02em; color: var(--ds-ink); margin: 0 0 8px; font-family: 'Onest', sans-serif; }
.kd-ds .modal-content > p { font-size: 14px; color: var(--ds-muted); margin: 0 0 24px; }
.kd-ds .form-group { margin-bottom: 16px; }
.kd-ds .form-group label { display: block; font-size: 13px; font-weight: 600; color: var(--ds-muted); margin-bottom: 8px; }
.kd-ds .form-group input, .kd-ds .form-group textarea {
  width: 100%; font-family: inherit; font-size: 15px; padding: 13px 16px;
  border: 1.5px solid var(--ds-border); border-radius: var(--ds-r-btn);
  background: var(--ds-input-bg); color: var(--ds-ink); transition: border-color .15s ease, box-shadow .15s ease;
}
.kd-ds .form-group input:focus, .kd-ds .form-group textarea:focus {
  outline: none; border-color: var(--ds-body); box-shadow: 0 0 0 4px var(--ds-tint);
}
.kd-ds .privacy-notice { font-size: 12px; color: var(--ds-caption); }
.kd-ds .privacy-notice a { color: var(--ds-accent); }
.kd-ds .submit-btn {
  display: block; width: 100%; font-family: inherit; font-size: 15px; font-weight: 600;
  padding: 14px 24px; border-radius: var(--ds-r-btn); border: none;
  background: var(--ds-accent); color: #fff; cursor: pointer; transition: background .15s ease;
}
.kd-ds .submit-btn:hover { background: var(--ds-deep); }
.kd-ds .success-message, .kd-ds .error-message { font-family: 'Onest', sans-serif; }
.kd-ds .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); border: 0; }


