/* === Theme: Aqua Glow (Variant 1) === */
:root{
  /* База */
  --bg:#0b1520;
  --panel:#0f1e2b;
  --panel-2:#0c1a26;

  /* Текст и акценты */
  --text:#e8f5ff;
  --muted:#92b6d1;
  --glow:#21d4ff;     /* светящийся акцент */
  --accent:#14b8ff;   /* вторичный акцент */
  --ok:#29ffa6;
  --warn:#ffd166;
  --bad:#ff6b6b;

  /* Рамки/тени */
  --border:rgba(255,255,255,.08);
  --shadow-card: 0 10px 25px rgba(0,0,0,.30);
  --shadow-glow: 0 0 16px rgba(33,212,255,.25);

  /* Радиусы */
  --r-card:16px;
  --r-btn:10px;
  --r-badge:999px;
}

/* Градиентный фон со свечением */
html,body{height:100%}
body{
  margin:0; color:var(--text);
  background:
    radial-gradient(1200px 600px at -10% -10%, rgba(33,212,255,.14), transparent 50%),
    radial-gradient(900px 500px  at 110% -10%, rgba(33,212,255,.11), transparent 50%),
    radial-gradient(800px 400px  at 50%  120%, rgba(33,212,255,.10), transparent 60%),
    var(--bg);
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  font-family: system-ui,-apple-system,Segoe UI,Roboto,Inter,Arial,Helvetica,sans-serif;
}

/* Контейнер */
.wrap{max-width:1200px;margin:0 auto;padding:24px}

/* Лого-капля */
.logo{
  width:40px;height:40px;border-radius:12px;
  background: radial-gradient(60% 60% at 50% 40%, rgba(33,212,255,.35), transparent 60%), #0a1721;
  box-shadow: 0 0 32px rgba(33,212,255,.35), inset 0 0 24px rgba(33,212,255,.25);
  display:grid;place-items:center;
}
.logo:before{
  content:"C"; font-weight:800; font-size:22px; color:var(--glow);
  text-shadow: 0 0 12px rgba(33,212,255,.8), 0 0 28px rgba(33,212,255,.5);
}

/* Заголовки */
h1{margin:0 0 6px;font-size:28px;letter-spacing:.3px}
h2{margin:0 0 12px;font-size:18px;font-weight:800}

/* Карточки */
.card{
  background:linear-gradient(180deg,var(--panel),var(--panel-2));
  border:1px solid var(--border);
  border-radius:var(--r-card);
  padding:18px 16px;
  margin:18px 0;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.02), var(--shadow-card);
}

/* Маркеры-пули */
.bullet{display:flex;align-items:flex-start;gap:10px;padding:10px 0;border-top:1px solid rgba(255,255,255,.06)}
.bullet:first-child{border-top:0}
.dot{
  width:8px;height:8px;border-radius:50%;
  background: radial-gradient(circle at 40% 40%, var(--ok), #0cf);
  box-shadow:0 0 12px rgba(41,255,166,.6);
  margin-top:.5em; flex:0 0 auto;
}

/* Навигация — большие табы (совместимо с вашим nav.css) */
nav.tabs{
  display:grid; grid-auto-flow:column; grid-auto-columns:1fr;
  gap:10px; margin:14px 0 22px;
}
nav.tabs .tab{
  display:flex;justify-content:center;align-items:center;
  height:44px; padding:0 14px; border-radius:var(--r-btn);
  background:var(--panel); border:1px solid var(--border);
  text-decoration:none; color:var(--text); font-weight:600; letter-spacing:.2px;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  transition:box-shadow .2s, outline-color .2s, background .2s;
}
nav.tabs .tab:hover{ box-shadow: var(--shadow-glow); }
nav.tabs .tab.active{
  outline:1px solid rgba(33,212,255,.35);
  background:linear-gradient(180deg,var(--panel),var(--panel-2));
}
nav.tabs .chip{
  justify-self:end; align-self:center; height:32px;
  display:inline-flex; align-items:center; padding:0 10px;
  border-radius:var(--r-badge); background:#0b1f2b; border:1px solid var(--border);
  font-size:12px; color:var(--muted);
}
/* адаптив колонок табов */
@media (max-width:1199px){nav.tabs{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-flow:row}}
@media (max-width:599px){nav.tabs{grid-template-columns:1fr}}

/* Выпадающие подменю (если используется .submenu) — лёгкая тень */
.submenu{box-shadow:0 12px 32px rgba(0,0,0,.35), 0 0 0 1px var(--border)}

/* Элементы управления */
input,button,select{
  height:36px;border-radius:var(--r-btn);border:1px solid var(--border);
  background:#0b1722;color:var(--text);padding:0 12px;font:inherit;
}
button{background:linear-gradient(180deg,#0f2734,#0a1c27);cursor:pointer}
button:hover{outline:1px solid rgba(33,212,255,.35)}

/* Таблицы */
table{width:100%;border-collapse:separate;border-spacing:0;border-radius:12px;overflow:hidden}
thead th{text-align:left;background:#0c1e2b;border-bottom:1px solid var(--border);padding:12px;color:#bfe7ff;font-weight:700}
tbody td{padding:12px;border-bottom:1px solid rgba(255,255,255,.06)}
tbody tr:hover{background:#0c1923}
.right{text-align:right} .mono{font-variant-numeric:tabular-nums}

/* Вспомогательные */
.muted{color:var(--muted)}
a.btn{display:inline-flex;align-items:center;gap:10px;padding:10px 14px;border-radius:var(--r-btn);text-decoration:none;border:1px solid var(--border);background:#0b1f2b;color:var(--text)}
a.btn:hover{outline:1px solid rgba(33,212,255,.35)}

/* Сетка 3 колонки для “О нас” */
.grid-3{display:grid;gap:14px;grid-template-columns:repeat(3,1fr)}
@media (max-width:1024px){.grid-3{grid-template-columns:repeat(2,1fr)}}
@media (max-width:720px){.grid-3{grid-template-columns:1fr} h1{font-size:24px}}
/* hero banner */
.hero img{
  border-radius:16px;
  box-shadow:0 20px 60px rgba(0,0,0,.35), inset 0 0 0 1px rgba(255,255,255,.02);
}
/* hero banner */
.hero img{
  border-radius:16px;
  box-shadow:0 20px 60px rgba(0,0,0,.35), inset 0 0 0 1px rgba(255,255,255,.02);
}
/* hero banner */
.hero picture, .hero img{
  display:block;
  border-radius:16px;
  overflow:hidden;
  box-shadow:0 24px 60px rgba(0,0,0,.35),
             inset 0 0 0 1px rgba(255,255,255,.02);
}

/* === Crypto Parser: Banner-like typography (2025-10-29) === */
:root{
  --font-display: "Sora", Inter, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --font-ui: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;

  /* оттенок «свечения» из баннера */
  --neon: #21d4ff;
  --neon-soft: rgba(33,212,255,.55);
  --neon-dim:  rgba(33,212,255,.28);
}

/* Базовая копия — ровная и компактная */
html, body{
  font-family: var(--font-ui) !important;
  letter-spacing: .1px;
}

/* Заголовки в духе баннера */
h1, h2, h3{
  font-family: var(--font-display);
  font-weight: 800;
  letter-spacing: .02em;
}

/* Мягкое «неоновое» свечение (аккуратно) */
.neon-soft{
  color: var(--text);
  text-shadow:
    0 0 6px var(--neon-dim),
    0 0 18px var(--neon-soft);
}

/* Более яркий вариант — для hero только */
.neon-strong{
  color: var(--text);
  text-shadow:
    0 0 10px var(--neon-soft),
    0 0 26px var(--neon),
    0 0 42px var(--neon);
}

/* Навигация — чуть плотнее и капслок как на постере */
nav.tabs .tab{
  font-family: var(--font-display);
  font-weight: 600;
  letter-spacing: .02em;
  text-transform: uppercase;
  font-size: 14px;
}

/* Подзаголовки карточек — заметнее */
.card h2{
  font-family: var(--font-display);
  font-weight: 800;
  letter-spacing: .02em;
}

/* Кнопки/бейджи — единый голос интерфейса */
a.btn, .chip{
  font-family: var(--font-display);
  font-weight: 600;
  letter-spacing: .02em;
}

/* Класс для главного h1 на about/index */
.brand-title{
  font-size: clamp(26px, 3.2vw, 36px);
}

/* === Tabs font & glow (2025-10-29) ============================== */
/* Загружаем Orbitron прямо из CSS (не трогаем <head>) */
@import url("https://fonts.googleapis.com/css2?family=Orbitron:wght@500;600;700&display=swap");

:root{
  --font-tabs: "Orbitron", "Sora", Inter, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --neon: #21d4ff;
  --neon-soft: rgba(33,212,255,.55);
  --neon-dim:  rgba(33,212,255,.28);
}

/* Применяем только к вкладкам */
body nav.tabs .tab,
body nav.tabs .tab .tab-main,
body nav.tabs .tab .tab-caret{
  font-family: var(--font-tabs) !important;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
}

/* Базовое свечение текста вкладок */
body nav.tabs .tab{
  text-shadow:
    0 0 6px var(--neon-dim),
    0 0 14px rgba(33,212,255,.18);
}

/* Hover / active — ярче */
body nav.tabs .tab:hover,
body nav.tabs .tab.active{
  text-shadow:
    0 0 8px var(--neon-soft),
    0 0 22px rgba(33,212,255,.35);
}

/* Чуть контрастнее стрелку-«каретку» */
body nav.tabs .tab .tab-caret{
  border-color: rgba(255,255,255,.14);
}

/* На очень тёмном фоне делаем свечение каплю сильнее на мобилках */
@media (max-width: 640px){
  body nav.tabs .tab{
    text-shadow:
      0 0 7px var(--neon-dim),
      0 0 18px rgba(33,212,255,.22);
  }
}
 /* === /Tabs font & glow ========================================= */

/* === Tabs font & glow (2025-10-29) ============================== */
/* Загружаем Orbitron прямо из CSS (не трогаем <head>) */
@import url("https://fonts.googleapis.com/css2?family=Orbitron:wght@500;600;700&display=swap");

:root{
  --font-tabs: "Orbitron", "Sora", Inter, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --neon: #21d4ff;
  --neon-soft: rgba(33,212,255,.55);
  --neon-dim:  rgba(33,212,255,.28);
}

/* Применяем только к вкладкам */
body nav.tabs .tab,
body nav.tabs .tab .tab-main,
body nav.tabs .tab .tab-caret{
  font-family: var(--font-tabs) !important;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
}

/* Базовое свечение текста вкладок */
body nav.tabs .tab{
  text-shadow:
    0 0 6px var(--neon-dim),
    0 0 14px rgba(33,212,255,.18);
}

/* Hover / active — ярче */
body nav.tabs .tab:hover,
body nav.tabs .tab.active{
  text-shadow:
    0 0 8px var(--neon-soft),
    0 0 22px rgba(33,212,255,.35);
}

/* Чуть контрастнее стрелку-«каретку» */
body nav.tabs .tab .tab-caret{
  border-color: rgba(255,255,255,.14);
}

/* На очень тёмном фоне делаем свечение каплю сильнее на мобилках */
@media (max-width: 640px){
  body nav.tabs .tab{
    text-shadow:
      0 0 7px var(--neon-dim),
      0 0 18px rgba(33,212,255,.22);
  }
}
 /* === /Tabs font & glow ========================================= */
