/* claude-bdpn — публичный сайт (стиль bdpn.ru/check, адаптировано). Vanilla CSS. */
:root {
  --fg:#1a1a2e; --muted:#5b6677; --bg:#f5f7fa; --line:#e3e8ef;
  --acc:#0f6cbd; --acc-d:#0b5aa0; --acc-soft:#e8f1fb;
  --ok:#1e9e57; --ok-soft:#e3f6ea; --err:#c0392b; --err-soft:#fbe6e3;
  --dark:#0f1b2d; --radius:12px; --maxw:1080px;
  --shadow:0 1px 2px rgba(16,30,54,.04), 0 4px 16px rgba(16,30,54,.06);
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:72px; }
body { margin:0; font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
       color:var(--fg); background:var(--bg); line-height:1.55; }
a { color:var(--acc); text-decoration:none; }
a:hover { text-decoration:underline; }
.wrap { max-width:var(--maxw); margin:0 auto; padding:0 20px; }

/* ---------- Header ---------- */
.hdr { position:sticky; top:0; z-index:50; background:#fff; border-bottom:1px solid var(--line); }
.hdr .wrap { display:flex; align-items:center; gap:18px; height:60px; }
.brand { display:flex; flex-direction:column; line-height:1.05; }
.brand b { font-size:1.25rem; color:var(--acc); letter-spacing:.5px; }
.brand span { font-size:.68rem; color:var(--muted); }
.nav { display:flex; gap:18px; margin-left:8px; flex:1; }
.nav a { color:var(--fg); font-size:.92rem; }
.nav a:hover { color:var(--acc); text-decoration:none; }
.authnav { display:flex; align-items:center; gap:10px; font-size:.88rem; color:var(--muted); white-space:nowrap; }
.authnav a.cta { background:var(--acc); color:#fff; padding:8px 16px; border-radius:9px; }
.authnav a.cta:hover { background:var(--acc-d); text-decoration:none; }
.burger { display:none; border:0; background:none; font-size:1.5rem; cursor:pointer; color:var(--fg); }

/* ---------- Hero / search ---------- */
.hero { background:linear-gradient(180deg,#fff 0%,var(--bg) 100%); border-bottom:1px solid var(--line);
        padding:60px 0 52px; text-align:center; }
.hero h1 { font-size:2.1rem; margin:0 0 10px; }
.hero .lead { color:var(--muted); font-size:1.08rem; max-width:620px; margin:0 auto 28px; }
.search { display:flex; gap:10px; max-width:560px; margin:0 auto; }
.search input { flex:1; padding:15px 18px; font-size:1.1rem; border:1px solid #cdd5df; border-radius:var(--radius);
                background:#fff; }
.search input:focus { outline:2px solid var(--acc); border-color:var(--acc); }
.search button { padding:0 28px; font-size:1.05rem; font-weight:600; border:0; border-radius:var(--radius);
                 background:var(--acc); color:#fff; cursor:pointer; }
.search button:hover { background:var(--acc-d); }
.search button:disabled { opacity:.6; cursor:default; }
.hint { color:var(--muted); font-size:.85rem; margin:12px auto 0; max-width:560px; }

/* ---------- Result card ---------- */
.result { max-width:560px; margin:22px auto 0; text-align:left; background:#fff; border:1px solid var(--line);
          border-radius:var(--radius); box-shadow:var(--shadow); padding:20px 22px; display:none; }
.result.show { display:block; }
.result[aria-busy="true"] { color:var(--muted); }
.result .row { display:flex; justify-content:space-between; gap:16px; padding:9px 0; border-bottom:1px dashed #eef1f6; }
.result .row:last-of-type { border-bottom:0; }
.result .row .k { color:var(--muted); }
.result .row .v { font-weight:600; text-align:right; }
.result .note { margin-top:12px; font-size:.82rem; color:var(--muted); }
.result .big { font-size:1.15rem; font-weight:700; margin-bottom:6px; }
.result.err .big { color:var(--err); }
.result.warn .big { color:#b26a00; }
.badge { display:inline-block; padding:2px 10px; border-radius:20px; font-size:.78rem; font-weight:600; }
.badge.ok { background:var(--ok-soft); color:var(--ok); }

/* ---------- Sections ---------- */
section.block { padding:56px 0; border-bottom:1px solid var(--line); }
section.block h2 { font-size:1.5rem; margin:0 0 8px; }
section.block .sub { color:var(--muted); margin:0 0 26px; }
.disclaimer { background:var(--acc-soft); border:1px solid #cfe2f6; border-radius:var(--radius);
              padding:14px 18px; color:#274b6d; font-size:.9rem; max-width:680px; margin:24px auto 0; }
.cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:18px; }
.card { background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:22px; box-shadow:var(--shadow); }
.card h3 { margin:0 0 8px; font-size:1.1rem; }
.card p { margin:0; color:var(--muted); font-size:.92rem; }
.card .tag { display:inline-block; font-size:.72rem; font-weight:700; color:var(--acc); background:var(--acc-soft);
             padding:3px 9px; border-radius:6px; margin-bottom:10px; }
pre { background:var(--dark); color:#cfe3ff; padding:16px 18px; border-radius:var(--radius); overflow-x:auto;
      font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:.85rem; line-height:1.5; }
pre .c { color:#7fd8a6; }
code.inline { background:#eef2f7; padding:2px 6px; border-radius:5px; font-size:.9em; }
details { background:#fff; border:1px solid var(--line); border-radius:var(--radius); margin-bottom:10px; }
details summary { cursor:pointer; padding:14px 18px; font-weight:600; list-style:none; }
details summary::-webkit-details-marker { display:none; }
details summary::after { content:"+"; float:right; color:var(--acc); font-weight:700; }
details[open] summary::after { content:"−"; }
details .ans { padding:0 18px 16px; color:var(--muted); }
.prose { max-width:720px; }
.prose p { color:#33405a; }

/* ---------- Footer ---------- */
.footer { background:var(--dark); color:#aebed3; padding:40px 0; font-size:.88rem; }
.footer .wrap { display:flex; flex-wrap:wrap; justify-content:space-between; gap:18px; align-items:center; }
.footer b { color:#fff; font-size:1.1rem; }
.footer a { color:#cfe3ff; }
.footer .links { display:flex; gap:18px; flex-wrap:wrap; }

/* ---------- Mobile ---------- */
@media (max-width:760px) {
  .burger { display:block; margin-left:auto; }
  .nav { position:absolute; top:60px; left:0; right:0; background:#fff; border-bottom:1px solid var(--line);
         flex-direction:column; gap:0; padding:6px 0; display:none; }
  .nav.open { display:flex; }
  .nav a { padding:11px 20px; }
  .authnav { margin-left:auto; }
  .authnav .uname { display:none; }
  .hero h1 { font-size:1.7rem; }
  .search { flex-direction:column; }
  .search button { padding:14px; }
}