

  function initMetaspheres() {
    const canvas = document.createElement("canvas");
    const ctx = canvas.getContext("2d");
    document.getElementById("bg").appendChild(canvas);

    canvas.width = window.innerWidth;
    canvas.height = window.innerHeight;

    class Sphere {
      constructor() {
        this.reset();
      }
      reset() {
        this.x = Math.random() * canvas.width;
        this.y = Math.random() * canvas.height;
        this.dx = (Math.random() - 0.5) * 0.6;
        this.dy = (Math.random() - 0.5) * 0.6;
        this.r = 120 + Math.random() * 80;
        this.alpha = 0;
        this.fadeIn = true;
      }
      move() {
        this.x += this.dx;
        this.y += this.dy;
        if (this.x < -this.r || this.x > canvas.width + this.r) this.dx *= -1;
        if (this.y < -this.r || this.y > canvas.height + this.r) this.dy *= -1;

        // эффект "дыхания"
        if (this.fadeIn) {
          this.alpha += 0.005;
          if (this.alpha >= 0.8) this.fadeIn = false;
        } else {
          this.alpha -= 0.002;
          if (this.alpha  {
      canvas.width = window.innerWidth;
      canvas.height = window.innerHeight;
    });
  }

  // Запуск фона только на экранах 1200–1920 px
  if (window.innerWidth >= 1200 && window.innerWidth 