/* ===== Tokens ===== */
:root{
  --bg: #12141c;
  --bg-alt: #171a24;
  --surface: #1b1e29;
  --surface-2: #21252f;
  --line: #2c3140;
  --text: #eef1f7;
  --text-muted: #8b92a8;
  --accent: #e8b04b;      /* золото — «MVP» */
  --accent-2: #4dd4c7;    /* цианово-бирюзовый — HUD-линии */
  --accent-soft: rgba(232,176,75,0.12);
  --radius: 2px;
  --display: "Chakra Petko", "Chakra Petch", "Oswald", sans-serif;
  --body: "IBM Plex Sans", "Inter", system-ui, sans-serif;
  --mono: "IBM Plex Mono", "JetBrains Mono", monospace;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:
    radial-gradient(1200px 500px at 80% -10%, rgba(77,212,199,0.08), transparent 60%),
    radial-gradient(900px 400px at 10% 0%, rgba(232,176,75,0.07), transparent 55%),
    var(--bg);
  color:var(--text);
  font-family:var(--body);
  line-height:1.6;
}

img{max-width:100%;display:block;}

.wrap{max-width:1040px;margin:0 auto;padding:0 24px;}

/* ===== HUD frame — signature element ===== */
.hud{
  position:relative;
  border:1px solid var(--line);
  background:var(--surface);
}
.hud::before,.hud::after,
.hud .c2::before,.hud .c2::after{
  content:"";
  position:absolute;
  width:16px;height:16px;
  border-color:var(--accent-2);
  border-style:solid;
  opacity:.9;
}
.hud::before{top:-1px;left:-1px;border-width:2px 0 0 2px;}
.hud::after{top:-1px;right:-1px;border-width:2px 2px 0 0;}
.hud .c2::before{position:absolute;bottom:-1px;left:-1px;border-width:0 0 2px 2px;}
.hud .c2::after{position:absolute;bottom:-1px;right:-1px;border-width:0 2px 2px 0;}

/* ===== Nav ===== */
header.site{
  position:sticky; top:0; z-index:20;
  background:rgba(18,20,28,0.86);
  backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);
}
nav.site{
  max-width:1040px;margin:0 auto;padding:14px 24px;
  display:flex;align-items:center;justify-content:space-between;
  font-family:var(--mono);font-size:13px;letter-spacing:.04em;
}
nav.site .tag{color:var(--accent);}
nav.site a{color:var(--text-muted);text-decoration:none;margin-left:22px;transition:color .15s;}
nav.site a:hover, nav.site a.active{color:var(--text);}
nav.site a.active{color:var(--accent-2);}

/* ===== Hero ===== */
.hero{padding:72px 0 56px;}
.eyebrow{
  font-family:var(--mono);font-size:12px;letter-spacing:.16em;
  color:var(--accent-2);text-transform:uppercase;margin:0 0 14px;
}
h1.display{
  font-family:var(--display);
  font-weight:600;
  font-size:clamp(34px,6vw,58px);
  line-height:1.05;
  margin:0 0 18px;
  letter-spacing:.01em;
}
h1.display span{color:var(--accent);}
.lede{color:var(--text-muted);font-size:18px;max-width:620px;margin:0 0 26px;}
.hero-stats{display:flex;gap:28px;flex-wrap:wrap;margin-top:34px;}
.hero-stats div{font-family:var(--mono);}
.hero-stats b{display:block;font-size:26px;color:var(--accent);font-family:var(--display);}
.hero-stats span{font-size:12px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.06em;}

/* ===== Section shell ===== */
section{padding:56px 0;border-top:1px solid var(--line);}
.kicker{
  font-family:var(--mono);font-size:12px;color:var(--accent);
  letter-spacing:.14em;text-transform:uppercase;margin:0 0 8px;
}
h2.display{
  font-family:var(--display);font-weight:600;
  font-size:clamp(24px,3.6vw,32px);margin:0 0 22px;
}
p{color:var(--text-muted);}
p.lead{color:var(--text);}

/* ===== Text block ===== */
.text-block .content{max-width:680px;color:var(--text);}
.text-block .content p{color:var(--text);}

/* ===== List / facts block ===== */
.facts-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:1px;background:var(--line);border:1px solid var(--line);
}
.facts-grid .fact{background:var(--surface);padding:22px;}
.facts-grid .num{font-family:var(--mono);color:var(--accent-2);font-size:12px;letter-spacing:.08em;}
.facts-grid h3{font-family:var(--display);margin:8px 0 6px;font-size:18px;font-weight:600;}
.facts-grid p{margin:0;font-size:14px;}

/* ===== Gallery ===== */
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
.gallery figure{margin:0;padding:0;}
.gallery .hud{padding:14px;}
.gallery figcaption{
  font-family:var(--mono);font-size:12px;color:var(--text-muted);
  margin-top:10px;text-align:center;letter-spacing:.03em;
}
@media (max-width:720px){.gallery{grid-template-columns:1fr;}}

/* ===== Table ===== */
table{width:100%;border-collapse:collapse;font-size:14.5px;}
thead th{
  text-align:left;font-family:var(--mono);font-size:12px;letter-spacing:.06em;
  text-transform:uppercase;color:var(--accent-2);
  border-bottom:1px solid var(--line);padding:10px 12px;
}
tbody td{padding:12px;border-bottom:1px solid var(--line);vertical-align:top;color:var(--text);}
tbody tr:hover{background:var(--surface-2);}
table.results a{color:var(--accent);text-decoration:none;word-break:break-all;}
table.results a:hover{text-decoration:underline;}
.table-wrap{overflow-x:auto;border:1px solid var(--line);background:var(--surface);}
.table-wrap table{margin:0;}
.table-wrap thead th:first-child, .table-wrap tbody td:first-child{padding-left:16px;}

/* ===== Timeline ===== */
.timeline{border-left:2px solid var(--line);padding-left:24px;display:grid;gap:26px;margin-left:6px;}
.timeline .step{position:relative;}
.timeline .step::before{
  content:"";position:absolute;left:-31px;top:4px;width:10px;height:10px;
  background:var(--accent);border-radius:50%;box-shadow:0 0 0 4px var(--accent-soft);
}
.timeline .yr{font-family:var(--mono);color:var(--accent-2);font-size:13px;}
.timeline h4{margin:4px 0 4px;font-family:var(--display);font-size:17px;}
.timeline p{margin:0;font-size:14.5px;}

/* ===== Query card (search page) ===== */
.query-card{border:1px solid var(--line);background:var(--surface);padding:24px;margin-bottom:28px;}
.query-card .qline{
  font-family:var(--mono);font-size:15px;color:var(--accent);
  background:var(--bg-alt);border:1px solid var(--line);padding:10px 14px;
  margin:0 0 14px;display:inline-block;
}
.query-card .why{font-size:14.5px;color:var(--text);margin:0 0 18px;max-width:760px;}
.query-card .op{color:var(--accent-2);font-family:var(--mono);}

/* ===== Footer ===== */
footer.site{border-top:1px solid var(--line);padding:32px 0;color:var(--text-muted);font-size:13px;font-family:var(--mono);}

/* Utility */
.pill{
  display:inline-block;font-family:var(--mono);font-size:11px;letter-spacing:.06em;
  color:var(--accent-2);border:1px solid var(--line);padding:3px 8px;text-transform:uppercase;
}