﻿:root {
      --bg: #FAF7F3;
      --card: #FFFFFF;
      --line: rgba(10,31,68,.10);
      --text: #20283A;
      --muted: rgba(32,40,58,.72);
      --blue: #0B5BE6;
      --dark: #0A1F44;
      --radius: 20px;
      --container: 980px;
    }
    * { box-sizing: border-box; }
    body {
      margin: 0;
      font-family: 'Manrope', system-ui, sans-serif;
      color: var(--text);
      background:
        radial-gradient(circle at 12% 8%, rgba(11,91,230,.09), transparent 30%),
        radial-gradient(circle at 82% 0, rgba(215,138,45,.10), transparent 28%),
        var(--bg);
      line-height: 1.64;
    }
    .container { width: min(var(--container), calc(100% - 32px)); margin: 0 auto; }
    .topbar {
      position: sticky;
      top: 0;
      z-index: 20;
      backdrop-filter: saturate(130%) blur(8px);
      border-bottom: 1px solid var(--line);
      background: rgba(250,247,243,.88);
    }
    .topbar-inner {
      height: 70px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 16px;
    }
    .brand { font-family: 'Manrope', sans-serif; font-weight: 700; color: var(--dark); text-decoration: none; font-size: 18px; }
    .btn { text-decoration: none; color: #fff; background: var(--blue); padding: 10px 14px; border-radius: 12px; font-weight: 700; font-size: 14px; }

    main { padding: 34px 0 56px; }
    .hero {
      border: 1px solid var(--line);
      border-radius: 24px;
      background: linear-gradient(180deg, #fff, #F6F9FF);
      padding: 24px;
      margin-bottom: 18px;
    }
    .eyebrow {
      display: inline-flex;
      align-items: center;
      padding: 6px 10px;
      border-radius: 999px;
      border: 1px solid rgba(11,91,230,.16);
      color: var(--blue);
      font-size: 12px;
      font-weight: 700;
      margin-bottom: 10px;
    }
    h1 {
      margin: 0;
      font-family: 'Manrope', sans-serif;
      font-size: clamp(26px, 5vw, 40px);
      line-height: 1.12;
      letter-spacing: -0.02em;
      color: var(--dark);
    }
    .meta { margin-top: 12px; color: var(--muted); font-size: 14px; }

    .doc {
      border: 1px solid var(--line);
      border-radius: 24px;
      background: var(--card);
      padding: 22px;
    }
    h2 {
      margin: 22px 0 8px;
      font-family: 'Manrope', sans-serif;
      font-size: clamp(18px, 2.6vw, 24px);
      color: var(--dark);
      line-height: 1.22;
    }
    p { margin: 8px 0; color: var(--muted); }
    ul { margin: 8px 0 8px 18px; color: var(--muted); }
    li { margin: 6px 0; }
    .source {
      margin-top: 20px;
      padding-top: 14px;
      border-top: 1px dashed var(--line);
      font-size: 13px;
      color: var(--muted);
    }
    .source a { color: var(--blue); }



