/* ==========================================================================
   СИСТЕМА — неоновая игровая тема (по ТЗ на дизайн, ноябрь 2026)
   Подключается после style-blue.css и переопределяет палитру и компоненты.
   Тёмный зал, синий неон, золото для денег, летающие купюры/монеты/кубики/фишки.
   ========================================================================== */

:root {
  /* Палитра из ТЗ */
  --neon-bg: #05070F;
  --neon-surface: #0B1230;
  --neon-surface-2: #0E1740;
  --neon-line: #1A2A6B;
  --neon-blue: #0A5CFF;
  --neon-cyan: #00D4FF;
  --neon-violet: #8A2BFF;
  --neon-gold: #FFC700;
  --neon-text: #FFFFFF;
  --neon-text-2: #FFFFFF;
  --neon-error: #FF2E4D;
  --neon-success: #00E676;

  --grad-primary: linear-gradient(90deg, #0A5CFF 0%, #00D4FF 100%);
  --grad-secondary: linear-gradient(90deg, #8A2BFF 0%, #0A5CFF 100%);
  --glow-blue: 0 0 40px rgba(10, 92, 255, 0.8);
  --glow-blue-soft: 0 0 24px rgba(10, 92, 255, 0.45);
  --glow-gold: 0 0 18px rgba(255, 199, 0, 0.65), 0 0 42px rgba(255, 199, 0, 0.3);

  /* Переназначаем переменные базовой темы на тёмные */
  --bg-primary: var(--neon-bg);
  --bg-secondary: #070B1C;
  --bg-card: var(--neon-surface);
  --bg-card-subtle: var(--neon-surface-2);
  --bg-dark: #03050B;
  --bg-dark-card: var(--neon-surface);

  --ink-primary: var(--neon-text);
  --ink-secondary: var(--neon-text-2);
  --ink-muted: #EEF1FF;
  --ink-light: #E2E7FF;
  --ink-inverse: var(--neon-text);
  --ink-inverse-muted: var(--neon-text-2);

  --accent-red: var(--neon-blue);
  --accent-red-hover: #2B74FF;
  --accent-red-soft: rgba(10, 92, 255, 0.14);
  --accent-red-border: var(--neon-line);
  --accent-red-badge: rgba(10, 92, 255, 0.18);
  --accent-red-glow: rgba(10, 92, 255, 0.6);
  --accent-light: var(--neon-cyan);

  --graphite-pill: var(--neon-surface-2);
  --graphite-pill-hover: #15215A;
  --graphite-border: var(--neon-line);

  --border-light: var(--neon-line);
  --border-subtle: rgba(26, 42, 107, 0.6);
  --border-dark: var(--neon-line);

  --shadow-sm: 0 2px 10px rgba(0, 0, 0, 0.4);
  --shadow-card: 0 12px 32px -10px rgba(0, 0, 0, 0.7), inset 0 1px 0 rgba(255, 255, 255, 0.04);
  --shadow-hover: 0 18px 44px -10px rgba(10, 92, 255, 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.06);
  --shadow-btn: var(--glow-blue-soft);
}

/* --------------------------------------------------------------------------
   Фон страницы: пятна неона + зерно
   -------------------------------------------------------------------------- */
html { background: var(--neon-bg); }

body {
  background: var(--neon-bg);
  color: var(--neon-text-2);
  font-size: 18px;
}

body::before {
  content: "";
  position: fixed;
  inset: -20vmax;
  z-index: -2;
  pointer-events: none;
  background:
    radial-gradient(38vmax 30vmax at 12% 8%, rgba(10, 92, 255, 0.32), transparent 70%),
    radial-gradient(34vmax 28vmax at 92% 22%, rgba(138, 43, 255, 0.26), transparent 70%),
    radial-gradient(40vmax 30vmax at 80% 92%, rgba(0, 212, 255, 0.16), transparent 70%),
    radial-gradient(30vmax 26vmax at 6% 78%, rgba(138, 43, 255, 0.18), transparent 70%);
  animation: neon-drift 28s ease-in-out infinite alternate;
}

body::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 9998;
  pointer-events: none;
  opacity: 0.07;
  mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

@keyframes neon-drift {
  0% { transform: translate3d(0, 0, 0) scale(1); }
  100% { transform: translate3d(-3vmax, 2vmax, 0) scale(1.08); }
}

main, .footer { position: relative; z-index: 1; }

.section-padding, .hero, .final-cta-section { position: relative; }
.section-alt {
  background: linear-gradient(180deg, rgba(11, 18, 48, 0.55) 0%, rgba(11, 18, 48, 0.85) 50%, rgba(11, 18, 48, 0.55) 100%);
  border-top: 1px solid rgba(26, 42, 107, 0.5);
  border-bottom: 1px solid rgba(26, 42, 107, 0.5);
}

/* --------------------------------------------------------------------------
   Типографика: капс, градиент, маркер
   -------------------------------------------------------------------------- */
h1, h2, h3, h4, h5 { color: var(--neon-text); }

h1, h2 {
  text-transform: uppercase;
  font-weight: 800;
  letter-spacing: -0.01em;
}

h1 {
  font-size: clamp(2.3rem, 5.4vw, 4.6rem);
  line-height: 1.02;
}

h2 {
  font-size: clamp(1.7rem, 3.4vw, 2.9rem);
  line-height: 1.08;
}

.grad-text {
  background: var(--grad-primary);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  filter: drop-shadow(0 0 18px rgba(0, 212, 255, 0.35));
}

.marker {
  display: inline-block;
  padding: 0 0.18em;
  margin: 0 -0.04em;
  background: var(--neon-blue);
  color: #fff;
  border-radius: 0.12em;
  box-shadow: var(--glow-blue-soft);
  transform: rotate(-1.5deg);
}

.gold-text {
  color: var(--neon-gold);
  text-shadow: var(--glow-gold);
}

p, li { color: var(--neon-text-2); }
.lead, .hero-lead { color: var(--neon-text-2); font-size: 1.15rem; }

.section-kicker, .hero-kicker {
  color: var(--neon-cyan) !important;
  background: rgba(0, 212, 255, 0.08) !important;
  border: 1px solid rgba(0, 212, 255, 0.35) !important;
  letter-spacing: 0.12em;
  text-shadow: 0 0 12px rgba(0, 212, 255, 0.5);
}
.hero-kicker {
  display: inline-block;
  padding: 6px 12px;
  border-radius: 999px;
}

/* --------------------------------------------------------------------------
   Кнопки: градиент, свечение, эффект нажатия
   -------------------------------------------------------------------------- */
.btn {
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-weight: 800;
  transition: transform 0.15s ease, box-shadow 0.25s ease, filter 0.25s ease;
}

.btn-primary {
  background: var(--grad-primary) !important;
  color: #fff !important;
  border: none !important;
  box-shadow: 0 6px 0 #0640B8, 0 0 40px rgba(10, 92, 255, 0.8);
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
}
.btn-primary:hover {
  filter: brightness(1.1);
  transform: translateY(-2px);
  box-shadow: 0 8px 0 #0640B8, 0 0 56px rgba(0, 212, 255, 0.9);
}
.btn-primary:active {
  transform: translateY(5px);
  box-shadow: 0 1px 0 #0640B8, 0 0 24px rgba(10, 92, 255, 0.8);
}

.btn-secondary {
  background: var(--grad-secondary) !important;
  color: #fff !important;
  border: none !important;
  box-shadow: 0 6px 0 #4A1499, 0 0 28px rgba(138, 43, 255, 0.55);
}
.btn-secondary:hover {
  filter: brightness(1.12);
  transform: translateY(-2px);
  box-shadow: 0 8px 0 #4A1499, 0 0 44px rgba(138, 43, 255, 0.8);
}
.btn-secondary:active {
  transform: translateY(5px);
  box-shadow: 0 1px 0 #4A1499, 0 0 20px rgba(138, 43, 255, 0.6);
}

/* Блик по главной кнопке */
.btn-primary { position: relative; overflow: hidden; }
.btn-primary::after {
  content: "";
  position: absolute;
  top: 0; bottom: 0;
  left: -60%;
  width: 40%;
  background: linear-gradient(100deg, transparent, rgba(255, 255, 255, 0.45), transparent);
  transform: skewX(-20deg);
  animation: btn-shine 3.8s ease-in-out infinite;
  pointer-events: none;
}
@keyframes btn-shine {
  0%, 60% { left: -60%; }
  100% { left: 140%; }
}

/* --------------------------------------------------------------------------
   Шапка
   -------------------------------------------------------------------------- */
.header, .header.scrolled {
  background-color: rgba(5, 7, 15, 0.78) !important;
  border-bottom: 1px solid rgba(26, 42, 107, 0.6);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}
.brand-name { color: #fff; letter-spacing: 0.08em; }
.brand-tag, .nav-link { color: var(--neon-text-2); }
.nav-link:hover { color: var(--neon-cyan); }
.burger-line { background: #fff !important; }
.mobile-menu { background: rgba(5, 7, 15, 0.97) !important; }
.mobile-nav-link { color: #fff !important; border-color: var(--neon-line) !important; }

/* --------------------------------------------------------------------------
   Карточки → игровые карточки
   -------------------------------------------------------------------------- */
.blitz-card, .recognize-card, .compare-card, .system-pillar-card, .experience-card,
.audience-card, .step-card, .review-card, .tier-step-card, .tariff-card, .faq-item,
.game-card-mockup, .networking-callout-card, .guarantee-card, .booking-form-card,
.author-mission-box, .author-stat-item, .tier-why-banner, .faq-ask-box, .game-video-bar,
.author-note-callout, .modal-window, .urgency-timer-bar {
  background: linear-gradient(160deg, rgba(14, 23, 64, 0.95) 0%, rgba(11, 18, 48, 0.95) 100%) !important;
  border: 1px solid var(--neon-line) !important;
  color: var(--neon-text-2);
  box-shadow: var(--shadow-card);
}

/* Уголки как у игральной карты */
.blitz-card, .system-pillar-card, .audience-card, .step-card, .review-card, .tier-step-card, .tariff-card, .recognize-card {
  position: relative;
  transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}
.blitz-card::before, .system-pillar-card::before, .audience-card::before, .step-card::before,
.review-card::before, .tier-step-card::before, .tariff-card::before, .recognize-card::before {
  content: "";
  position: absolute;
  inset: 8px;
  border: 1px dashed rgba(0, 212, 255, 0.14);
  border-radius: inherit;
  pointer-events: none;
}
.blitz-card:hover, .system-pillar-card:hover, .audience-card:hover, .step-card:hover,
.review-card:hover, .tier-step-card:hover, .tariff-card:hover, .recognize-card:hover {
  transform: translateY(-4px) rotate(-0.4deg);
  border-color: rgba(0, 212, 255, 0.55) !important;
  box-shadow: var(--shadow-hover);
}

.blitz-card h3, .step-card h3, .system-pillar-card h3, .audience-card h3, .tier-title, .tariff-name, .compare-title {
  color: #fff;
}

/* Иконки → фишки казино */
.blitz-icon, .pillar-icon-box, .stat-cell-icon, .guarantee-shield-icon {
  position: relative;
  width: 56px !important;
  height: 56px !important;
  border-radius: 50% !important;
  display: grid !important;
  place-items: center;
  color: #fff !important;
  background:
    radial-gradient(circle at 50% 50%, #0A5CFF 0 52%, transparent 53%),
    repeating-conic-gradient(#fff 0 15deg, #0A5CFF 15deg 45deg) !important;
  border: 3px solid #0A5CFF !important;
  box-shadow: 0 0 22px rgba(10, 92, 255, 0.7), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
}
.blitz-icon svg, .pillar-icon-box svg, .stat-cell-icon svg, .guarantee-shield-icon svg {
  stroke: #fff !important;
  position: relative;
  z-index: 1;
}
.system-pillar-card:nth-child(2) .pillar-icon-box,
.blitz-card:nth-child(2) .blitz-icon {
  background:
    radial-gradient(circle at 50% 50%, #8A2BFF 0 52%, transparent 53%),
    repeating-conic-gradient(#fff 0 15deg, #8A2BFF 15deg 45deg) !important;
  border-color: #8A2BFF !important;
  box-shadow: 0 0 22px rgba(138, 43, 255, 0.7);
}
.system-pillar-card:nth-child(1) .pillar-icon-box {
  background:
    radial-gradient(circle at 50% 50%, #E0A800 0 52%, transparent 53%),
    repeating-conic-gradient(#fff 0 15deg, #E0A800 15deg 45deg) !important;
  border-color: #FFC700 !important;
  box-shadow: var(--glow-gold);
}
.stat-cell-val {
  font-size: clamp(0.72rem, 0.95vw, 0.9rem) !important;
  line-height: 1.2;
  overflow-wrap: normal;
  word-break: keep-all;
  hyphens: manual;
}
.mockup-stat-cell { padding-left: 8px !important; padding-right: 8px !important; }
.stat-cell-icon { width: 40px !important; height: 40px !important; border-width: 2px !important; }

/* Номера как грани кубика / фишки */
.recognize-card-num, .step-badge-num, .tier-number-tag {
  font-family: var(--font-accent);
  font-weight: 800;
}
.recognize-card-num {
  color: var(--neon-cyan) !important;
  font-size: 2.4rem !important;
  text-shadow: 0 0 18px rgba(0, 212, 255, 0.6);
}
.step-badge-num {
  width: 56px !important;
  height: 56px !important;
  border-radius: 14px !important;
  font-size: 1.6rem !important;
  color: #fff !important;
  background: var(--grad-primary) !important;
  box-shadow: 0 5px 0 #0640B8, 0 0 26px rgba(10, 92, 255, 0.8) !important;
  transform: rotate(-6deg);
}
.step-card:nth-child(even) .step-badge-num { transform: rotate(5deg); }
.step-card.final-step .step-badge-num {
  background: linear-gradient(135deg, #FFC700, #FF9F00) !important;
  color: #1A1200 !important;
  box-shadow: 0 5px 0 #A06A00, var(--glow-gold) !important;
}
.tier-number-tag {
  color: transparent !important;
  -webkit-text-stroke: 1.5px var(--neon-cyan);
  font-size: 3.4rem !important;
  opacity: 0.9;
}

/* --------------------------------------------------------------------------
   Первый экран
   -------------------------------------------------------------------------- */
.hero {
  padding-top: 120px !important;
  overflow: hidden;
  background: transparent !important;
}
.hero h1 { color: #fff; }

.hero-pill {
  background: rgba(11, 18, 48, 0.85) !important;
  color: var(--neon-text-2) !important;
  border: 1px solid var(--neon-line) !important;
}
.hero-pill.pill-accent {
  background: rgba(10, 92, 255, 0.2) !important;
  color: #fff !important;
  border-color: var(--neon-blue) !important;
  box-shadow: var(--glow-blue-soft);
}
.hero-pill.pill-dark {
  background: rgba(255, 199, 0, 0.12) !important;
  border-color: rgba(255, 199, 0, 0.6) !important;
  color: var(--neon-gold) !important;
  text-shadow: 0 0 10px rgba(255, 199, 0, 0.6);
}

.hero-meta-bar {
  background: rgba(11, 18, 48, 0.8) !important;
  border: 1px solid var(--neon-line) !important;
  color: var(--neon-text-2) !important;
}
.hero-meta-bar strong { color: var(--neon-gold); }

.pulse-indicator { background: var(--neon-gold) !important; box-shadow: 0 0 0 0 rgba(255, 199, 0, 0.7); }

/* Большие цифры как элементы дизайна */
.big-numbers {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin: 28px 0 8px;
}
.big-num {
  position: relative;
  padding: 14px 12px 12px;
  border-radius: 16px;
  background: rgba(11, 18, 48, 0.75);
  border: 1px solid var(--neon-line);
  text-align: left;
}
.big-num b {
  display: block;
  font-family: var(--font-accent);
  font-weight: 800;
  font-size: clamp(1.4rem, 2.4vw, 2.1rem);
  line-height: 1;
  color: var(--neon-cyan);
  text-shadow: 0 0 18px rgba(0, 212, 255, 0.65);
  white-space: nowrap;
}
.big-num span {
  display: block;
  margin-top: 6px;
  font-size: 0.82rem;
  color: var(--neon-text-2);
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.big-num.is-gold b { color: var(--neon-gold); text-shadow: var(--glow-gold); }

/* Таймер до игры */
.countdown {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
  margin: 18px 0 0;
}
.countdown-label {
  font-size: 0.85rem;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--neon-text-2);
}
.countdown-cells { display: flex; gap: 8px; }
.cd-cell {
  min-width: 64px;
  padding: 8px 8px 6px;
  border-radius: 12px;
  text-align: center;
  background: #03050B;
  border: 1px solid rgba(0, 212, 255, 0.35);
  box-shadow: inset 0 0 18px rgba(10, 92, 255, 0.35), 0 0 16px rgba(10, 92, 255, 0.25);
}
.cd-cell b {
  display: block;
  font-family: var(--font-accent);
  font-size: 1.7rem;
  line-height: 1.05;
  color: #fff;
  text-shadow: 0 0 14px rgba(0, 212, 255, 0.9);
  font-variant-numeric: tabular-nums;
}
.cd-cell span { font-size: 0.68rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--neon-text-2); }

/* Фото + макет стола справа */
.hero-live-photo-card {
  border: 1px solid rgba(0, 212, 255, 0.35) !important;
  box-shadow: 0 0 50px rgba(10, 92, 255, 0.45) !important;
  transform: rotate(-1.5deg);
  position: relative;
}
.hero-live-photo-card::after, .author-photo-wrap::after, .guarantee-media::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(160deg, rgba(10, 92, 255, 0.28), rgba(138, 43, 255, 0.18) 60%, rgba(5, 7, 15, 0.35));
  mix-blend-mode: color;
}
.hero-live-photo-card::after { border-radius: inherit; }
.author-photo-wrap, .guarantee-media { position: relative; }

.hero-live-badge-glass, .author-live-badge, .guarantee-img-badge {
  background: rgba(5, 7, 15, 0.75) !important;
  border: 1px solid rgba(0, 212, 255, 0.35) !important;
  z-index: 2;
}
.brand-dot { background: var(--neon-gold) !important; box-shadow: 0 0 10px var(--neon-gold); }

.game-card-mockup {
  transform: rotate(1.2deg);
  box-shadow: 0 0 60px rgba(10, 92, 255, 0.35), var(--shadow-card) !important;
}
.mockup-step-tag { color: var(--neon-cyan) !important; }
.mockup-timer { color: var(--neon-text-2) !important; }
.mockup-stat-cell {
  background: #070B1C !important;
  border: 1px solid var(--neon-line) !important;
}
.stat-cell-name { color: var(--neon-text-2) !important; }
.stat-cell-val { color: #fff !important; }
.stat-cell-val.accent-red { color: var(--neon-gold) !important; text-shadow: var(--glow-gold); }
.mockup-quote-box {
  background: rgba(10, 92, 255, 0.1) !important;
  border-left: 3px solid var(--neon-cyan) !important;
  color: var(--neon-text-2) !important;
}
.mockup-quote-author { color: var(--neon-cyan) !important; }
.mockup-badge-footer { color: var(--neon-text-2) !important; border-color: var(--neon-line) !important; }
.dice-badge {
  background: var(--grad-secondary) !important;
  box-shadow: 0 4px 0 #4A1499, 0 0 20px rgba(138, 43, 255, 0.6);
}
.dice-badge:active { transform: translateY(3px); box-shadow: 0 1px 0 #4A1499; }

/* --------------------------------------------------------------------------
   Секции
   -------------------------------------------------------------------------- */
.recognize-banner {
  background: linear-gradient(120deg, #0A2A9E 0%, #0A5CFF 45%, #6A22D9 100%) !important;
  border: 1px solid rgba(0, 212, 255, 0.45) !important;
  box-shadow: 0 0 60px rgba(10, 92, 255, 0.5) !important;
}
.recognize-banner .btn-primary {
  background: #fff !important;
  color: #0A2A9E !important;
  text-shadow: none;
  box-shadow: 0 6px 0 #7FA4FF, 0 0 30px rgba(255, 255, 255, 0.55);
}

.compare-card.card-traditional { opacity: 0.85; }
.compare-card.card-system {
  border-color: var(--neon-blue) !important;
  box-shadow: 0 0 50px rgba(10, 92, 255, 0.45) !important;
}
.compare-badge { background: rgba(255, 255, 255, 0.06) !important; color: var(--neon-text-2) !important; border-color: var(--neon-line) !important; }
.card-system .compare-badge { background: var(--grad-primary) !important; color: #fff !important; }
.icon-cross { color: var(--neon-error) !important; }
.icon-check { color: var(--neon-success) !important; }
.compare-list li { color: var(--neon-text-2); }
.compare-list strong { color: #fff; }

.system-pillar-card.active-accent {
  border-color: rgba(255, 199, 0, 0.6) !important;
  box-shadow: 0 0 40px rgba(255, 199, 0, 0.25) !important;
}

.author-stat-num, .net-stat-num {
  font-family: var(--font-accent);
  color: var(--neon-cyan) !important;
  text-shadow: 0 0 20px rgba(0, 212, 255, 0.6);
  font-size: clamp(2rem, 3.4vw, 2.8rem) !important;
}
.author-stat-desc, .net-stat-label { color: var(--neon-text-2) !important; }
.author-photo-wrap {
  border: 1px solid rgba(0, 212, 255, 0.35);
  box-shadow: 0 0 60px rgba(10, 92, 255, 0.4);
  overflow: hidden;
}
.author-photo-overlay { z-index: 2; }
.author-name-badge { color: #fff !important; }
.author-role-badge { color: var(--neon-cyan) !important; }
.author-mission-box strong, .author-note-callout strong { color: #fff; }
.experience-card h4 { color: var(--neon-cyan); }

.networking-callout-card {
  background: linear-gradient(120deg, #0B1230 0%, #142070 60%, #2A1170 100%) !important;
  border-color: rgba(138, 43, 255, 0.5) !important;
}

.audience-tag, .tier-pill-status, .ticket-badge-seats, .sbp-icon-tag, .guarantee-perk-tag, .social-badge {
  background: rgba(10, 92, 255, 0.16) !important;
  color: var(--neon-cyan) !important;
  border: 1px solid rgba(0, 212, 255, 0.35) !important;
}
.audience-on-game {
  background: rgba(5, 7, 15, 0.5) !important;
  border-color: var(--neon-line) !important;
}
.audience-on-game strong { color: var(--neon-cyan); }

.steps-timeline::before { background: linear-gradient(180deg, var(--neon-blue), var(--neon-violet)) !important; }

.video-play-btn {
  background: var(--grad-primary) !important;
  box-shadow: var(--glow-blue) !important;
}
.video-bar-title { color: #fff !important; }

.review-quote { color: var(--neon-text-2) !important; }
.review-quote::before { color: var(--neon-blue) !important; }
.review-avatar {
  background: var(--grad-secondary) !important;
  color: #fff !important;
  box-shadow: 0 0 18px rgba(138, 43, 255, 0.6);
}
.review-meta h5 { color: #fff !important; }
.review-meta span { color: var(--ink-muted) !important; }

.tier-step-card.tier-active {
  border-color: var(--neon-blue) !important;
  box-shadow: 0 0 50px rgba(10, 92, 255, 0.5) !important;
}
.tier-active .tier-pill-status { background: var(--grad-primary) !important; color: #fff !important; border: none !important; }
.tier-question-box {
  background: rgba(5, 7, 15, 0.55) !important;
  border-color: var(--neon-line) !important;
}
.tier-question-box p { color: #fff !important; }
.tier-spec-item strong { color: var(--neon-cyan); }

/* Билеты */
.urgency-timer-bar {
  border-color: rgba(255, 199, 0, 0.5) !important;
  box-shadow: 0 0 34px rgba(255, 199, 0, 0.18) !important;
}
.urgency-timer-bar strong { color: var(--neon-gold); text-shadow: var(--glow-gold); }
.timer-countdown {
  color: var(--neon-gold) !important;
  background: #03050B !important;
  text-shadow: var(--glow-gold);
  border: 1px solid rgba(255, 199, 0, 0.5) !important;
}
.tariff-price {
  color: var(--neon-gold) !important;
  text-shadow: var(--glow-gold);
  font-size: clamp(2.6rem, 4.6vw, 3.6rem) !important;
}
.tariff-old-price { color: var(--ink-muted) !important; }
.tariff-discount-pill {
  background: rgba(0, 230, 118, 0.14) !important;
  color: var(--neon-success) !important;
  border: 1px solid rgba(0, 230, 118, 0.4) !important;
}
.tariff-card.featured {
  border: 1px solid var(--neon-blue) !important;
  box-shadow: 0 0 60px rgba(10, 92, 255, 0.55) !important;
}
.tariff-badge-top {
  background: linear-gradient(135deg, #FFC700, #FF9F00) !important;
  color: #1A1200 !important;
  box-shadow: var(--glow-gold);
}
.tariff-features svg { color: var(--neon-cyan) !important; }
.tariff-sub, .pay-methods-badge { color: var(--ink-muted) !important; }
.guarantee-sub { color: var(--neon-cyan) !important; }

/* FAQ */
.faq-item { border-radius: var(--radius-md) !important; margin-bottom: 10px; }
.faq-question-btn { color: #fff !important; background: transparent !important; }
.faq-icon-arrow { color: var(--neon-cyan) !important; }
.faq-answer-content { color: var(--neon-text-2) !important; }

/* Финальный экран */
.final-cta-section {
  background: radial-gradient(70% 90% at 20% 30%, rgba(10, 92, 255, 0.35), transparent 70%),
              radial-gradient(60% 80% at 90% 80%, rgba(138, 43, 255, 0.3), transparent 70%),
              #03050B !important;
  overflow: hidden;
  border-top: 1px solid var(--neon-line);
}
.final-cta-info h2 { font-size: clamp(2rem, 4.4vw, 3.6rem); }
.final-meta-capsule span {
  background: rgba(11, 18, 48, 0.8) !important;
  border-color: var(--neon-line) !important;
}
.final-meta-capsule span:last-child { color: var(--neon-gold) !important; text-shadow: var(--glow-gold); }
.booking-form-card {
  box-shadow: 0 0 70px rgba(10, 92, 255, 0.45) !important;
  border-color: rgba(0, 212, 255, 0.4) !important;
  position: relative;
  z-index: 2;
}
.form-header h3 { color: #fff; }
.form-label { color: var(--neon-text-2) !important; }
.form-label span { color: var(--neon-cyan) !important; }
.form-input, .form-select, .form-textarea {
  background: #070B1C !important;
  border: 1px solid var(--neon-line) !important;
  color: #fff !important;
}
.form-input::placeholder, .form-textarea::placeholder { color: #AEB8E6 !important; }
.form-input:focus, .form-select:focus, .form-textarea:focus {
  background: #0B1230 !important;
  border-color: var(--neon-cyan) !important;
  box-shadow: 0 0 0 3px rgba(0, 212, 255, 0.18) !important;
}
.form-input:invalid:not(:placeholder-shown) { border-color: var(--neon-error) !important; }
.form-select option { background: #0B1230; color: #fff; }
.form-price-total {
  background: rgba(5, 7, 15, 0.6) !important;
  border-color: var(--neon-line) !important;
  color: var(--neon-text-2) !important;
}
.form-price-total strong { color: var(--neon-gold) !important; text-shadow: var(--glow-gold); font-family: var(--font-accent); }
.form-checkbox-label, .form-checkbox-label a { color: var(--neon-text-2) !important; }
.form-checkbox-label a { text-decoration: underline; }
.success-icon { background: rgba(0, 230, 118, 0.15) !important; color: var(--neon-success) !important; }

/* Подвал и плашка на мобиле */
.footer { background: #03050B !important; border-top: 1px solid var(--neon-line); }
.footer-brand p, .footer-contacts p, .footer-bottom, .footer-links a { color: var(--ink-muted) !important; }
.mobile-sticky-bar {
  background: rgba(5, 7, 15, 0.94) !important;
  border-top: 1px solid var(--neon-line) !important;
  backdrop-filter: blur(12px);
}
.mobile-bar-price { color: var(--neon-gold) !important; text-shadow: var(--glow-gold); }
.mobile-bar-seats { color: var(--neon-text-2) !important; }

.modal-overlay { background: rgba(3, 5, 11, 0.8) !important; }
.modal-close-btn { background: rgba(255, 255, 255, 0.06) !important; color: #fff !important; }
.modal-sub { color: var(--neon-text-2) !important; }

/* Повторы CTA между блоками */
.cta-strip {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px 22px;
  flex-wrap: wrap;
  margin-top: 40px;
  text-align: center;
}
.cta-strip-note {
  font-size: 0.95rem;
  color: var(--neon-text-2);
}
.cta-strip-note b { color: var(--neon-gold); text-shadow: var(--glow-gold); }

/* --------------------------------------------------------------------------
   Летающие купюры, монеты, кубики, фишки
   -------------------------------------------------------------------------- */
.fx-field {
  position: absolute;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
  z-index: 0;
}
.fx-global {
  position: fixed;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
  z-index: 0;
}
.hero > .container, .final-cta-section > .container { position: relative; z-index: 1; }

.fx-depth {
  position: absolute;
  inset: 0;
  will-change: transform;
}
.fx-item {
  position: absolute;
  will-change: transform;
  animation: fx-float var(--dur, 18s) ease-in-out var(--delay, 0s) infinite alternate;
}
.fx-item svg { width: 100%; height: 100%; overflow: visible; }
.fx-item.d-far { filter: blur(3px); opacity: 0.35; }
.fx-item.d-mid { filter: blur(1px); opacity: 0.6; }
.fx-item.d-near { opacity: 0.9; }
.fx-global .fx-item { opacity: 0.16; filter: blur(2px); }

@keyframes fx-float {
  0% { transform: translate3d(0, 0, 0) rotate(var(--r0, 0deg)); }
  50% { transform: translate3d(var(--dx, 20px), calc(var(--dy, -30px) * 0.6), 0) rotate(calc(var(--r0, 0deg) + var(--rot, 25deg) * 0.5)); }
  100% { transform: translate3d(calc(var(--dx, 20px) * -0.4), var(--dy, -30px), 0) rotate(calc(var(--r0, 0deg) + var(--rot, 25deg))); }
}

/* --------------------------------------------------------------------------
   Коллаж из фото с игр
   -------------------------------------------------------------------------- */
.collage-section {
  position: relative;
  padding: 72px 0 84px;
  overflow: hidden;
}
.collage-board {
  position: relative;
  height: 1040px;
  max-width: 1360px;
  margin: 0 auto;
  padding: 0 16px;
}
.collage-section .container { position: relative; z-index: 40; }
.collage-section .cta-strip { margin-top: 56px; }
.polaroid {
  position: absolute;
  width: var(--w, 220px);
  padding: 8px 8px 26px;
  background: #F4F6FF;
  border-radius: 6px;
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.6), 0 0 0 1px rgba(255, 255, 255, 0.1);
  transform: rotate(var(--r, 0deg)) translate3d(0, var(--py, 0px), 0);
  transition: transform 0.35s cubic-bezier(.2,.8,.2,1), box-shadow 0.35s ease, z-index 0s;
  will-change: transform;
}
.polaroid img {
  display: block;
  width: 100%;
  aspect-ratio: var(--ar, 4 / 5);
  object-fit: cover;
  border-radius: 2px;
  filter: saturate(1.08) contrast(1.05);
}
.polaroid::after {
  content: "";
  position: absolute;
  left: 8px; right: 8px; top: 8px;
  aspect-ratio: var(--ar, 4 / 5);
  border-radius: 2px;
  background: linear-gradient(160deg, rgba(10, 92, 255, 0.35), rgba(138, 43, 255, 0.25));
  mix-blend-mode: color;
  pointer-events: none;
}
.polaroid:hover {
  z-index: 30 !important;
  transform: rotate(0deg) scale(1.12) translate3d(0, var(--py, 0px), 0);
  box-shadow: 0 26px 60px rgba(0, 0, 0, 0.7), 0 0 50px rgba(10, 92, 255, 0.6);
}

/* Мобильный коллаж: плотная masonry-лента из 10 фото */
@media (max-width: 860px) {
  .collage-section { padding: 52px 0 64px; }
  .collage-board {
    height: auto;
    columns: 2;
    column-gap: 10px;
    padding: 0 12px;
  }
  .polaroid {
    position: relative;
    left: auto !important;
    top: auto !important;
    width: 100%;
    margin: 0 0 12px;
    break-inside: avoid;
    padding: 5px 5px 16px;
    transform: rotate(var(--r, 0deg));
  }
  .polaroid:nth-child(n+11) { display: none; }
  .polaroid:hover { transform: rotate(0deg) scale(1.04); }
}

/* --------------------------------------------------------------------------
   Мобила
   -------------------------------------------------------------------------- */
@media (max-width: 768px) {
  body { font-size: 16px; }
  .hero { padding-top: 96px !important; }
  .big-numbers { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .cd-cell { min-width: 54px; }
  .cd-cell b { font-size: 1.35rem; }
  .hero-live-photo-card, .game-card-mockup { transform: none; }
  body::before { animation: none; }
  .btn-primary::after { display: none; }
}

/* --------------------------------------------------------------------------
   Без анимаций по системной настройке
   -------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  .fx-field, .fx-global { display: none !important; }
  body::before { animation: none !important; }
  .btn-primary::after { display: none; }
  .polaroid { transition: none; }
}

.big-num b .seat-count { font-style: normal; font-size: inherit; letter-spacing: 0; text-transform: none; display: inline; margin: 0; color: inherit; }

.nav-link { white-space: nowrap; }
.header .btn-sm { font-size: 0.8rem; padding-left: 16px; padding-right: 16px; white-space: nowrap; }
@media (max-width: 1240px) { .brand-tag { display: none; } .header-nav { gap: 18px !important; } }

@media (max-width: 768px) {
  h1 { font-size: clamp(2.2rem, 10vw, 2.8rem) !important; }
  .fx-field .fx-item { opacity: 0.32 !important; filter: blur(1.5px); }
}

/* Весь текст белый для читаемости на тёмном фоне */
.final-cta-lead, .footer p, .footer-bottom, .footer-links a, .video-bar-sub, .video-bar-note,
.experience-card p, .author-lead-text, .hero-meta-bar span, .brand-tag, .form-header p,
.guarantee-content p, .tier-why-text p, .faq-ask-text p, .networking-callout-card p {
  color: #FFFFFF !important;
}
.tariff-old-price { opacity: 0.75; }

/* --------------------------------------------------------------------------
   Переносы: слова и числа не рвём
   -------------------------------------------------------------------------- */
h1, h2, h3, h4, .stat-cell-val, .big-num b, .tariff-price, .compare-title {
  word-break: normal !important;
  overflow-wrap: normal !important;
  hyphens: manual;
}

/* Макет стола: три строки «иконка · название · значение» на любой ширине */
.game-mockup-board {
  grid-template-columns: 1fr !important;
  gap: 8px !important;
}
.mockup-stat-cell {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  text-align: left !important;
  padding: 10px 14px !important;
}
.mockup-stat-cell .stat-cell-icon { margin: 0 !important; flex-shrink: 0; }
.mockup-stat-cell .stat-cell-name { margin: 0 !important; flex: 1; font-size: 0.9rem !important; }
.mockup-stat-cell .stat-cell-val {
  font-size: 1rem !important;
  text-align: right;
  white-space: nowrap;
}

/* Карточки в три колонки на планшете: заголовки чуть меньше */
@media (min-width: 640px) and (max-width: 1100px) {
  .blitz-card h3, .system-pillar-card h3, .step-card h3, .tier-title, .audience-card h3 { font-size: 1.1rem !important; }
}

/* Узкие телефоны */
@media (max-width: 360px) {
  h1 { font-size: 2rem !important; }
  h2 { font-size: 1.3rem !important; }
  .compare-title { font-size: 1.05rem !important; }
}

/* --------------------------------------------------------------------------
   Правки форматирования (5 ноября)
   -------------------------------------------------------------------------- */
/* Большие цифры: размер от ширины ячейки, чтобы «2 900 ₽» и «30 лет» всегда влезали */
.big-numbers { container-type: inline-size; width: 100%; }
.big-num { padding: 14px 14px 12px; overflow: hidden; }
.big-num b { font-size: clamp(1rem, 3.5cqi, 2.1rem); }
@media (max-width: 768px) { .big-num b { font-size: clamp(1rem, 7cqi, 2rem); } }
.big-num span { font-size: 0.78rem; }

/* H1 не шире колонки первого экрана */
.hero-content { container-type: inline-size; }
.hero-content h1 { font-size: clamp(1.8rem, 10.5cqi, 4.6rem) !important; }

/* Таймер и плашка под ним: воздух и выравнивание по левому краю */
.countdown { margin: 24px 0 20px; }
.hero-meta-bar { justify-content: flex-start !important; text-align: left !important; }

/* Теги в карточках аудитории отделены от заголовка */
.audience-tag { display: inline-block; margin-bottom: 16px !important; }
.audience-card h3 { margin-top: 0; }

/* Шапка: отступ между меню и кнопкой, компактная кнопка */
.header-container { gap: 28px; }
.header-nav { gap: clamp(14px, 1.6vw, 28px) !important; margin-left: auto; }
.header-actions { margin-left: 8px; flex-shrink: 0; }
.nav-link { font-size: clamp(0.84rem, 0.95vw, 0.95rem) !important; }
.header .btn-sm {
  padding: 10px 18px !important;
  border-radius: 12px !important;
  box-shadow: 0 3px 0 #0640B8, 0 0 22px rgba(10, 92, 255, 0.65) !important;
}
.header .btn-sm:hover { transform: translateY(-1px); box-shadow: 0 4px 0 #0640B8, 0 0 30px rgba(0, 212, 255, 0.8) !important; }
.header .btn-sm:active { transform: translateY(2px); box-shadow: 0 1px 0 #0640B8, 0 0 16px rgba(10, 92, 255, 0.6) !important; }
@media (max-width: 1400px) { .brand-tag { display: none !important; } }

/* --------------------------------------------------------------------------
   «Узнаёте себя»: номер над текстом, шестая ячейка — живое фото с игры
   -------------------------------------------------------------------------- */
.recognize-card {
  flex-direction: column !important;
  gap: 14px !important;
}
.recognize-card-num {
  width: auto !important;
  height: auto !important;
  display: block !important;
  background: none !important;
  border: none !important;
  line-height: 1 !important;
}
.recognize-photo {
  position: relative;
  min-height: 220px;
  border-radius: var(--radius-lg);
  overflow: hidden;
  border: 1px solid rgba(0, 212, 255, 0.4);
  box-shadow: 0 0 40px rgba(10, 92, 255, 0.4);
}
.recognize-photo img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 40%;
  transform: scale(1.04);
  animation: rp-zoom 14s ease-in-out infinite alternate;
}
.recognize-photo::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(160deg, rgba(10, 92, 255, 0.3), rgba(138, 43, 255, 0.2) 55%, rgba(5, 7, 15, 0.45));
  mix-blend-mode: color;
  pointer-events: none;
}
.rp-item {
  position: absolute;
  z-index: 2;
  background-size: contain;
  background-repeat: no-repeat;
  filter: drop-shadow(0 6px 14px rgba(0, 0, 0, 0.55));
}
.rp-dice {
  width: 54px; height: 54px;
  right: 18px; top: 16px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Crect x='3' y='3' width='58' height='58' rx='13' fill='%23fff' stroke='%230A5CFF' stroke-width='3'/%3E%3Cg fill='%230A2A9E'%3E%3Ccircle cx='19' cy='19' r='5'/%3E%3Ccircle cx='45' cy='19' r='5'/%3E%3Ccircle cx='32' cy='32' r='5'/%3E%3Ccircle cx='19' cy='45' r='5'/%3E%3Ccircle cx='45' cy='45' r='5'/%3E%3C/g%3E%3C/svg%3E");
  animation: rp-roll 5s ease-in-out infinite;
}
.rp-chip {
  width: 50px; height: 50px;
  left: 16px; bottom: 18px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Ccircle cx='32' cy='32' r='30' fill='%230A5CFF'/%3E%3Ccircle cx='32' cy='32' r='26.5' fill='none' stroke='%23fff' stroke-width='7' stroke-dasharray='9 14.56'/%3E%3Ccircle cx='32' cy='32' r='19' fill='%230A3BB0' stroke='%2300D4FF' stroke-width='2'/%3E%3C/svg%3E");
  animation: rp-bob 4.5s ease-in-out infinite;
}
.rp-coin {
  width: 42px; height: 42px;
  right: 30%; bottom: 14px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Ccircle cx='32' cy='32' r='30' fill='%23FFC700' stroke='%23FFE680' stroke-width='2'/%3E%3Ctext x='32' y='42' text-anchor='middle' font-family='Arial' font-weight='800' font-size='28' fill='%236B4B00'%3E%E2%82%BD%3C/text%3E%3C/svg%3E");
  filter: drop-shadow(0 0 12px rgba(255, 199, 0, 0.7));
  animation: rp-flip 3.6s ease-in-out infinite;
}
@keyframes rp-zoom { from { transform: scale(1.04); } to { transform: scale(1.14) translate(-1.5%, -1%); } }
@keyframes rp-roll {
  0%, 60%, 100% { transform: rotate(0deg) translateY(0); }
  70% { transform: rotate(120deg) translateY(-14px); }
  80% { transform: rotate(250deg) translateY(0); }
  88% { transform: rotate(340deg) translateY(-5px); }
  94% { transform: rotate(360deg) translateY(0); }
}
@keyframes rp-bob { 0%, 100% { transform: translateY(0) rotate(-8deg); } 50% { transform: translateY(-12px) rotate(10deg); } }
@keyframes rp-flip { 0%, 100% { transform: rotateY(0deg); } 50% { transform: rotateY(180deg) translateY(-8px); } }
@media (max-width: 639px) { .recognize-photo { min-height: 200px; } }
@media (prefers-reduced-motion: reduce) {
  .recognize-photo img, .rp-item { animation: none !important; }
}
