/* File: /static/css/landing-bg.css */
:root{
  --glow-a:#9a68ff;
  --glow-b:#ff4dd8;
  --soft-bg:#f7f9ff;
}
[data-bs-theme="dark"]{ --soft-bg:#0f1220; }

body{ background:var(--soft-bg); }

/* Фон как у TrueStats — мягкие градиенты + SVG-свечения */
.landing-bg{
  position:fixed; inset:0; pointer-events:none; z-index:0; overflow:hidden;
  background:
    radial-gradient(65vw 40vh at 10% -10%, rgba(122,162,255,.22), rgba(122,162,255,0) 60%),
    radial-gradient(50vw 45vh at 95% 10%, rgba(255,77,216,.18), rgba(255,77,216,0) 60%),
    radial-gradient(80vw 60vh at 50% 110%, rgba(122,162,255,.12), rgba(122,162,255,0) 70%);
}
.glow{ position:absolute; transform:translateZ(0); mix-blend-mode:screen; will-change:transform }
.glow-a{ top:-120px; left:-60px }
.glow-b{ right:-120px; top:160px }
.soft-wave{ position:absolute; top:0; left:0; right:0; opacity:.7 }

/* Совместимость с твоим hero */
.hero-video{ position:relative; z-index:1 }
.hero-video__overlay{
  position:absolute; inset:0;
  background:
    radial-gradient(1200px 600px at 20% -10%, rgba(154,104,255,.35), rgba(154,104,255,0) 60%),
    radial-gradient(900px 500px at 95% 10%, rgba(255,77,216,.28), rgba(255,77,216,0) 60%),
    radial-gradient(60% 60% at 50% 110%, rgba(0,0,0,.35), rgba(0,0,0,0) 70%);
}

/* Акцентный градиентный текст */
.brand-grad{
  -webkit-text-fill-color:transparent;
  background-clip:text; -webkit-background-clip:text;
  white-space:nowrap;
}
.brand-grad.wb{ background-image:linear-gradient(90deg,#7b2cff,#4aa3ff) }

/* Декоративная «волна» над секциями (опционально добавляй класс к секции) */
.section-wave-top{ position:relative; isolation:isolate }
.section-wave-top::before{
  content:""; position:absolute; inset:-60px 0 auto 0; height:160px; z-index:-1;
  background:radial-gradient(50% 100% at 50% 0%, rgba(122,162,255,.18), rgba(122,162,255,0) 70%);
  mask-image:linear-gradient(to bottom, #000, transparent);
}

@media (prefers-reduced-motion: reduce){ .glow{ transition:none!important } }