:root {
    --ink-900: #070B12;
    --ink-800: #0B111B;
    --ink-700: #10161F;
    --ink-600: #151E2B;
    --ink-500: #1C2735;
    --gold-400: #F5B841;
    --gold-300: #FFD475;
    --teal-400: #2DD4BF;
    --teal-300: #5EEAD4;
    --paper-50: #EAF0F7;
    --paper-300: #A8B3C2;
    --paper-400: #8B98A9;
    --paper-500: #66717F;
    --edge: rgba(255, 255, 255, 0.09);
    --edge-strong: rgba(255, 255, 255, 0.16);
    --font-head: 'Sora', -apple-system, BlinkMacSystemFont, sans-serif;
    --font-body: 'Manrope', -apple-system, BlinkMacSystemFont, sans-serif;
    --font-mono: 'IBM Plex Mono', monospace;
}

* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    scroll-behavior: smooth;
    background-color: var(--ink-900);
    color: var(--paper-50);
    font-family: var(--font-body);
}

body {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    overflow-x: hidden;
    background-color: var(--ink-900);
    color: var(--paper-50);
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-head);
}

.font-mono-rates {
    font-family: var(--font-mono);
}

/* ===== шапка ===== */
.swx-header {
    font-family: var(--font-head);
}

.swx-header .swx-nav-link {
    position: relative;
    letter-spacing: 0.01em;
}

.swx-header .swx-nav-link::after {
    content: '';
    position: absolute;
    bottom: -5px;
    left: 0;
    width: 0%;
    height: 2px;
    background: var(--gold-400);
    transition: width 0.22s ease;
}

.swx-header .swx-nav-link:hover::after,
.swx-header .swx-nav-link.swx-active::after {
    width: 100%;
}

.swx-header .swx-burger-btn:active {
    transform: scale(0.95);
}

/* ===== hero ===== */
.hero-section .hero-title-gradient {
    background: linear-gradient(100deg, var(--gold-400) 0%, var(--gold-300) 45%, var(--teal-400) 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.hero-section .hero-panel {
    background: linear-gradient(165deg, var(--ink-500) 0%, var(--ink-700) 60%, var(--ink-800) 100%);
    border: 1px solid var(--edge-strong);
    box-shadow: 0 24px 64px rgba(0, 0, 0, 0.65), inset 0 1px 0 rgba(255, 255, 255, 0.14);
}

.hero-section .hero-field {
    background: var(--ink-800);
    border: 1px solid var(--edge);
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.hero-section .hero-field:focus-within {
    border-color: var(--teal-400);
    box-shadow: 0 0 0 3px rgba(45, 212, 191, 0.12);
}

.hero-section .hero-submit {
    background: linear-gradient(100deg, var(--gold-400), var(--gold-300));
    color: #171106;
    transition: filter 0.2s ease, transform 0.15s ease;
}

.hero-section .hero-submit:hover {
    filter: brightness(1.06);
}

/* ===== калькулятор ===== */
.calc-section .calc-shell {
    background: linear-gradient(170deg, var(--ink-500) 0%, var(--ink-800) 100%);
    border: 1px solid var(--edge-strong);
    box-shadow: 0 24px 64px rgba(0, 0, 0, 0.6);
}

.calc-section .calc-cell {
    background: var(--ink-800);
    border: 1px solid var(--edge);
    transition: border-color 0.2s ease;
}

.calc-section .calc-cell:focus-within {
    border-color: var(--gold-400);
}

.calc-section .calc-swap-btn {
    transition: transform 0.25s ease, background-color 0.2s ease;
}

.calc-section .calc-swap-btn:hover {
    transform: rotate(180deg);
}

.calc-section .calc-swap-btn:active {
    transform: rotate(180deg) scale(0.92);
}

.calc-section .calc-rate-row:hover {
    background: rgba(45, 212, 191, 0.05);
}

/* ===== тарифы ===== */
.tariff-card {
    background: linear-gradient(180deg, var(--ink-500) 0%, var(--ink-700) 100%);
    border: 1px solid var(--edge-strong);
    transition: border-color 0.25s ease, box-shadow 0.25s ease;
}

.tariff-card:hover {
    border-color: rgba(245, 184, 65, 0.45);
    box-shadow: 0 18px 44px rgba(0, 0, 0, 0.5);
}

.tariff-card.tariff-featured {
    border-color: rgba(245, 184, 65, 0.5);
    box-shadow: 0 20px 52px rgba(245, 184, 65, 0.08);
}

.tariff-modal-backdrop {
    background: rgba(4, 7, 12, 0.78);
    backdrop-filter: blur(6px);
}

/* ===== карточки статей / хабы ===== */
.swx-card {
    background: linear-gradient(175deg, var(--ink-500), var(--ink-700) 70%);
    border: 1px solid var(--edge-strong);
    transition: border-color 0.22s ease, transform 0.22s ease;
}

.swx-card:hover {
    border-color: rgba(45, 212, 191, 0.5);
    transform: translateY(-2px);
}

.swx-tag {
    background: rgba(245, 184, 65, 0.12);
    border: 1px solid rgba(245, 184, 65, 0.35);
    color: var(--gold-400);
}

.swx-tag-teal {
    background: rgba(45, 212, 191, 0.1);
    border: 1px solid rgba(45, 212, 191, 0.35);
    color: var(--teal-400);
}

/* ===== статья ===== */
.detail-article h2 {
    font-family: var(--font-head);
    color: var(--paper-50);
    font-size: 20px;
    font-weight: 600;
    margin: 32px 0 12px;
    letter-spacing: -0.01em;
}

.detail-article h3 {
    font-family: var(--font-head);
    color: var(--gold-300);
    font-size: 16px;
    font-weight: 600;
    margin: 24px 0 10px;
}

.detail-article p {
    color: var(--paper-300);
    font-size: 15px;
    line-height: 1.75;
    margin-bottom: 14px;
}

.detail-article ul, .detail-article ol {
    color: var(--paper-300);
    font-size: 15px;
    line-height: 1.7;
    padding-left: 22px;
    margin: 0 0 16px;
}

.detail-article ul li, .detail-article ol li {
    margin-bottom: 8px;
}

.detail-article strong {
    color: var(--paper-50);
    font-weight: 600;
}

.detail-article blockquote {
    border-left: 3px solid var(--gold-400);
    background: rgba(245, 184, 65, 0.06);
    padding: 14px 18px;
    border-radius: 0 10px 10px 0;
    color: var(--paper-300);
    font-size: 15px;
    line-height: 1.7;
    margin: 0 0 16px;
}

/* ===== toc ===== */
.detail-toc a {
    color: var(--paper-400);
    font-size: 13px;
    line-height: 1.5;
    transition: color 0.15s ease;
    display: block;
    padding: 5px 0 5px 12px;
    border-left: 2px solid var(--edge);
}

.detail-toc a:hover {
    color: var(--gold-400);
    border-left-color: var(--gold-400);
}

/* ===== faq ===== */
.faq-item .faq-answer {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease;
}

.faq-item.js-open .faq-answer {
    max-height: 420px;
}

.faq-item .faq-chevron {
    transition: transform 0.25s ease;
}

.faq-item.js-open .faq-chevron {
    transform: rotate(180deg);
}

/* ===== футер ===== */
.swx-footer .swx-footer-link {
    transition: color 0.18s ease;
}

/* ===== команды (team) ===== */
.team-photo {
    filter: saturate(0.92) contrast(1.02);
}

/* ===== служебное ===== */
.swx-divider {
    border-top: 1px solid var(--edge);
}

.text-balance {
    text-wrap: balance;
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    .swx-card, .tariff-card { transition: none; }
}