bugfix: add particles.js and license.html. Minimal redesign

news.css

 .news-section {
-  padding: 50px 20px;
+  padding: 80px 20px 50px;
   background: transparent;
-  background-size: 400% 400%;
+  min-height: 100vh;
 }
 
 .news-container {
-  max-width: 800px;
+  max-width: 900px;
   margin: 0 auto;
   text-align: center;
 }
 
 .styled-title {
   font-size: 48px;
-  margin-bottom: 40px;
+  margin-bottom: 50px;
   color: #fff;
+  background: linear-gradient(45deg, #fff 30%, #b79ced 100%);
+  -webkit-background-clip: text;
+  -webkit-text-fill-color: transparent;
+  text-shadow: 0 2px 4px rgba(126, 1, 255, 0.3);
+  position: relative;
+  display: inline-block;
+}
+
+.styled-title::after {
+  content: '';
+  position: absolute;
+  bottom: -15px;
+  left: 50%;
+  transform: translateX(-50%);
+  width: 100px;
+  height: 3px;
+  background: linear-gradient(90deg, #7E01FF, #b79ced);
+  border-radius: 3px;
 }
 
 .news-block {
-  background: var(--bg);
+  background: rgba(11, 14, 29, 0.8);
   border: 2px solid var(--border);
   border-radius: 15px;
   color: #fff;
@@ -26,44 +44,163 @@
   text-align: left;
   position: relative;
   overflow: hidden;
+  backdrop-filter: blur(10px);
+  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
+  transition: all 0.3s ease;
+  opacity: 0;
+  transform: translateY(20px);
 }
 
+.news-block.visible {
+  opacity: 1;
+  transform: translateY(0);
+}
+
+
 .news-content {
-  padding: 20px;
+  padding: 30px;
 }
 
 .news-image {
   width: 100%;
   height: auto;
-  border-radius: 10px 10px 0 0;
+  border-radius: 13px 13px 0 0;
   margin-bottom: 0;
 }
 
 .news-content h3 {
-  font-size: 24px;
-  margin: 20px 0 10px;
+  font-size: 28px;
+  margin: 25px 0 10px;
+  background: linear-gradient(45deg, #fff 30%, #b79ced 100%);
+  -webkit-background-clip: text;
+  -webkit-text-fill-color: transparent;
 }
 
 .news-date {
   font-size: 14px;
-  color: #ddd;
-  margin-bottom: 10px;
+  color: #b79ced;
+  margin-bottom: 20px;
   display: block;
+  font-style: italic;
+}
+
+.news-content p {
+  line-height: 1.7;
+  margin-bottom: 18px;
+  font-size: 16px;
+}
+
+.news-content b {
+  color: #b79ced;
+  font-weight: 600;
+}
+
+/* Стили для ссылок в новостях */
+.news-content a {
+  color: #b79ced;
+  text-decoration: none;
+  transition: all 0.3s ease;
+  position: relative;
+  font-weight: 500;
+  padding: 0 2px;
+}
+
+.news-content a:hover {
+  color: #fff;
+  text-decoration: none;
+  background: rgba(126, 1, 255, 0.2);
+  border-radius: 3px;
+}
+
+.news-content a::after {
+  content: '';
+  position: absolute;
+  width: 100%;
+  height: 1px;
+  bottom: -2px;
+  left: 0;
+  background: linear-gradient(90deg, #7E01FF, #b79ced);
+  transform: scaleX(0);
+  transform-origin: bottom right;
+  transition: transform 0.3s ease;
+}
+
+.news-content a:hover::after {
+  transform: scaleX(1);
+  transform-origin: bottom left;
+}
+
+/* Стили для видео */
+.news-content iframe {
+  border-radius: 10px;
+  margin: 20px 0;
+  border: 2px solid var(--border);
+  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
+}
+
+/* Стили для списков в новостях */
+.news-content ul {
+  margin: 15px 0;
+  padding-left: 20px;
 }
 
-/* Медиа-запросы для блоков новостей для мобильных устройств */
+.news-content li {
+  margin-bottom: 10px;
+  line-height: 1.5;
+}
+
+/* Медиа-запросы для мобильных устройств */
 @media (max-width: 768px) {
+  .news-section {
+    padding: 70px 15px 30px;
+  }
+
+  .styled-title {
+    font-size: 36px;
+    margin-bottom: 40px;
+  }
+
   .news-block {
-    padding: 10px;
+    padding: 0;
+    margin-bottom: 40px;
+  }
+
+  .news-content {
+    padding: 20px;
   }
 
   .news-date {
     font-size: 12px;
-    top: 10px;
-    left: 10px;
   }
 
-  .news-image {
-    margin-bottom: 10px;
+  .news-content h3 {
+    font-size: 22px;
+  }
+
+  .news-content p {
+    font-size: 15px;
+    line-height: 1.6;
+  }
+
+  .news-content iframe {
+    height: 250px;
+  }
+}
+
+@media (max-width: 480px) {
+  .styled-title {
+    font-size: 28px;
+  }
+
+  .news-content h3 {
+    font-size: 20px;
+  }
+
+  .news-content {
+    padding: 15px;
+  }
+
+  .news-content iframe {
+    height: 200px;
   }
 }

script.js

-$(document).ready(function(){
-  // Обработчик кнопки "Узнать больше"
-  $('#next-section').click(function(){
-    // Плавная прокрутка к следующему блоку
+$(document).ready(function() {
+  $('#next-section').click(function() {
+    const target = $('#blocks-text');
+    const windowHeight = $(window).height();
+    const offset = target.offset().top - (windowHeight * 0.1); // Смещение на 10% вверх
+
     $('html, body').animate({
-      scrollTop: $('#blocks-text').offset().top
-    }, 1500); //Время в секундах (можно поигарться)
+      scrollTop: offset
+    }, 1500);
   });
 });
 
-// Ждем загрузки DOM
-document.addEventListener("DOMContentLoaded", function () {
-  const container = document.querySelector(".circle-container");
-  const circles = Array.from(document.querySelectorAll(".circle"));
-
-  // Для каждого шарика создаём объект с физическими данными:
-  // Скорость будет постоянной, а направление определяется случайно
-  const constantSpeed = 100; // px/с
-  let circlesData = circles.map(el => {
-    const style = window.getComputedStyle(el);
-    let x = parseFloat(style.left);
-    let y = parseFloat(style.top);
-    let radius = el.offsetWidth / 2;
-    // Случайное направление
-    const angle = Math.random() * 2 * Math.PI;
-    let vx = Math.cos(angle) * constantSpeed;
-    let vy = Math.sin(angle) * constantSpeed;
-    // прозрачность
-  el.style.opacity = 0.35;
-    return { el, x, y, vx, vy, radius };
-  });
-
-  let lastTime = performance.now();
-
-  function animate(time) {
-    const dt = (time - lastTime) / 1000; // время в секундах
-    lastTime = time;
-    const containerWidth = container.clientWidth;
-    const containerHeight = container.clientHeight;
-
-    circlesData.forEach(circle => {
-      // Обновляем координаты с постоянной скоростью
-      circle.x += circle.vx * dt;
-      circle.y += circle.vy * dt;
-
-      // Столкновение с левой/правой границей – отражение по оси X
-      if (circle.x < 0) {
-        circle.x = 0;
-        circle.vx = Math.abs(circle.vx);
-      } else if (circle.x + circle.el.offsetWidth > containerWidth) {
-        circle.x = containerWidth - circle.el.offsetWidth;
-        circle.vx = -Math.abs(circle.vx);
+// Инициализация Particles.js
+document.addEventListener('DOMContentLoaded', function() {
+  // Инициализируем частицы только в блоке hero-section
+  particlesJS('particles-js', {
+    particles: {
+      number: {
+        value: 80,
+        density: {
+          enable: true,
+          value_area: 800
+        }
+      },
+      color: {
+        value: "#ffffff"
+      },
+      shape: {
+        type: "circle",
+        stroke: {
+          width: 0,
+          color: "#000000"
+        }
+      },
+      opacity: {
+        value: 0.5,
+        random: false,
+        anim: {
+          enable: false,
+          speed: 1,
+          opacity_min: 0.1,
+          sync: false
+        }
+      },
+      size: {
+        value: 3,
+        random: true,
+        anim: {
+          enable: false,
+          speed: 40,
+          size_min: 0.1,
+          sync: false
+        }
+      },
+      line_linked: {
+        enable: true,
+        distance: 150,
+        color: "#ffffff",
+        opacity: 0.4,
+        width: 1
+      },
+      move: {
+        enable: true,
+        speed: 6,
+        direction: "none",
+        random: false,
+        straight: false,
+        out_mode: "out",
+        bounce: false,
+        attract: {
+          enable: false,
+          rotateX: 600,
+          rotateY: 1200
+        }
       }
-      // Столкновение с верхней/нижней границей – отражение по оси Y
-      if (circle.y < 0) {
-        circle.y = 0;
-        circle.vy = Math.abs(circle.vy);
-      } else if (circle.y + circle.el.offsetHeight > containerHeight) {
-        circle.y = containerHeight - circle.el.offsetHeight;
-        circle.vy = -Math.abs(circle.vy);
+    },
+    interactivity: {
+      detect_on: "canvas",
+      events: {
+        onhover: {
+          enable: true,
+          mode: "grab"
+        },
+        onclick: {
+          enable: true,
+          mode: "push"
+        },
+        resize: true
+      },
+      modes: {
+        grab: {
+          distance: 140,
+          line_linked: {
+            opacity: 1
+          }
+        },
+        bubble: {
+          distance: 400,
+          size: 40,
+          duration: 2,
+          opacity: 8,
+          speed: 3
+        },
+        repulse: {
+          distance: 200,
+          duration: 0.4
+        },
+        push: {
+          particles_nb: 4
+        },
+        remove: {
+          particles_nb: 2
+        }
       }
-
-      // Обновляем позицию элемента
-      circle.el.style.left = circle.x + "px";
-      circle.el.style.top = circle.y + "px";
-    });
-
-    requestAnimationFrame(animate);
-  }
-
-  requestAnimationFrame(animate);
+    },
+    retina_detect: true
+  });
 });
 
 $(document).ready(function () {
@@ -83,3 +129,20 @@ $(document).ready(function () {
     }
   });
 });
+
+// Анимация появления новостных блоков при прокрутке
+  const newsBlocks = document.querySelectorAll('.news-block');
+
+  const observer = new IntersectionObserver((entries) => {
+    entries.forEach(entry => {
+      if (entry.isIntersecting) {
+        setTimeout(() => {
+          entry.target.classList.add('visible');
+        }, 100 * Array.from(newsBlocks).indexOf(entry.target));
+      }
+    });
+  }, { threshold: 0.1 });
+
+  newsBlocks.forEach(block => {
+    observer.observe(block);
+  });