/* LIQUID GLASS EXTRA — покрывает все карточки которые не вошли в liquid-glass-ui.css */

.p-step, .edu-card, .stat-item, .tc-fx, .tc-arch-card, .tc-mob-card, .tc-stat,
.why-compare-card, .avatar-box, .meta-card, .fx-card, .faq-item, .feature {
  position: relative; isolation: isolate; overflow: hidden;
  background:
    linear-gradient(135deg, rgba(255,255,255,0.06) 0%, rgba(255,255,255,0.01) 55%, rgba(255,255,255,0.04) 100%),
    rgba(14,14,28,0.55);
  backdrop-filter: blur(22px) saturate(1.55) brightness(1.05);
  -webkit-backdrop-filter: blur(22px) saturate(1.55) brightness(1.05);
  border: 1px solid rgba(255,255,255,0.12);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.14),
    inset 0 -1px 0 rgba(0,0,0,0.14),
    0 10px 30px rgba(0,0,0,0.22);
  transition: transform 0.35s var(--ease-out-expo), box-shadow 0.35s, border-color 0.35s;
}

.p-step::before, .edu-card::before, .stat-item::before, .tc-fx::before,
.tc-arch-card::before, .tc-mob-card::before, .why-compare-card::before,
.meta-card::before, .fx-card::before, .faq-item::before, .feature::before {
  content: ''; position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
  background: linear-gradient(135deg, rgba(255,255,255,0.14) 0%, transparent 40%);
  opacity: 0.7; z-index: 0;
}

.p-step > *, .edu-card > *, .stat-item > *, .tc-fx > *, .tc-arch-card > *,
.tc-mob-card > *, .why-compare-card > *, .meta-card > *, .fx-card > *,
.faq-item > *, .feature > * { position: relative; z-index: 1; }

.p-step:hover, .edu-card:hover, .tc-fx:hover, .tc-arch-card:hover,
.why-compare-card:hover, .meta-card:hover, .fx-card:hover, .faq-item:hover, .feature:hover {
  transform: translateY(-3px);
  border-color: rgba(0,229,255,0.28);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.18),
    inset 0 -1px 0 rgba(0,0,0,0.14),
    0 18px 42px rgba(0,229,255,0.12),
    0 10px 30px rgba(0,0,0,0.3);
}

/* Полноширинные контейнеры — БЕЗ backdrop-filter (иначе размытая полоса через весь экран) */
.tc-stats-strip, .cta-g-item {
  position: relative;
  background: linear-gradient(135deg, rgba(255,255,255,0.04), rgba(14,14,28,0.35));
  border: 1px solid rgba(255,255,255,0.08);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.08), 0 6px 20px rgba(0,0,0,0.15);
}

/* stat-n pulse внутри stat-item — сохраняем уже существующий стиль текста */
.stat-item { padding: 18px 14px; border-radius: 14px; }

/* Fallback без backdrop-filter (Firefox old / no-glass) */
.no-glass .p-step, .no-glass .edu-card, .no-glass .stat-item, .no-glass .tc-fx,
.no-glass .tc-arch-card, .no-glass .tc-mob-card, .no-glass .why-compare-card,
.no-glass .meta-card, .no-glass .fx-card, .no-glass .faq-item, .no-glass .feature,
.no-glass .tc-stats-strip, .no-glass .cta-g-item {
  backdrop-filter: none; -webkit-backdrop-filter: none;
  background: rgba(14,14,28,0.8);
}

/* LOW tier — упрощаем blur для слабых устройств */
.perf-low .p-step, .perf-low .edu-card, .perf-low .stat-item, .perf-low .tc-fx,
.perf-low .tc-arch-card, .perf-low .tc-mob-card, .perf-low .why-compare-card,
.perf-low .meta-card, .perf-low .fx-card, .perf-low .faq-item, .perf-low .feature {
  backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
}

@media (prefers-reduced-motion: reduce) {
  .p-step, .edu-card, .stat-item, .tc-fx, .tc-arch-card, .tc-mob-card,
  .why-compare-card, .meta-card, .fx-card, .faq-item, .feature { transition: none; }
}
