/* ============================================================
   ФЕБ — Dark theme override (applies when body[data-theme="dark"])
   Keeps layout/sizes from site.css; swaps surfaces + contrast.
   ============================================================ */

body[data-theme="dark"] {
  background: #0A0D14;
  color: #F5F7FB;
}

/* --- Tokens override (scoped to dark body so tokens.css defaults persist) --- */
body[data-theme="dark"] {
  --bg-0: #121826;          /* card */
  --bg-1: #0A0D14;          /* page */
  --bg-2: #151C2B;          /* subtle panel */
  --fg-1: #F5F7FB;
  --fg-2: #B4BBCA;
  --fg-3: #8891A3;
  --fg-4: #6B7380;

  --slate-50:  #0F1420;
  --slate-100: #151C2B;
  --slate-200: rgba(255,255,255,0.10);
  --slate-300: rgba(255,255,255,0.18);
  --slate-500: #8891A3;
  --slate-700: #CBD5E1;

  --color-cta:        #FB923C;
  --color-cta-hover:  #F97316;
  --color-cta-soft:   rgba(251,146,60,0.14);
  --color-cta-softer: rgba(251,146,60,0.06);

  --shadow-lg: 0 20px 60px -15px rgba(0,0,0,0.55), 0 0 0 1px rgba(255,255,255,0.04);
  --shadow-cta: 0 14px 40px -10px rgba(251, 146, 60, 0.55);
  --shadow-cta-hover: 0 20px 50px -10px rgba(251, 146, 60, 0.7);
}

/* Page base */
body[data-theme="dark"] { background: var(--bg-1); }

/* Hero — dark radial glow */
body[data-theme="dark"] .hero {
  background:
    radial-gradient(ellipse 80% 60% at 50% 0%, rgba(251,146,60,0.18), transparent 60%),
    linear-gradient(180deg, #0F1420 0%, #0A0D14 100%);
}

/* Nav */
body[data-theme="dark"] .nav {
  background: rgba(10,13,20,0.75);
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
body[data-theme="dark"] .nav-links a { color: var(--fg-2); }
body[data-theme="dark"] .nav-links a:hover {
  color: var(--fg-1);
  text-decoration-color: rgba(255, 255, 255, 0.35);
}
body[data-theme="dark"] .benefit:hover {
  background: rgba(255, 255, 255, 0.04);
}
body[data-theme="dark"] .card:not(.apply-form):hover {
  border-color: rgba(255, 255, 255, 0.14);
  box-shadow: 0 28px 70px -24px rgba(0, 0, 0, 0.65), 0 0 0 1px rgba(255, 255, 255, 0.06);
}
body[data-theme="dark"] .step-card:not(.step-card-final):hover {
  border-color: rgba(255, 255, 255, 0.12);
  box-shadow: 0 26px 64px -22px rgba(0, 0, 0, 0.6);
}
body[data-theme="dark"] .terms-card:hover {
  border-color: rgba(255, 255, 255, 0.12);
  box-shadow: 0 26px 64px -22px rgba(0, 0, 0, 0.55);
}
body[data-theme="dark"] .footer-contacts a:hover {
  color: var(--color-cta);
  text-decoration-color: rgba(251, 146, 60, 0.45);
}
body[data-theme="dark"] .hero-cross a:hover {
  color: var(--color-cta);
  text-decoration-color: rgba(251, 146, 60, 0.5);
}
body[data-theme="dark"] .hero-cross a { color: var(--fg-2); }
body[data-theme="dark"] .inline-cross a { color: var(--fg-2); }
body[data-theme="dark"] .inline-cross a:hover {
  color: var(--color-cta);
  text-decoration-color: rgba(251, 146, 60, 0.5);
}
body[data-theme="dark"] .nav-logo-sub { color: var(--fg-3); }

/* Invert FEB logo to white in dark */
body[data-theme="dark"] img[src*="logo-feb"] {
  filter: brightness(0) invert(1);
}

/* Section alt */
body[data-theme="dark"] .section-alt {
  background: #0F1420;
  border-top: 1px solid rgba(255,255,255,0.04);
  border-bottom: 1px solid rgba(255,255,255,0.04);
}

/* Cards */
body[data-theme="dark"] .card {
  background: #121826;
  border-color: rgba(255,255,255,0.08);
  box-shadow: 0 20px 60px -15px rgba(0,0,0,0.55), 0 0 0 1px rgba(255,255,255,0.04);
}

/* Pills */
body[data-theme="dark"] .pill {
  background: rgba(255,255,255,0.06);
  color: #CBD5E1;
}
body[data-theme="dark"] .pill-accent {
  background: rgba(251,146,60,0.16);
  color: #FDBA74;
}

/* Buttons */
body[data-theme="dark"] .btn-ghost {
  color: var(--fg-1);
  border-color: rgba(255,255,255,0.14);
}
body[data-theme="dark"] .btn-ghost:hover {
  background: rgba(255,255,255,0.05);
  border-color: rgba(255,255,255,0.24);
}

/* Stat divider */
body[data-theme="dark"] .stat-divider {
  background: rgba(255,255,255,0.12);
}

/* Economics — keep the orange card warm but deeper */
body[data-theme="dark"] .econ-result {
  background: linear-gradient(180deg, rgba(251,146,60,0.18) 0%, rgba(251,146,60,0.06) 100%);
  border-color: rgba(251,146,60,0.35);
}
body[data-theme="dark"] .econ-result .label-orange { color: #FDBA74; }
body[data-theme="dark"] .econ-result-row { color: #FED7AA; }
body[data-theme="dark"] .econ-result-row b { color: #FFF7ED; }
body[data-theme="dark"] .econ-divider { background: rgba(251,146,60,0.25); }
body[data-theme="dark"] .econ-total-label { color: #FDBA74; }
body[data-theme="dark"] .econ-total { color: #FB923C; }
body[data-theme="dark"] .econ-total-note { color: #FED7AA; }
body[data-theme="dark"] .econ-row b { color: var(--fg-1); }

/* Arrow list / steps / checks on dark */
body[data-theme="dark"] .arrow-list li { color: var(--fg-2); }
body[data-theme="dark"] .step-title { color: var(--fg-1); }
body[data-theme="dark"] .step-body { color: var(--fg-3); }
body[data-theme="dark"] .check { color: var(--fg-2); }
body[data-theme="dark"] .check b { color: var(--fg-1); }

/* Journey final card */
body[data-theme="dark"] .step-card-final {
  background: linear-gradient(180deg, rgba(251,146,60,0.18) 0%, rgba(251,146,60,0.06) 100%);
  border-color: rgba(251,146,60,0.35);
}
body[data-theme="dark"] .step-card-final .step-card-title { color: #FED7AA; }
body[data-theme="dark"] .step-card-final .step-card-body { color: #FDBA74; }

/* Apply section */
body[data-theme="dark"] .section-apply {
  background: linear-gradient(180deg, #0A0D14 0%, #0F1420 100%);
}
body[data-theme="dark"] .contact-icon {
  background: rgba(255,255,255,0.06);
  color: var(--fg-1);
  border-color: rgba(255,255,255,0.08);
}
body[data-theme="dark"] .field input,
body[data-theme="dark"] .field select,
body[data-theme="dark"] .field textarea {
  background: rgba(255,255,255,0.04);
  color: var(--fg-1);
  border-color: rgba(255,255,255,0.12);
}
body[data-theme="dark"] .field input::placeholder {
  color: var(--fg-4);
}
body[data-theme="dark"] .field input:focus,
body[data-theme="dark"] .field select:focus,
body[data-theme="dark"] .field textarea:focus {
  border-color: var(--color-cta);
  box-shadow: 0 0 0 3px rgba(251,146,60,0.22);
}
body[data-theme="dark"] .form-feedback.is-success {
  background: rgba(34,197,94,0.16);
  color: #BBF7D0;
  border-color: rgba(34,197,94,0.28);
}
body[data-theme="dark"] .form-feedback.is-error {
  background: rgba(239,68,68,0.14);
  color: #FECACA;
  border-color: rgba(239,68,68,0.24);
}

/* Terms */
body[data-theme="dark"] .terms-title { color: var(--color-cta); }
body[data-theme="dark"] .terms-list { color: var(--fg-2); }
body[data-theme="dark"] .terms-list b { color: var(--fg-1); }
body[data-theme="dark"] .terms-footer { color: var(--fg-3); }
body[data-theme="dark"] .terms-footer b { color: var(--fg-1); }

/* Small note / muted */
body[data-theme="dark"] .small-note { color: var(--fg-3); }
body[data-theme="dark"] .stat-label { color: var(--fg-3); }

/* Feature grid copy */
body[data-theme="dark"] .feature-body { color: var(--fg-2); }
body[data-theme="dark"] .feature-body b { color: var(--fg-1); }
body[data-theme="dark"] .card-body { color: var(--fg-2); }

/* Benefits copy */
body[data-theme="dark"] .benefit-body { color: var(--fg-2); }
body[data-theme="dark"] .benefit-title { color: var(--fg-1); }

/* Shot frames stay light (product screenshots look natural on white chrome),
   but soften the border so they sit on the dark bg */
body[data-theme="dark"] .shot {
  border-color: rgba(255,255,255,0.08);
  box-shadow: 0 30px 70px -20px rgba(0,0,0,0.7);
  transition: box-shadow 220ms ease-out;
}
@media (hover: hover) and (pointer: fine) {
  body[data-theme="dark"] .shot:hover {
    box-shadow: 0 36px 80px -22px rgba(0, 0, 0, 0.75);
  }
}

/* Footer */
body[data-theme="dark"] .footer {
  background: #0A0D14;
  border-top: 1px solid rgba(255,255,255,0.06);
  color: var(--fg-3);
}
body[data-theme="dark"] .footer-inner { color: var(--fg-3); }

/* Split body copy */
body[data-theme="dark"] .split-body { color: var(--fg-2); }
body[data-theme="dark"] .econ-name { color: var(--fg-1); }
body[data-theme="dark"] .label-uppercase { color: var(--fg-3); }

/* Section & hero titles pick up --fg-1 automatically, but make sure */
body[data-theme="dark"] .section-title,
body[data-theme="dark"] .hero-title,
body[data-theme="dark"] .apply-title,
body[data-theme="dark"] .stat-num,
body[data-theme="dark"] .contact-value,
body[data-theme="dark"] .form-title {
  color: var(--fg-1);
}