/* LIQUID GLASS UI — nav, cta-badge-top, fmt-btn, foot-social
   Базовые стили → liquid-glass.css
   ─────────────────────────────────────────────────────────── */

/* CTA top badge */
.cta-badge-top {
  background: rgba(8,8,15,0.38) !important;
  backdrop-filter: blur(24px) saturate(1.7); -webkit-backdrop-filter: blur(24px) saturate(1.7);
  border: 1px solid rgba(0,229,255,0.18) !important;
  box-shadow: 0 4px 24px rgba(0,0,0,0.3),
    inset 0 1px 0 rgba(255,255,255,0.22), inset 0 -1px 0 rgba(0,0,0,0.16);
  position: relative; overflow: hidden;
}
.cta-badge-top::before {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(140deg, rgba(0,229,255,0.1) 0%, rgba(124,111,255,0.05) 50%, transparent 70%);
  pointer-events: none; z-index: 1; border-radius: inherit;
}

/* Messenger selector buttons */
.fmt-btn {
  background: rgba(10,10,20,0.28) !important;
  backdrop-filter: blur(20px) saturate(1.5); -webkit-backdrop-filter: blur(20px) saturate(1.5);
  border: 1px solid rgba(255,255,255,0.09) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.12), inset 0 -1px 0 rgba(0,0,0,0.10);
  position: relative; overflow: hidden; transition: all 0.3s;
}
.fmt-btn::before {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(150deg, rgba(255,255,255,0.07) 0%, transparent 55%);
  pointer-events: none; z-index: 1; border-radius: inherit;
}
.fmt-btn.fmt-active {
  background: rgba(0,229,255,0.12) !important;
  border-color: rgba(0,229,255,0.30) !important;
  box-shadow: 0 0 16px rgba(0,229,255,0.08),
    inset 0 1px 0 rgba(0,229,255,0.25), inset 0 -1px 0 rgba(0,0,0,0.12);
}
.fmt-btn.fmt-active::before {
  background: linear-gradient(150deg, rgba(0,229,255,0.12) 0%, transparent 55%);
}

/* Footer social icons */
.foot-social {
  background: rgba(10,10,20,0.30) !important;
  backdrop-filter: blur(20px) saturate(1.6); -webkit-backdrop-filter: blur(20px) saturate(1.6);
  border: 1px solid rgba(255,255,255,0.10) !important;
  box-shadow: 0 2px 16px rgba(0,0,0,0.2),
    inset 0 1px 0 rgba(255,255,255,0.16), inset 0 -1px 0 rgba(0,0,0,0.12);
  position: relative; overflow: hidden;
}
.foot-social::before {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(150deg, rgba(255,255,255,0.10) 0%, transparent 55%);
  pointer-events: none; z-index: 1; border-radius: inherit;
}
.foot-social:hover {
  box-shadow: 0 4px 24px rgba(0,0,0,0.3),
    inset 0 1px 0 rgba(255,255,255,0.22), inset 0 -1px 0 rgba(0,0,0,0.12),
    0 0 20px rgba(0,229,255,0.10) !important;
}

/* Nav — liquid glass при скролле */
nav.scrolled {
  background: rgba(4,4,10,0.42) !important;
  backdrop-filter: blur(40px) saturate(1.9) brightness(1.06) !important;
  -webkit-backdrop-filter: blur(40px) saturate(1.9) brightness(1.06) !important;
  border-bottom: 1px solid rgba(255,255,255,0.09) !important;
  box-shadow: 0 1px 0 rgba(255,255,255,0.06),
    0 8px 32px rgba(0,0,0,0.3),
    inset 0 1px 0 rgba(255,255,255,0.08);
}

/* ── Производительность ──────────────────────────────────── */
.perf-low .hero-micro-badge, .perf-low .s-tag, .perf-low .kpi-chip,
.perf-low .exp-pill, .perf-low .pdb-pill, .perf-low .cta-badge-top,
.perf-low .fmt-btn, .perf-low .foot-social {
  backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
  background: rgba(14,14,28,0.85) !important;
}
.is-touch .hero-micro-badge, .is-touch .s-tag,
.is-touch .kpi-chip, .is-touch .exp-pill, .is-touch .pdb-pill {
  backdrop-filter: blur(12px) !important; -webkit-backdrop-filter: blur(12px) !important;
}
@media (prefers-reduced-motion: reduce) {
  .hero-micro-badge::before, .s-tag::before, .kpi-chip::before,
  .exp-pill::before, .pdb-pill::before, .cta-badge-top::before,
  .fmt-btn::before, .foot-social::before { display: none; }
}