/* Общие стили всех страниц: основа, шапка, переключатель языка, мобильное меню, футер.
   Стили конкретной страницы — в css/<страница>.css. Inline-стилей нет (строгая CSP сервера).
   Брейкпоинт телефона — 768px: .d-only — только на ПК, .m-only — только на телефоне. */

body { margin: 0; background: #FFFFFF; color: #1B1B1C; font-family: 'Onest', 'Noto Sans SC', 'Noto Sans Devanagari', system-ui, sans-serif; text-wrap: pretty; -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
a:hover { color: #0500FF; }
button:focus-visible, a:focus-visible { outline: 2px solid #0500FF; outline-offset: 2px; }
h1, h2, h3 { font-family: 'Manrope', 'Noto Sans SC', 'Noto Sans Devanagari', sans-serif; color: inherit; }
[hidden] { display: none !important; }
svg.flex-none, .flex-none { flex: none; }

.page { min-height: 100vh; background: #FFFFFF; display: flex; flex-direction: column; }

/* ---------- Шапка ---------- */
.nav { position: sticky; top: 0; z-index: 20; background: rgba(255,255,255,0.92); backdrop-filter: blur(12px); border-bottom: 1px solid #EEEEF0; }
.nav-in { max-width: 1240px; margin: 0 auto; padding: 0 40px; height: 76px; display: flex; align-items: center; gap: clamp(16px, 3vw, 40px); white-space: nowrap; }
.logo { display: flex; align-items: center; gap: 10px; }
.logo-mark { width: 34px; height: 34px; border-radius: 10px; background: #0500FF; position: relative; display: inline-block; }
.logo-dot { position: absolute; right: 7px; bottom: 7px; width: 10px; height: 10px; border-radius: 50%; background: #48FF91; }
.logo-text { font-family: 'Manrope', sans-serif; font-weight: 800; font-size: 22px; letter-spacing: -0.02em; }
.nav-links { display: flex; gap: clamp(16px, 2.4vw, 32px); font-size: 16px; font-weight: 500; }
.nav-links a.is-current { color: #0500FF; }
.nav-right { margin-left: auto; display: flex; align-items: center; gap: 12px; }

.lang-wrap { position: relative; }
.nav-lang { display: flex; align-items: center; gap: 8px; height: 44px; padding: 0 16px; border-radius: 999px; border: 1px solid #E2E2E6; background: #FFFFFF; font: inherit; font-size: 15px; font-weight: 600; color: #1B1B1C; cursor: pointer; }
.nav-lang:hover { border-color: #0500FF; color: #0500FF; }
.flag { width: 22px; height: 16px; border-radius: 3px; object-fit: cover; box-shadow: 0 0 0 1px rgba(0,0,0,0.08); flex: none; }
.lang-list { position: absolute; right: 0; top: calc(100% + 8px); width: 210px; background: #FFFFFF; border-radius: 20px; box-shadow: 0 16px 48px rgba(27,27,28,0.14); border: 1px solid #EEEEF0; padding: 8px; z-index: 30; display: flex; flex-direction: column; gap: 2px; }
.lang-opt { display: flex; width: 100%; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 14px; border-radius: 12px; background: transparent; border: 0; cursor: pointer; font: inherit; font-size: 15px; font-weight: 500; color: #1B1B1C; text-align: left; }
.lang-opt:hover, .lang-opt.is-on { background: #F2F2FF; }
.lang-opt-name { display: flex; align-items: center; gap: 10px; }
.lang-opt-code { font-size: 12px; font-weight: 700; color: #0500FF; }

.btn-cta { height: 44px; padding: 0 22px; border-radius: 999px; background: #0500FF; color: #FFFFFF; font-size: 15px; font-weight: 700; display: flex; align-items: center; }
.btn-cta:hover { background: #2E2BFF; color: #FFFFFF; }
.menu-btn { width: 44px; height: 44px; border-radius: 50%; border: 0; background: #F5F5F7; color: #1B1B1C; display: flex; align-items: center; justify-content: center; cursor: pointer; }

.mnav { padding: 8px 16px 20px; display: flex; flex-direction: column; gap: 4px; border-top: 1px solid #EEEEF0; background: #FFFFFF; }
.mnav-link { display: flex; align-items: center; min-height: 52px; font-size: 18px; font-weight: 600; border-bottom: 1px solid #F0F0F2; }
.mnav-link.is-last { border-bottom: 0; }
.mnav-cta { margin-top: 12px; height: 56px; border-radius: 999px; background: #0500FF; color: #FFFFFF; font-size: 17px; font-weight: 700; display: flex; align-items: center; justify-content: center; }
.mnav-cta:hover { color: #FFFFFF; }

/* ---------- Футер ---------- */
.footer { border-top: 1px solid #EEEEF0; }
.footer-in { max-width: 1240px; margin: 0 auto; padding: 32px 40px 48px; display: flex; justify-content: space-between; align-items: center; gap: 24px; flex-wrap: wrap; font-size: 15px; color: #616161; }
.footer-brand { display: flex; align-items: center; gap: 10px; }
.footer-mark { width: 22px; height: 22px; border-radius: 7px; background: #0500FF; position: relative; display: inline-block; }
.footer-dot { position: absolute; right: 4px; bottom: 4px; width: 6px; height: 6px; border-radius: 50%; background: #48FF91; }
.footer-links { display: flex; gap: 24px; flex-wrap: wrap; }

/* ---------- Общие блоки страниц ---------- */
.main { flex: 1; width: 100%; max-width: 1240px; margin: 0 auto; padding: 72px 40px 96px; box-sizing: border-box; display: flex; flex-direction: column; gap: 96px; }
.kicker { align-self: flex-start; display: inline-flex; align-items: center; gap: 8px; height: 34px; padding: 0 14px; border-radius: 999px; background: #F2F2FF; color: #0500FF; font-size: 14px; font-weight: 700; }
.kicker-dot { width: 8px; height: 8px; border-radius: 50%; background: #48FF91; }
.eyebrow { font-size: 14px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: #0500FF; }
.eyebrow.on-dark { color: #48FF91; }
.lead { margin: 0; font-size: 20px; line-height: 1.55; color: #616161; }
.btn-row { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 6px; }
.btn-lg { height: 60px; padding: 0 32px; border-radius: 999px; font-size: 17px; font-weight: 700; display: flex; align-items: center; }
.btn-primary { background: #0500FF; color: #FFFFFF; }
.btn-primary:hover { background: #2E2BFF; color: #FFFFFF; }
.btn-outline { border: 1px solid #E2E2E6; color: #1B1B1C; }
.btn-outline:hover { border-color: #0500FF; color: #0500FF; }
.sec-stack { display: flex; flex-direction: column; gap: 40px; }
.sec-head { display: flex; flex-direction: column; gap: 14px; max-width: 720px; }
.sec-h2 { margin: 0; font-weight: 800; font-size: clamp(34px, 4vw, 52px); line-height: 1.06; letter-spacing: -0.035em; }
.sec-sub { margin: 0; font-size: 18px; line-height: 1.55; color: #616161; }
.h2-md { margin: 0; font-weight: 800; font-size: clamp(32px, 3.6vw, 48px); line-height: 1.08; letter-spacing: -0.03em; }
.cta-band { border-radius: 40px; background: #F2F2FF; padding: clamp(40px, 6vw, 72px); display: flex; align-items: center; justify-content: space-between; gap: 32px; flex-wrap: wrap; }
.cta-band-text { display: flex; flex-direction: column; gap: 12px; max-width: 560px; }
.cta-band-btn { height: 64px; padding: 0 36px; border-radius: 999px; background: #0500FF; color: #FFFFFF; font-size: 18px; font-weight: 700; display: flex; align-items: center; gap: 10px; }
.cta-band-btn:hover { background: #2E2BFF; color: #FFFFFF; }

/* ---------- Бегущая строка сетей (главная, импорт) ---------- */
.marquee { position: relative; overflow: hidden; padding: 8px 0; -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
@keyframes chains-scroll { from { transform: translateX(0); } to { transform: translateX(-50%); } }
.chains-track { display: flex; gap: 14px; width: max-content; animation: chains-scroll 45s linear infinite; }
.chains-track:hover { animation-play-state: paused; }
.chip { display: flex; align-items: center; gap: 12px; height: 64px; padding: 0 22px 0 12px; border-radius: 999px; background: #FFFFFF; border: 1px solid #E6E6EA; box-shadow: 0 4px 14px rgba(27,27,28,0.05); white-space: nowrap; flex: none; }
.chip-icon { width: 40px; height: 40px; border-radius: 50%; color: #FFFFFF; display: flex; align-items: center; justify-content: center; font-size: 18px; font-weight: 800; font-family: 'Manrope', sans-serif; }
.chip-text { display: flex; flex-direction: column; line-height: 1.15; }
.chip-name { font-size: 16px; font-weight: 700; color: #1B1B1C; }
.chip-tick { font-size: 12px; font-weight: 600; color: #8A8A94; letter-spacing: 0.04em; }
.chip-btc { background: #F7931A; }
.chip-eth { background: #627EEA; }
.chip-sol { background: #9945FF; }
.chip-bnb { background: #F3BA2F; }
.chip-ton { background: #0098EA; }
.chip-trx { background: #EB0029; }
.chip-pol { background: #8247E5; }
.chip-arb { background: #28A0F0; }
.chip-avax { background: #E84142; }
.chip-xrp { background: #23292F; }
.chip-ltc { background: #345D9D; }
.chip-doge { background: #C2A633; }
.chip-ada { background: #0033AD; }
.chip-op { background: #FF0420; }
.chip-base { background: #0052FF; }

/* ---------- Спиннер в кнопках ---------- */
@keyframes vl-spin { to { transform: rotate(360deg); } }
.spinner { width: 20px; height: 20px; border-radius: 50%; border: 2.5px solid rgba(255,255,255,0.35); border-top-color: #FFFFFF; animation: vl-spin 0.8s linear infinite; display: inline-block; }

/* ---------- Телефон ---------- */
@media (min-width: 769px) { .m-only { display: none !important; } }
@media (max-width: 768px) {
  .d-only { display: none !important; }
  .page { overflow-x: clip; }
  .nav { background: rgba(255,255,255,0.94); }
  .nav-in { height: 64px; padding: 0 16px; gap: 10px; max-width: none; margin: 0; white-space: normal; }
  .nav-lang { gap: 6px; padding: 0 12px; font-size: 14px; font-weight: 700; }
  .logo { gap: 8px; }
  .logo-mark { width: 30px; height: 30px; border-radius: 9px; }
  .logo-dot { right: 6px; bottom: 6px; width: 9px; height: 9px; }
  .logo-text { font-size: 20px; }
  .footer-in { padding: 28px 16px 40px; }
  .main { padding: 32px 16px 64px; gap: 64px; }
}
