/* ============================================================
   KD Bureau — правовые страницы (/terms, /privacy). Самодостаточно.
   Шрифты IBM Plex подключает сквозная шапка (includes/header.php).
   Namespace lg-*. Страницы ставят $kd_bureau_page=true (без легаси kd-ds.css).
   ============================================================ */
* { box-sizing: border-box; }
body {
  margin: 0; color: #111820;
  font-family: "IBM Plex Sans", "Segoe UI", sans-serif;
  background:
    linear-gradient(rgba(17,24,32,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(17,24,32,.035) 1px, transparent 1px),
    #f5f2ea;
  background-size: 24px 24px; overflow-x: hidden;
}
a { color: inherit; text-decoration: none; }

.lg-hero {
  color: #fff;
  background:
    linear-gradient(rgba(25,182,210,.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(25,182,210,.07) 1px, transparent 1px),
    #101820;
  background-size: 24px 24px;
  padding: clamp(40px,6vw,72px) clamp(18px,4vw,56px) clamp(30px,4vw,52px);
}
.lg-hero__in { max-width: 900px; margin: 0 auto; }
.lg-crumbs { display: flex; flex-wrap: wrap; gap: 10px; color: rgba(245,242,234,.6); font-family: "IBM Plex Mono", monospace; font-size: 12px; }
.lg-crumbs a:hover { color: #8f6fd4; }
.lg-crumbs span[aria-current] { color: rgba(245,242,234,.9); }
.lg-hero h1 { margin: 22px 0 0; font-family: "IBM Plex Sans Condensed", "Arial Narrow", sans-serif; font-weight: 700; font-size: clamp(34px,5vw,64px); line-height: .9; text-transform: uppercase; }
.lg-hero__meta { display: flex; flex-wrap: wrap; gap: 10px 16px; align-items: center; margin-top: 18px; color: rgba(245,242,234,.7); font-family: "IBM Plex Mono", monospace; font-size: 12px; }
.lg-hero__badge { border: 1px solid rgba(245,242,234,.5); padding: 5px 10px; color: #b78b42; }

.lg-content { padding: clamp(40px,6vw,72px) clamp(18px,4vw,56px); }
.lg-doc { position: relative; max-width: 900px; margin: 0 auto; background: #fff; border: 1px solid #b8c1c8; padding: clamp(26px,4vw,56px); }
.lg-doc::before { content: ""; position: absolute; top: -1px; left: -1px; width: 34px; height: 34px; border-top: 3px solid #8f6fd4; border-left: 3px solid #8f6fd4; }
.lg-doc::after { content: ""; position: absolute; right: -1px; bottom: -1px; width: 34px; height: 34px; border-right: 3px solid #8f6fd4; border-bottom: 3px solid #8f6fd4; }

.lg-sec { margin-bottom: 34px; }
.lg-sec:last-child { margin-bottom: 0; }
.lg-sec h2 { margin: 0 0 16px; padding-left: 16px; border-left: 3px solid #5a3fa0; font-family: "IBM Plex Sans Condensed", "Arial Narrow", sans-serif; font-weight: 700; font-size: clamp(22px,2.6vw,30px); line-height: 1.02; text-transform: uppercase; color: #111820; }
.lg-sec h3 { margin: 22px 0 10px; font-family: "IBM Plex Mono", monospace; font-size: 13px; font-weight: 600; text-transform: uppercase; letter-spacing: .03em; color: #5a3fa0; }
.lg-sec p { margin: 0 0 14px; color: #374151; line-height: 1.7; font-size: 16px; }
.lg-sec ul { margin: 0 0 16px; padding-left: 22px; }
.lg-sec li { margin-bottom: 8px; color: #374151; line-height: 1.65; font-size: 16px; }
.lg-sec strong { color: #111820; }
.lg-sec a { color: #5a3fa0; border-bottom: 1px solid currentColor; }

.lg-note { margin: 18px 0; padding: 16px 20px; background: #ebe5d8; border-left: 3px solid #8f6fd4; }
.lg-note p { margin: 0; color: #111820; font-weight: 500; }
.lg-warn { margin: 18px 0; padding: 16px 20px; background: #f2e6df; border-left: 3px solid #d54836; }
.lg-warn p { margin: 0; color: #5c2b22; font-weight: 500; }

.lg-contact { position: relative; margin: 30px 0 0; padding: 28px 32px; background: #111820; color: rgba(245,242,234,.88); }
.lg-contact::before { content: ""; position: absolute; top: -1px; left: -1px; width: 28px; height: 28px; border-top: 2px solid #b78b42; border-left: 2px solid #b78b42; }
.lg-contact h3 { margin: 0 0 14px; color: #fff; font-family: "IBM Plex Sans Condensed", "Arial Narrow", sans-serif; font-size: 20px; text-transform: uppercase; }
.lg-contact p { margin: 0 0 8px; font-family: "IBM Plex Mono", monospace; font-size: 14px; }
.lg-contact a { color: #8f6fd4; }
.lg-contact a:hover { color: #fff; }

@media (max-width: 640px) { .lg-doc { padding: 22px 18px; } }
@media (prefers-reduced-motion: reduce) { .lg-hero, .lg-doc, .lg-sec a { transition: none; } }
