From 5fd42177d3818476b03a64b6eadab5c00bb29fc5 Mon Sep 17 00:00:00 2001
From: root <root@genetic-bronze.play2go.cloud>
Date: Sat, 20 Jun 2026 06:48:02 +0000
Subject: [PATCH] =?UTF-8?q?feat:=20SEO/GEO=20optimization=20=E2=80=94=20me?=
 =?UTF-8?q?ta=20tags,=20JSON-LD,=20FAQ,=20robots/sitemap?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- index.html: title, meta description, OG tags, Twitter Card, canonical
- index.html: JSON-LD structured data (LocalBusiness + Service + FAQPage)
- Hero.jsx: H1 now contains primary keyword "защитная пленка для окон"
- Hero.jsx: subtitle expanded with specs (200–300 мкм, ГОСТ 30826-2014)
- TrustBar.jsx: h3 → h2 (fixes heading hierarchy)
- FAQ.jsx: new FAQ accordion (8 Q&As, GEO/AI-citation ready)
- App.jsx: FAQ added to landing page before LeadForm
- public/robots.txt: disallow /admin/ and /track/
- public/sitemap.xml: single-page sitemap for landing
---
 index.html                  | 141 +++++++++++++++++++++++++++++++++++-
 public/robots.txt           |   6 ++
 public/sitemap.xml          |   9 +++
 src/App.jsx                 |   4 +-
 src/components/FAQ.jsx      | 139 +++++++++++++++++++++++++++++++++++
 src/components/Hero.jsx     |  12 +--
 src/components/TrustBar.jsx |   6 +-
 7 files changed, 305 insertions(+), 12 deletions(-)
 create mode 100644 public/robots.txt
 create mode 100644 public/sitemap.xml
 create mode 100644 src/components/FAQ.jsx

diff --git a/index.html b/index.html
index a68a008..6775bf2 100644
--- a/index.html
+++ b/index.html
@@ -9,9 +9,144 @@
     <meta name="theme-color" content="#4361EE" />
     <meta name="apple-mobile-web-app-capable" content="yes" />
     <meta name="apple-mobile-web-app-status-bar-style" content="default" />
-    <meta name="apple-mobile-web-app-title" content="Осколкам" />
-    <meta name="description" content="Панель управления — бронирование стекол" />
-    <title>Осколкам.Нет</title>
+    <meta name="apple-mobile-web-app-title" content="Осколкам.Нет" />
+
+    <!-- Primary SEO -->
+    <title>Защитная пленка для окон от осколков и взрывных волн | Осколкам.Нет</title>
+    <meta name="description" content="Промышленные бронирующие пленки для защиты окон от осколков дронов и взрывных волн. Классы А1/А2/А3, ГОСТ 30826-2014, EN 356. Бесплатный замер по всей России и СНГ." />
+    <meta name="keywords" content="защитная пленка для окон, бронирующая пленка, пленка от осколков стекла, взрывозащитная пленка, защита окон от взрыва, бронепленка для стекол" />
+    <meta name="robots" content="index, follow" />
+    <link rel="canonical" href="https://oskolkam.net/" />
+
+    <!-- Open Graph (Facebook, Telegram, VK) -->
+    <meta property="og:type" content="website" />
+    <meta property="og:url" content="https://oskolkam.net/" />
+    <meta property="og:site_name" content="Осколкам.Нет" />
+    <meta property="og:locale" content="ru_RU" />
+    <meta property="og:title" content="Защитная пленка для окон от осколков и взрывных волн" />
+    <meta property="og:description" content="Промышленные бронирующие пленки. Классы А1/А2/А3 по ГОСТ 30826-2014. Защита от осколков дронов и взрывной волны. Бесплатный выезд инженера по РФ и СНГ." />
+    <meta property="og:image" content="https://oskolkam.net/pwa-512x512.png" />
+    <meta property="og:image:width" content="512" />
+    <meta property="og:image:height" content="512" />
+    <meta property="og:image:alt" content="Осколкам.Нет — защитные бронирующие пленки для окон" />
+
+    <!-- Twitter Card -->
+    <meta name="twitter:card" content="summary_large_image" />
+    <meta name="twitter:title" content="Защитная пленка для окон от осколков | Осколкам.Нет" />
+    <meta name="twitter:description" content="Промышленные бронирующие пленки. Классы А1/А2/А3. Бесплатный замер по РФ и СНГ." />
+    <meta name="twitter:image" content="https://oskolkam.net/pwa-512x512.png" />
+
+    <!-- JSON-LD: LocalBusiness + Service -->
+    <script type="application/ld+json">
+    {
+      "@context": "https://schema.org",
+      "@graph": [
+        {
+          "@type": "LocalBusiness",
+          "@id": "https://oskolkam.net/#business",
+          "name": "Осколкам.Нет",
+          "url": "https://oskolkam.net/",
+          "logo": "https://oskolkam.net/pwa-512x512.png",
+          "image": "https://oskolkam.net/pwa-512x512.png",
+          "description": "Компания по поставке и монтажу промышленных бронирующих пленок для защиты окон от осколков и взрывных волн. Работаем по всей России и СНГ.",
+          "email": "ops@oskolkam.net",
+          "areaServed": {
+            "@type": "GeoCircle",
+            "geoMidpoint": {
+              "@type": "GeoCoordinates",
+              "latitude": 55.751244,
+              "longitude": 37.618423
+            },
+            "geoRadius": "5000000"
+          },
+          "serviceArea": [
+            {"@type": "Country", "name": "Россия"},
+            {"@type": "Country", "name": "Казахстан"},
+            {"@type": "Country", "name": "Беларусь"},
+            {"@type": "Country", "name": "Украина"}
+          ],
+          "hasOfferCatalog": {
+            "@type": "OfferCatalog",
+            "name": "Защитные бронирующие пленки",
+            "itemListElement": [
+              {"@type": "Offer", "itemOffered": {"@type": "Service", "name": "Бронирующая пленка 200 мкм (класс А1)"}},
+              {"@type": "Offer", "itemOffered": {"@type": "Service", "name": "Бронирующая пленка 300 мкм (класс А2/А3)"}}
+            ]
+          },
+          "sameAs": []
+        },
+        {
+          "@type": "Service",
+          "@id": "https://oskolkam.net/#service",
+          "name": "Монтаж защитных бронирующих пленок для окон",
+          "provider": {"@id": "https://oskolkam.net/#business"},
+          "description": "Профессиональный монтаж промышленных бронирующих пленок, защищающих от разлёта осколков стекла при взрывах и ударах. Сертификаты ISO 9001:2015, ГОСТ 30826-2014, EN 356.",
+          "serviceType": "Защитное остекление",
+          "areaServed": "Россия и СНГ",
+          "offers": {
+            "@type": "Offer",
+            "availability": "https://schema.org/InStock",
+            "priceCurrency": "RUB",
+            "priceSpecification": {
+              "@type": "PriceSpecification",
+              "description": "от 2000 руб/м²"
+            }
+          },
+          "hasCredential": [
+            {"@type": "EducationalOccupationalCredential", "name": "ISO 9001:2015"},
+            {"@type": "EducationalOccupationalCredential", "name": "ГОСТ 30826-2014"},
+            {"@type": "EducationalOccupationalCredential", "name": "EN 356"}
+          ]
+        },
+        {
+          "@type": "FAQPage",
+          "@id": "https://oskolkam.net/#faq",
+          "mainEntity": [
+            {
+              "@type": "Question",
+              "name": "Что такое бронирующая пленка для окон?",
+              "acceptedAnswer": {
+                "@type": "Answer",
+                "text": "Бронирующая пленка — это многослойная полиэстеровая пленка толщиной 200–300 мкм, которая наклеивается на стекло с внутренней стороны. При взрыве или ударе она удерживает осколки стекла, предотвращая их разлёт и снижая риск поражения людей в помещении."
+              }
+            },
+            {
+              "@type": "Question",
+              "name": "Защищает ли пленка от прямого попадания снаряда или дрона?",
+              "acceptedAnswer": {
+                "@type": "Answer",
+                "text": "Нет. Бронирующая пленка не является бронестеклом и не защищает от прямого попадания снаряда или дрона. Её главная задача — критически снизить риск поражения осколками стекла и частично поглотить энергию взрывной волны."
+              }
+            },
+            {
+              "@type": "Question",
+              "name": "Какие классы защиты существуют?",
+              "acceptedAnswer": {
+                "@type": "Answer",
+                "text": "Наши пленки соответствуют классам защиты А1, А2 и А3 по ГОСТ 30826-2014 и европейскому стандарту EN 356. Класс А1 (200 мкм) — базовая защита для жилых помещений, А2/А3 (300 мкм) — усиленная защита для промышленных объектов и критической инфраструктуры."
+              }
+            },
+            {
+              "@type": "Question",
+              "name": "Сколько стоит установка защитной пленки?",
+              "acceptedAnswer": {
+                "@type": "Answer",
+                "text": "Стоимость зависит от толщины пленки и площади остекления. Базовая цена: пленка 200 мкм — от 2000 руб/м², пленка 300 мкм — от 3000 руб/м². Точный расчёт делается бесплатно после выезда инженера для замера."
+              }
+            },
+            {
+              "@type": "Question",
+              "name": "Как долго длится монтаж и сколько времени работает пленка?",
+              "acceptedAnswer": {
+                "@type": "Answer",
+                "text": "Монтаж стандартного жилого помещения занимает 1–2 дня. Срок службы бронирующей пленки — от 10 лет при соблюдении условий эксплуатации. Пленка не требует специального ухода."
+              }
+            }
+          ]
+        }
+      ]
+    }
+    </script>
   </head>
   <body>
     <div id="root"></div>
diff --git a/public/robots.txt b/public/robots.txt
new file mode 100644
index 0000000..78ae0b3
--- /dev/null
+++ b/public/robots.txt
@@ -0,0 +1,6 @@
+User-agent: *
+Allow: /
+Disallow: /admin/
+Disallow: /track/
+
+Sitemap: https://oskolkam.net/sitemap.xml
diff --git a/public/sitemap.xml b/public/sitemap.xml
new file mode 100644
index 0000000..d02c985
--- /dev/null
+++ b/public/sitemap.xml
@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
+  <url>
+    <loc>https://oskolkam.net/</loc>
+    <lastmod>2026-06-20</lastmod>
+    <changefreq>monthly</changefreq>
+    <priority>1.0</priority>
+  </url>
+</urlset>
diff --git a/src/App.jsx b/src/App.jsx
index 9ed6ae9..7469a05 100644
--- a/src/App.jsx
+++ b/src/App.jsx
@@ -8,6 +8,7 @@ import Estimator from './components/Estimator';
 import TrustBar from './components/TrustBar';
 import Comparison from './components/Comparison';
 import LeadForm from './components/LeadForm';
+import FAQ from './components/FAQ';
 import Footer from './components/Footer';
 
 const LoginPage = React.lazy(() => import('./admin/auth/LoginPage'));
@@ -28,13 +29,14 @@ function PublicSite() {
   return (
     <div style={{ minHeight: '100vh', display: 'flex', flexDirection: 'column' }}>
       <Navbar />
-      <main style={{ flex: '1' }}>
+      <main style={{ flex: '1' }} aria-label="Защитные бронирующие пленки для окон">
         <Hero />
         <PhysicsOfSafety />
         <UseCases />
         <TrustBar />
         <Comparison />
         <Estimator />
+        <FAQ />
         <LeadForm />
       </main>
       <Footer />
diff --git a/src/components/FAQ.jsx b/src/components/FAQ.jsx
new file mode 100644
index 0000000..ccc8c55
--- /dev/null
+++ b/src/components/FAQ.jsx
@@ -0,0 +1,139 @@
+import React, { useState } from 'react';
+import { motion, AnimatePresence } from 'framer-motion';
+import { ChevronDown } from 'lucide-react';
+
+const faqs = [
+  {
+    q: 'Что такое бронирующая пленка для окон и от чего она защищает?',
+    a: 'Бронирующая пленка — многослойная полиэстеровая пленка толщиной 200–300 мкм, которая наклеивается на стекло с внутренней стороны. При взрыве или ударе она удерживает осколки стекла, предотвращая их разлёт. Пленка снижает риск поражения людей в помещении и частично поглощает энергию взрывной волны.',
+  },
+  {
+    q: 'Защищает ли пленка от прямого попадания снаряда или дрона?',
+    a: 'Нет. Бронирующая пленка не является бронестеклом и не останавливает прямое попадание. Её главная задача — критически снизить риск вторичного поражения осколками стекла и частично погасить ударную волну. Именно осколки остекления являются причиной большинства травм при взрывах.',
+  },
+  {
+    q: 'Какие классы защиты предлагает Осколкам.Нет?',
+    a: 'Мы поставляем пленки классов А1, А2 и А3 по ГОСТ 30826-2014 и европейскому стандарту EN 356. Класс А1 (200 мкм) — для жилых и коммерческих помещений. А2/А3 (300 мкм) — усиленная защита для промышленных объектов, критической инфраструктуры и военных объектов.',
+  },
+  {
+    q: 'Сколько стоит установка защитной пленки для окон?',
+    a: 'Стоимость зависит от толщины пленки и площади остекления. Базовая цена: пленка 200 мкм — от 2 000 руб/м², пленка 300 мкм — от 3 000 руб/м². Полный расчёт стоимости выполняется бесплатно после выезда инженера для замера.',
+  },
+  {
+    q: 'Как долго длится монтаж и каков срок службы пленки?',
+    a: 'Монтаж стандартной квартиры занимает 1 рабочий день, промышленного объекта — от 2 до 7 дней. Срок службы бронирующей пленки составляет 10–15 лет при соблюдении условий эксплуатации. Пленка не требует специального обслуживания.',
+  },
+  {
+    q: 'В каких регионах работает компания?',
+    a: 'Мы работаем по всей территории России и в странах СНГ: Казахстан, Беларусь, Узбекистан. Возможен выезд специализированной бригады в любой регион. Для удалённых объектов организуется поставка материалов и обучение местных монтажников.',
+  },
+  {
+    q: 'Можно ли наклеить пленку самостоятельно?',
+    a: 'Технически возможно, но не рекомендуется. Профессиональный монтаж исключает пузыри, отслоения и нахлёсты, которые снижают защитные характеристики пленки. Только корректно смонтированная пленка обеспечивает заявленный класс защиты по ГОСТ и EN 356. Самостоятельная установка аннулирует сертификат соответствия.',
+  },
+  {
+    q: 'Заметна ли бронирующая пленка на стеклах?',
+    a: 'Прозрачная бронирующая пленка практически незаметна — светопропускаемость составляет 87–92%. Внешний вид окон не меняется. Пленка не искажает обзор, не бликует и не влияет на естественное освещение помещения.',
+  },
+];
+
+const FAQItem = ({ q, a, index }) => {
+  const [open, setOpen] = useState(false);
+
+  return (
+    <motion.div
+      initial={{ opacity: 0, y: 20 }}
+      whileInView={{ opacity: 1, y: 0 }}
+      transition={{ duration: 0.4, delay: index * 0.06 }}
+      viewport={{ once: true }}
+      style={{
+        borderBottom: '1px solid var(--border-light)',
+      }}
+    >
+      <button
+        onClick={() => setOpen(!open)}
+        aria-expanded={open}
+        style={{
+          width: '100%',
+          display: 'flex',
+          justifyContent: 'space-between',
+          alignItems: 'center',
+          padding: '24px 0',
+          background: 'none',
+          border: 'none',
+          cursor: 'pointer',
+          textAlign: 'left',
+          gap: '20px',
+        }}
+      >
+        <span style={{ fontSize: '1.1rem', fontWeight: 700, color: 'var(--text-main)', lineHeight: 1.4 }}>
+          {q}
+        </span>
+        <motion.span
+          animate={{ rotate: open ? 180 : 0 }}
+          transition={{ duration: 0.25 }}
+          style={{ flexShrink: 0 }}
+        >
+          <ChevronDown size={22} className="text-accent-blue" />
+        </motion.span>
+      </button>
+      <AnimatePresence initial={false}>
+        {open && (
+          <motion.div
+            key="answer"
+            initial={{ height: 0, opacity: 0 }}
+            animate={{ height: 'auto', opacity: 1 }}
+            exit={{ height: 0, opacity: 0 }}
+            transition={{ duration: 0.25, ease: 'easeInOut' }}
+            style={{ overflow: 'hidden' }}
+          >
+            <p style={{
+              paddingBottom: '24px',
+              color: 'var(--text-muted)',
+              fontSize: '1.05rem',
+              lineHeight: 1.7,
+              maxWidth: '860px',
+            }}>
+              {a}
+            </p>
+          </motion.div>
+        )}
+      </AnimatePresence>
+    </motion.div>
+  );
+};
+
+const FAQ = () => (
+  <section id="faq" style={{ backgroundColor: 'var(--bg-light)', padding: '100px 0' }}>
+    <div className="container">
+      <div style={{ textAlign: 'center', marginBottom: '70px' }}>
+        <motion.h2
+          initial={{ opacity: 0, y: 20 }}
+          whileInView={{ opacity: 1, y: 0 }}
+          transition={{ duration: 0.6 }}
+          viewport={{ once: true }}
+          style={{ fontSize: '3rem', marginBottom: '20px', textTransform: 'uppercase' }}
+        >
+          Частые <span className="text-accent-blue">вопросы</span>
+        </motion.h2>
+        <motion.p
+          initial={{ opacity: 0, y: 20 }}
+          whileInView={{ opacity: 1, y: 0 }}
+          transition={{ duration: 0.6, delay: 0.15 }}
+          viewport={{ once: true }}
+          style={{ color: 'var(--text-muted)', fontSize: '1.2rem', maxWidth: '600px', margin: '0 auto' }}
+        >
+          Отвечаем на самые популярные вопросы о защитных пленках для окон
+        </motion.p>
+      </div>
+
+      <div style={{ maxWidth: '900px', margin: '0 auto' }}>
+        {faqs.map((item, i) => (
+          <FAQItem key={i} q={item.q} a={item.a} index={i} />
+        ))}
+      </div>
+    </div>
+  </section>
+);
+
+export default FAQ;
diff --git a/src/components/Hero.jsx b/src/components/Hero.jsx
index 4764705..8694af4 100644
--- a/src/components/Hero.jsx
+++ b/src/components/Hero.jsx
@@ -77,7 +77,7 @@ const Hero = () => {
             </span>
           </motion.div>
 
-          <motion.h1 
+          <motion.h1
             initial={{ opacity: 0, x: -50 }}
             animate={{ opacity: 1, x: 0 }}
             transition={{ duration: 0.8, delay: 0.2, type: "spring" }}
@@ -86,13 +86,15 @@ const Hero = () => {
               lineHeight: 1.05,
               marginBottom: '30px',
               color: 'var(--text-main)',
-              textShadow: '0 10px 30px rgba(15, 23, 42, 0.05)'
+              textShadow: '0 10px 30px rgba(15, 23, 42, 0.05)',
+              textTransform: 'uppercase'
             }}
           >
-            ПРЕВРАТИТЕ ВАШИ ОКНА В <span className="text-accent-blue">ЗАЩИТНЫЙ ЩИТ</span>.
+            Защитная пленка для окон —{' '}
+            <span className="text-accent-blue">защита от осколков</span> и взрывной волны
           </motion.h1>
 
-          <motion.p 
+          <motion.p
             initial={{ opacity: 0, x: -50 }}
             animate={{ opacity: 1, x: 0 }}
             transition={{ duration: 0.8, delay: 0.4, type: "spring" }}
@@ -104,7 +106,7 @@ const Hero = () => {
               fontWeight: 400
             }}
           >
-            Промышленные бронирующие пленки, разработанные для максимального поглощения кинетической энергии: защита от взрывных волн и ударов дронов.
+            Промышленные бронирующие пленки толщиной 200–300 мкм. Классы защиты А1/А2/А3 по ГОСТ 30826-2014. Удерживают осколки при взрывах дронов и взрывных волнах.
           </motion.p>
 
           <motion.div 
diff --git a/src/components/TrustBar.jsx b/src/components/TrustBar.jsx
index 9fa78f8..8add4c4 100644
--- a/src/components/TrustBar.jsx
+++ b/src/components/TrustBar.jsx
@@ -14,14 +14,14 @@ const TrustBar = () => {
     <section style={{ padding: '70px 0', borderTop: '1px solid var(--border-light)', borderBottom: '1px solid var(--border-light)', background: 'var(--bg-lighter)' }}>
       <div className="container">
         <div style={{ textAlign: 'center', marginBottom: '50px' }}>
-          <motion.h3 
+          <motion.h2
             initial={{ opacity: 0 }}
             whileInView={{ opacity: 1 }}
             viewport={{ once: true }}
             style={{ fontSize: '1.3rem', color: 'var(--text-muted)', letterSpacing: '2px', textTransform: 'uppercase', fontWeight: '700' }}
           >
-            СЕРТИФИЦИРОВАНО ПО МЕЖДУНАРОДНЫМ СТАНДАРТАМ БЕЗОПАСНОСТИ
-          </motion.h3>
+            Сертифицировано по международным стандартам безопасности
+          </motion.h2>
         </div>
         
         <div style={{ display: 'flex', flexWrap: 'wrap', justifyContent: 'center', gap: '50px' }}>