/* ═══════════════════════════════════════════════════════════════════════
 * E24 BALTIC — Premium Brand Style
 * Палитра: #D90B1C (primary), #BF0A19 (dark), #730303 (deep), #F2F2F2 (light)
 * Применяется поверх dark-темы публичного сайта + админки.
 * ═══════════════════════════════════════════════════════════════════════ */

:root {
  --e24-red:        #D90B1C;
  --e24-red-light:  #F23545;
  --e24-red-dark:   #BF0A19;
  --e24-red-deep:   #730303;
  --e24-gray-1:     #F2F2F2;
  --e24-gray-2:     #595959;
  --e24-glow:       rgba(217, 11, 28, .45);
  --e24-glow-soft:  rgba(217, 11, 28, .15);
}

/* ── Премиум типографика ──────────────────────────────────────────── */
.gradient-text {
  background: linear-gradient(135deg, var(--e24-red) 0%, var(--e24-red-light) 50%, #ff8a92 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  font-weight: 800;
  letter-spacing: -0.01em;
}

h1, h2, h3, h4, h5, .hero h1, .section-title h2 {
  font-family: 'Inter', system-ui, sans-serif;
  font-weight: 800;
  letter-spacing: -0.015em;
}
h1, .hero h1 { letter-spacing: -0.025em; }
.section-title h2 { letter-spacing: -0.02em; }

.brand-logo {
  font-weight: 800;
  letter-spacing: -0.01em;
}

/* ── Объёмные премиум-кнопки ──────────────────────────────────────── */
.btn-buy {
  background: linear-gradient(180deg, var(--e24-red) 0%, var(--e24-red-dark) 100%) !important;
  border: 1px solid var(--e24-red-dark) !important;
  color: #ffffff !important;
  font-weight: 700 !important;
  letter-spacing: .02em;
  padding: .7rem 1.5rem !important;
  border-radius: 10px !important;
  text-transform: none;
  box-shadow:
    0 4px 14px rgba(217, 11, 28, .35),
    inset 0 1px 0 rgba(255, 255, 255, .22),
    inset 0 -1px 0 rgba(115, 3, 3, .35) !important;
  transition: transform .15s ease, box-shadow .2s ease, background .2s ease !important;
  position: relative;
}
.btn-buy:hover {
  background: linear-gradient(180deg, var(--e24-red-light) 0%, var(--e24-red) 100%) !important;
  color: #ffffff !important;
  transform: translateY(-2px) !important;
  box-shadow:
    0 8px 24px rgba(217, 11, 28, .55),
    inset 0 1px 0 rgba(255, 255, 255, .3),
    inset 0 -1px 0 rgba(115, 3, 3, .4) !important;
}
.btn-buy:active {
  transform: translateY(0) !important;
  box-shadow:
    0 2px 8px rgba(217, 11, 28, .35),
    inset 0 2px 4px rgba(0, 0, 0, .15) !important;
}
.btn-buy.btn-lg {
  padding: .95rem 2rem !important;
  font-size: 1rem !important;
  border-radius: 12px !important;
}

/* outline-light кнопки — стильный hover в брендовом цвете */
.btn-outline-light:hover {
  background: rgba(217, 11, 28, .1) !important;
  border-color: var(--e24-red) !important;
  color: var(--e24-red-light) !important;
}

/* ── Карточки с премиум-обводкой ──────────────────────────────────── */
.feature {
  position: relative;
  background: linear-gradient(180deg, rgba(22, 27, 34, .65) 0%, rgba(13, 17, 23, .85) 100%) !important;
  border: 1px solid rgba(255, 255, 255, .07) !important;
  transition: all .25s ease !important;
}
.feature:hover {
  border-color: var(--e24-red) !important;
  transform: translateY(-3px) !important;
  box-shadow:
    0 14px 32px rgba(217, 11, 28, .18),
    0 0 0 1px var(--e24-glow-soft) !important;
}
.feature .ic {
  background: linear-gradient(135deg, var(--e24-red) 0%, var(--e24-red-dark) 100%) !important;
  color: #ffffff !important;
  box-shadow:
    0 6px 14px rgba(217, 11, 28, .35),
    inset 0 1px 0 rgba(255, 255, 255, .2);
}

.price-card.featured {
  border-color: var(--e24-red) !important;
  background: linear-gradient(180deg, rgba(217, 11, 28, .12) 0%, rgba(22, 27, 34, .8) 100%) !important;
  box-shadow:
    0 14px 40px rgba(217, 11, 28, .2),
    0 0 0 1px var(--e24-glow-soft);
}
/* Position relative + visible overflow чтобы золотой бейдж не обрезался сверху. */
.price-card.lifetime {
  border: 2px solid #FFD700 !important;
  background: linear-gradient(180deg, rgba(255, 215, 0, .08) 0%, rgba(22, 27, 34, .9) 100%) !important;
  box-shadow:
    0 14px 40px rgba(255, 215, 0, .18),
    0 0 0 1px rgba(255, 215, 0, .25);
  position: relative;
  overflow: visible;
}
.price-card.featured { overflow: visible; position: relative; }
.price-card.lifetime .price {
  background: linear-gradient(135deg, #FFD700 0%, #FFA500 100%);
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
}
.price-card.lifetime ul li::before { color: #FFD700 !important; }
.price-card .best-badge { z-index: 10; }
.price-card .best-badge.lifetime-badge {
  background: linear-gradient(135deg, #FFD700 0%, #FFA500 50%, #FF6F00 100%) !important;
  color: #1a0e00 !important;
  box-shadow: 0 4px 14px rgba(255, 165, 0, .55) !important;
  font-weight: 800;
  z-index: 10;
}
.price-card .best-badge {
  background: linear-gradient(135deg, var(--e24-red-light) 0%, var(--e24-red) 100%) !important;
  color: #ffffff !important;
  box-shadow: 0 4px 12px rgba(217, 11, 28, .45) !important;
}
.price-card .price {
  background: linear-gradient(135deg, var(--e24-red) 0%, var(--e24-red-light) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
/* Чек-марки в pricing — зелёные (привычный знак подтверждения). */
.price-card ul li::before {
  color: #3fb950 !important;
  font-weight: 800;
}
.price-card.lifetime ul li::before { color: #FFD700 !important; }

.card-info {
  background: linear-gradient(180deg, rgba(22, 27, 34, .7) 0%, rgba(13, 17, 23, .85) 100%) !important;
  border: 1px solid rgba(255, 255, 255, .07) !important;
  border-radius: 12px !important;
}

/* ── Hero акценты ─────────────────────────────────────────────────── */
/* Hero-градиент с гарантированным контрастом: чистый белый текст с тонкой подсветкой. */
.hero .gradient-text {
  background: none !important;
  -webkit-background-clip: initial !important;
  background-clip: initial !important;
  -webkit-text-fill-color: #ffffff !important;
  color: #ffffff !important;
  text-shadow: 0 2px 18px rgba(255, 255, 255, .25), 0 0 24px rgba(255, 138, 146, .35);
  font-weight: 900;
}
.gradient-bg { background: radial-gradient(ellipse at top, rgba(115, 3, 3, .35) 0%, #0d1117 60%) !important; }

/* ── Top navbar — премиум ─────────────────────────────────────────── */
.topbar-pub {
  background: linear-gradient(180deg, rgba(13, 17, 23, .92) 0%, rgba(13, 17, 23, .85) 100%) !important;
  border-bottom: 1px solid rgba(217, 11, 28, .18) !important;
  box-shadow: 0 2px 24px rgba(0, 0, 0, .35);
}
.topbar-pub .nav-link {
  white-space: nowrap !important;
  font-weight: 500;
}
.topbar-pub .nav-link:hover,
.topbar-pub .nav-link.active {
  background: rgba(217, 11, 28, .1) !important;
  color: var(--e24-red-light) !important;
}
.topbar-social a:hover {
  color: var(--e24-red-light) !important;
  background: rgba(217, 11, 28, .1) !important;
}

/* Бренд-лого: SVG, без отдельной иконки */
.brand-logo img {
  height: 36px;
  width: auto;
  display: block;
  filter: drop-shadow(0 2px 8px rgba(217, 11, 28, .35));
}

/* ── Compare table — премиум ──────────────────────────────────────── */
.compare-table .yes { color: #3fb950 !important; }
.compare-table th  { background: rgba(217, 11, 28, .08) !important; }

/* ── Текстовые акценты ───────────────────────────────────────────── */
.text-primary, .ph-bold.text-primary, .btn-link.text-primary {
  color: var(--e24-red-light) !important;
}
a:not(.btn):not(.nav-link):not(.dropdown-item):not(.brand-logo):hover {
  color: var(--e24-red-light) !important;
}

/* ── Контент CMS-страниц ─────────────────────────────────────────── */
.page-content a:not(.btn) {
  color: var(--e24-red-light) !important;
}
.page-content a:not(.btn):hover {
  color: var(--e24-red) !important;
}

/* ── Бейджи ──────────────────────────────────────────────────────── */
.bg-primary { background: linear-gradient(135deg, var(--e24-red) 0%, var(--e24-red-dark) 100%) !important; }

/* ── Скроллбары — тонкая красная подсветка ───────────────────────── */
* { scrollbar-color: var(--e24-red-dark) #0d1117; scrollbar-width: thin; }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: #0d1117; }
::-webkit-scrollbar-thumb { background: var(--e24-red-dark); border-radius: 6px; border: 2px solid #0d1117; }
::-webkit-scrollbar-thumb:hover { background: var(--e24-red); }