From d740f77ed76f5ba8c5baf04c35ec2e949697d611 Mon Sep 17 00:00:00 2001
From: AGorokhov <a.gorokhov@infocyber.pro>
Date: Fri, 26 Jun 2026 16:39:30 +0300
Subject: [PATCH] style: update layout and content in landing page index

---
 index.html | 23 ++++++++---------------
 1 file changed, 8 insertions(+), 15 deletions(-)

diff --git a/index.html b/index.html
index 9d2d1ce..c3b2a52 100644
--- a/index.html
+++ b/index.html
@@ -89,7 +89,7 @@
     </header>
 
     <!-- 2. БЛОК HERO (Первый экран) -->
-    <section class="relative min-h-screen flex items-center pt-20 overflow-hidden hex-pattern">
+    <section class="relative min-h-screen grid items-center pt-20 pb-12 overflow-hidden hex-pattern">
         <!-- Неоновые фоновые градиенты -->
         <div
             class="absolute top-1/2 left-0 -translate-y-1/2 w-[600px] h-[600px] bg-cyber-purple/20 rounded-full blur-[120px] pointer-events-none">
@@ -98,19 +98,19 @@
             class="absolute bottom-0 right-0 w-[500px] h-[500px] bg-cyber-blue/20 rounded-full blur-[150px] pointer-events-none">
         </div>
 
-        <div class="max-w-[1400px] mx-auto px-6 grid lg:grid-cols-2 gap-12 items-center relative z-10 w-full">
-            <div class="space-y-8">
+        <div class="max-w-[1400px] mx-auto px-6 grid grid-cols-1 lg:grid-cols-12 gap-12 items-center relative z-10 w-full">
+            <div class="grid gap-8 lg:col-span-7">
                 <!-- Бейдж -->
                 <div
-                    class="inline-flex items-center gap-3 px-5 py-2 bg-cyber-purple/10 border border-cyber-purple/30 rounded-none clip-path-polygon backdrop-blur-sm">
+                    class="inline-flex items-center gap-3 px-5 py-2 bg-cyber-purple/10 border border-cyber-purple/30 rounded-none clip-path-polygon backdrop-blur-sm justify-self-start">
                     <span class="w-2.5 h-2.5 bg-cyber-purple animate-pulse shadow-[0_0_10px_#7c3aed]"></span>
                     <span class="text-xs font-mono text-cyber-purple uppercase tracking-widest font-bold">Организация
                         высшего тира</span>
                 </div>
 
-                <h1 class="text-5xl sm:text-6xl lg:text-7xl font-black leading-tight uppercase">
+                <h1 class="text-[clamp(1.5rem,7.2vw,2.5rem)] sm:text-5xl md:text-6xl lg:text-5xl xl:text-6xl 2xl:text-[4rem] font-black leading-tight uppercase break-words">
                     <span class="text-white block glitch-hover">ИКП — Твой</span>
-                    <span class="gradient-text block">Киберспортивный</span>
+                    <span class="gradient-text inline-block">Киберспортивный</span>
                     <span class="text-white block glitch-hover">Старт</span>
                 </h1>
 
@@ -125,7 +125,7 @@
                 </div>
             </div>
 
-            <div class="relative hidden lg:block">
+            <div class="relative hidden lg:block lg:col-span-5">
                 <!-- Декоративные уголки -->
                 <div
                     class="absolute -top-6 -left-6 w-24 h-24 border-t-2 border-l-2 border-cyber-purple opacity-50 z-20">
@@ -860,14 +860,6 @@
                 <div id="services-progress-bar" class="absolute h-full bg-gradient-to-r from-cyber-blue to-cyber-purple transition-all duration-300 shadow-[0_0_15px_rgba(59,130,246,0.8)]" style="width: 0%; left: 0%;"></div>
             </div>
         </div>
-        </div>
-
-
-
-        </div>
-        </div>
-        </div>
-        </div>
     </section>
 
     <!-- 4. БЛОК О НАС -->
@@ -1199,6 +1191,7 @@
                                     class="cyber-btn text-sm whitespace-nowrap !py-3 !px-8 border-cyber-purple w-full md:w-auto text-center">Связаться</a>
                         </div>
                     </div>
+                    </div>
                     <!-- Вертикальный прогресс-бар -->
                     <div class="w-1.5 relative bg-cyber-gray/30 border border-cyber-pink/20 rounded-none overflow-hidden shrink-0 self-stretch my-2">
                         <div id="vacancies-progress-bar" class="absolute w-full bg-gradient-to-b from-cyber-pink to-cyber-purple transition-all duration-500 shadow-[0_0_15px_rgba(236,72,153,0.8)]" style="height: 50%; top: 0%;"></div>