/* ============================================================
   ПЕРЕМЕННЫЕ
   ============================================================ */
:root{
  --bg:#07040f;
  --bg-2:#120726;
  --accent:#a855f7;
  --accent-2:#c084fc;
  --text:#f0e6ff;
  --muted:#a89cc0;
}


/* ============================================================
   БАЗА
   ============================================================ */
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}

body{
  font-family:'Inter','Segoe UI',system-ui,sans-serif;
  background:var(--bg);
  color:var(--text);
  overflow-x:hidden;
  line-height:1.6;
}

body::before{
  content:'';
  position:fixed;inset:0;
  background:
    radial-gradient(circle at 20% 20%, rgba(168,85,247,.18), transparent 45%),
    radial-gradient(circle at 80% 70%, rgba(192,132,252,.12), transparent 50%),
    linear-gradient(135deg,#07040f 0%,#120726 50%,#0a0518 100%);
  z-index:-2;
}

#scene{
  position:fixed;inset:0;
  z-index:-1;
  pointer-events:none;
}


/* ============================================================
   ОБЩИЕ СЕКЦИИ
   ============================================================ */
section{padding:120px 6vw;position:relative}

.section-title{
  font-size:clamp(1.8rem,3.4vw,2.8rem);
  font-weight:700;
  margin-bottom:16px;
}

.section-subtitle{
  color:var(--muted);
  max-width:600px;
  margin-bottom:60px;
}


/* ============================================================
   КНОПКИ
   ============================================================ */
.btn{
  padding:16px 34px;
  border-radius:14px;
  font-size:1rem;
  font-weight:600;
  cursor:pointer;
  text-decoration:none;
  display:inline-block;
  transition:transform .25s, box-shadow .25s, border-color .25s, background .25s;
  border:none;
  font-family:inherit;
}

.btn-primary{
  background:linear-gradient(135deg,#a855f7,#7c3aed);
  color:#fff;
  box-shadow:0 0 40px rgba(168,85,247,.5);
}
.btn-primary:hover{
  transform:translateY(-3px);
  box-shadow:0 0 60px rgba(168,85,247,.8);
}

.btn-ghost{
  background:transparent;
  color:var(--text);
  border:1px solid rgba(168,85,247,.4);
}
.btn-ghost:hover{
  border-color:var(--accent);
  background:rgba(168,85,247,.08);
}


/* ============================================================
   ПОЯВЛЕНИЕ ПРИ СКРОЛЛЕ
   ============================================================ */
.appear{
  opacity:0;
  transform:translateY(40px);
}