From fb24ddbfd2bee94bcdba675af958126275865f73 Mon Sep 17 00:00:00 2001 From: albivkt Date: Sun, 13 Jul 2025 13:54:52 +0300 Subject: [PATCH] Update dependencies, enhance global styles, and improve layout structure. Added Geist font support and integrated a contact modal in the navigation. Refactored the DraggableCard component for better performance and simplified drag-and-drop functionality. Enhanced UXSoftware and SecureT pages with new features and improved user interactions. --- package-lock.json | 10 + package.json | 15 +- src/app/components/ContactModal.tsx | 184 +++ src/app/components/DraggableCard.tsx | 224 +-- src/app/components/FloatingCTA.tsx | 111 ++ src/app/components/Footer.tsx | 293 ++++ src/app/components/LicenseCalculator.tsx | 260 ++++ src/app/components/Navigation.tsx | 219 ++- src/app/contacts/page.tsx | 460 ++++++ src/app/contexts/ThemeContext.tsx | 53 + src/app/drweb/page.tsx | 162 +-- src/app/globals.css | 1693 +++++++++++++++++++++- src/app/layout.tsx | 20 +- src/app/page.tsx | 33 + src/app/secure-t/page.tsx | 691 ++++++++- src/app/ux-software/layout.tsx | 15 + src/app/ux-software/page.tsx | 296 +++- 17 files changed, 4257 insertions(+), 482 deletions(-) create mode 100644 src/app/components/ContactModal.tsx create mode 100644 src/app/components/FloatingCTA.tsx create mode 100644 src/app/components/Footer.tsx create mode 100644 src/app/components/LicenseCalculator.tsx create mode 100644 src/app/contacts/page.tsx create mode 100644 src/app/contexts/ThemeContext.tsx create mode 100644 src/app/ux-software/layout.tsx diff --git a/package-lock.json b/package-lock.json index 24c704c..023c4fc 100644 --- a/package-lock.json +++ b/package-lock.json @@ -8,6 +8,7 @@ "name": "my-app", "version": "0.1.0", "dependencies": { + "geist": "^1.4.2", "next": "15.3.4", "react": "^19.0.0", "react-dom": "^19.0.0" @@ -3388,6 +3389,15 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/geist": { + "version": "1.4.2", + "resolved": "https://registry.npmjs.org/geist/-/geist-1.4.2.tgz", + "integrity": "sha512-OQUga/KUc8ueijck6EbtT07L4tZ5+TZgjw8PyWfxo16sL5FWk7gNViPNU8hgCFjy6bJi9yuTP+CRpywzaGN8zw==", + "license": "SIL OPEN FONT LICENSE", + "peerDependencies": { + "next": ">=13.2.0" + } + }, "node_modules/get-intrinsic": { "version": "1.3.0", "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.3.0.tgz", diff --git a/package.json b/package.json index 211e9ad..287e24c 100644 --- a/package.json +++ b/package.json @@ -3,25 +3,26 @@ "version": "0.1.0", "private": true, "scripts": { - "dev": "next dev --turbopack", + "dev": "next dev", "build": "next build", "start": "next start", "lint": "next lint" }, "dependencies": { + "geist": "^1.4.2", + "next": "15.3.4", "react": "^19.0.0", - "react-dom": "^19.0.0", - "next": "15.3.4" + "react-dom": "^19.0.0" }, "devDependencies": { - "typescript": "^5", + "@eslint/eslintrc": "^3", + "@tailwindcss/postcss": "^4", "@types/node": "^20", "@types/react": "^19", "@types/react-dom": "^19", - "@tailwindcss/postcss": "^4", - "tailwindcss": "^4", "eslint": "^9", "eslint-config-next": "15.3.4", - "@eslint/eslintrc": "^3" + "tailwindcss": "^4", + "typescript": "^5" } } diff --git a/src/app/components/ContactModal.tsx b/src/app/components/ContactModal.tsx new file mode 100644 index 0000000..69fda0c --- /dev/null +++ b/src/app/components/ContactModal.tsx @@ -0,0 +1,184 @@ +'use client'; + +import { useState } from 'react'; + +interface ContactModalProps { + isOpen: boolean; + onClose: () => void; + defaultType?: string; + title?: string; +} + +export default function ContactModal({ + isOpen, + onClose, + defaultType = 'general', + title = 'Связаться с нами' +}: ContactModalProps) { + const [formData, setFormData] = useState({ + name: '', + email: '', + phone: '', + company: '', + message: '', + type: defaultType + }); + + const handleInputChange = (e: React.ChangeEvent) => { + const { name, value } = e.target; + setFormData(prev => ({ + ...prev, + [name]: value + })); + }; + + const handleSubmit = (e: React.FormEvent) => { + e.preventDefault(); + alert(`Спасибо за обращение, ${formData.name}! Мы свяжемся с вами в ближайшее время.`); + setFormData({ name: '', email: '', phone: '', company: '', message: '', type: defaultType }); + onClose(); + }; + + const contactTypes = [ + { id: 'general', label: 'Общие вопросы', icon: '💬' }, + { id: 'sales', label: 'Отдел продаж', icon: '💼' }, + { id: 'support', label: 'Техподдержка', icon: '🔧' }, + { id: 'partnership', label: 'Партнёрство', icon: '🤝' }, + { id: 'consultation', label: 'Консультация', icon: '💡' }, + { id: 'demo', label: 'Демонстрация', icon: '🖥️' } + ]; + + if (!isOpen) return null; + + return ( +
+
+
+

{title}

+ +
+ +
+
+ + +
+ +
+ + +
+ +
+ + +
+ +
+ + +
+ +
+ + +
+ +
+ + +
+ +
+ + +
+
+ +
+

+ Или свяжитесь с нами напрямую: +
+ 📞 +7 (495) 123-45-67 +
+ 📧 info@gundyrev.ru +

+
+
+
+ ); +} \ No newline at end of file diff --git a/src/app/components/DraggableCard.tsx b/src/app/components/DraggableCard.tsx index d2ee80d..9822f2d 100644 --- a/src/app/components/DraggableCard.tsx +++ b/src/app/components/DraggableCard.tsx @@ -7,10 +7,8 @@ interface DraggableCardProps { className?: string; initialX?: number; initialY?: number; - containerHeight?: number; - onLanded?: () => void; onDragStart?: () => void; - onDragEnd?: (wasDragging: boolean) => void; + onDragEnd?: () => void; } export default function DraggableCard({ @@ -18,150 +16,24 @@ export default function DraggableCard({ className = '', initialX = 0, initialY = 0, - containerHeight, - onLanded, onDragStart, onDragEnd }: DraggableCardProps) { const [position, setPosition] = useState({ x: initialX, y: initialY }); const [isDragging, setIsDragging] = useState(false); - const [isFalling, setIsFalling] = useState(true); - const [isDropFalling, setIsDropFalling] = useState(false); const [dragOffset, setDragOffset] = useState({ x: 0, y: 0 }); - const [fallDirection, setFallDirection] = useState({ x: 0, rotation: 0 }); - const [velocity, setVelocity] = useState({ x: 0, y: 0 }); const cardRef = useRef(null); - const lastPosition = useRef({ x: initialX, y: initialY }); - const dragStartTime = useRef(0); - - // Динамическая высота приземления - оставляем место для полного блока - const getGroundY = () => { - const cardHeight = 160; // Примерная высота карточки - const bottomPadding = 40; // Дополнительный отступ - const totalOffset = cardHeight + bottomPadding; // ~200px - - if (containerHeight) { - return containerHeight - totalOffset; - } - if (typeof window !== 'undefined') { - const viewportHeight = window.innerHeight * 0.8; // 80vh - return Math.max(viewportHeight, 700) - totalOffset; - } - return 500; // Fallback для SSR - }; - - const GROUND_Y = getGroundY(); - - // Инициализация случайного направления падения (только для анимации, не для движения) - useEffect(() => { - const randomRotation = (Math.random() - 0.5) * 20; // Только небольшая ротация - setFallDirection({ x: 0, rotation: randomRotation }); // x = 0 для прямого падения - }, []); - - // Анимация первоначального падения - useEffect(() => { - if (!isFalling) return; - - const fallDuration = 2000 + Math.random() * 1000; // 2-3 секунды - const startY = initialY; - const startX = initialX; - const endX = initialX; // Падаем строго вниз, без отклонений - const startTime = Date.now(); - - const animate = () => { - const elapsed = Date.now() - startTime; - const progress = Math.min(elapsed / fallDuration, 1); - - // Easing function для более реалистичного падения - const easeOutBounce = (t: number) => { - if (t < 1 / 2.75) { - return 7.5625 * t * t; - } else if (t < 2 / 2.75) { - return 7.5625 * (t -= 1.5 / 2.75) * t + 0.75; - } else if (t < 2.5 / 2.75) { - return 7.5625 * (t -= 2.25 / 2.75) * t + 0.9375; - } else { - return 7.5625 * (t -= 2.625 / 2.75) * t + 0.984375; - } - }; - - const easedProgress = easeOutBounce(progress); - const currentY = startY + (GROUND_Y - startY) * easedProgress; - const currentX = startX + (endX - startX) * progress; // Теперь это просто startX - - setPosition({ x: currentX, y: currentY }); - lastPosition.current = { x: currentX, y: currentY }; - - if (progress < 1) { - requestAnimationFrame(animate); - } else { - setIsFalling(false); - if (onLanded) { - setTimeout(() => onLanded(), 100); - } - } - }; - - // Начинаем падение сразу без задержки - requestAnimationFrame(animate); - }, [initialY, initialX, fallDirection, onLanded, isFalling]); - - // Анимация падения после отпускания - useEffect(() => { - if (!isDropFalling) return; - - const fallDuration = 800; - const startX = position.x; - const startY = position.y; - const startTime = Date.now(); - - const animate = () => { - const elapsed = Date.now() - startTime; - const progress = Math.min(elapsed / fallDuration, 1); - - // Easing для падения с отскоком - const easeOutBounce = (t: number) => { - if (t < 1 / 2.75) { - return 7.5625 * t * t; - } else if (t < 2 / 2.75) { - return 7.5625 * (t -= 1.5 / 2.75) * t + 0.75; - } else if (t < 2.5 / 2.75) { - return 7.5625 * (t -= 2.25 / 2.75) * t + 0.9375; - } else { - return 7.5625 * (t -= 2.625 / 2.75) * t + 0.984375; - } - }; - - const easedProgress = easeOutBounce(progress); - const currentY = startY + (GROUND_Y - startY) * easedProgress; - - setPosition({ x: startX, y: currentY }); - - if (progress < 1) { - requestAnimationFrame(animate); - } else { - setIsDropFalling(false); - } - }; - - requestAnimationFrame(animate); - }, [isDropFalling, position.x, position.y]); // Mouse events const handleMouseDown = (e: React.MouseEvent) => { - if (isFalling || isDropFalling || !cardRef.current) return; + if (!cardRef.current) return; - // Рассчитываем смещение относительно текущей позиции блока setDragOffset({ x: e.clientX - position.x, y: e.clientY - position.y }); setIsDragging(true); - setVelocity({ x: 0, y: 0 }); - lastPosition.current = position; - dragStartTime.current = Date.now(); - // Уведомляем родительский компонент о начале перетаскивания if (onDragStart) { onDragStart(); } @@ -170,60 +42,35 @@ export default function DraggableCard({ }; const handleMouseMove = (e: MouseEvent) => { - if (!isDragging || isFalling || isDropFalling) return; + if (!isDragging) return; const newX = e.clientX - dragOffset.x; const newY = e.clientY - dragOffset.y; - // Рассчитываем скорость для инерции - setVelocity({ - x: newX - lastPosition.current.x, - y: newY - lastPosition.current.y - }); - setPosition({ x: newX, y: newY }); - lastPosition.current = { x: newX, y: newY }; }; const handleMouseUp = () => { if (isDragging) { - const dragDuration = Date.now() - dragStartTime.current; - const dragDistance = Math.sqrt( - Math.pow(position.x - lastPosition.current.x, 2) + - Math.pow(position.y - lastPosition.current.y, 2) - ); - const wasDragging = dragDuration > 150 && dragDistance > 10; // Считаем перетаскиванием если больше 150ms И больше 10px движения - setIsDragging(false); - // Уведомляем родительский компонент об окончании перетаскивания if (onDragEnd) { - onDragEnd(wasDragging); // Передаем информацию о том, было ли это реальное перетаскивание - } - - if (wasDragging) { - // Запускаем падение вниз сразу после перетаскивания - setIsDropFalling(true); + onDragEnd(); } } }; // Touch events const handleTouchStart = (e: React.TouchEvent) => { - if (isFalling || isDropFalling || !cardRef.current) return; + if (!cardRef.current) return; const touch = e.touches[0]; - // Рассчитываем смещение относительно текущей позиции блока setDragOffset({ x: touch.clientX - position.x, y: touch.clientY - position.y }); setIsDragging(true); - setVelocity({ x: 0, y: 0 }); - lastPosition.current = position; - dragStartTime.current = Date.now(); - // Уведомляем родительский компонент о начале перетаскивания if (onDragStart) { onDragStart(); } @@ -232,49 +79,29 @@ export default function DraggableCard({ }; const handleTouchMove = (e: TouchEvent) => { - if (!isDragging || isFalling || isDropFalling) return; + if (!isDragging) return; const touch = e.touches[0]; const newX = touch.clientX - dragOffset.x; const newY = touch.clientY - dragOffset.y; - // Рассчитываем скорость для инерции - setVelocity({ - x: newX - lastPosition.current.x, - y: newY - lastPosition.current.y - }); - setPosition({ x: newX, y: newY }); - lastPosition.current = { x: newX, y: newY }; e.preventDefault(); }; const handleTouchEnd = () => { if (isDragging) { - const dragDuration = Date.now() - dragStartTime.current; - const dragDistance = Math.sqrt( - Math.pow(position.x - lastPosition.current.x, 2) + - Math.pow(position.y - lastPosition.current.y, 2) - ); - const wasDragging = dragDuration > 150 && dragDistance > 10; // Считаем перетаскиванием если больше 150ms И больше 10px движения - setIsDragging(false); - // Уведомляем родительский компонент об окончании перетаскивания if (onDragEnd) { - onDragEnd(wasDragging); // Передаем информацию о том, было ли это реальное перетаскивание - } - - if (wasDragging) { - // Запускаем падение вниз сразу после перетаскивания - setIsDropFalling(true); + onDragEnd(); } } }; // Event listeners useEffect(() => { - if (isDragging && !isFalling && !isDropFalling) { + if (isDragging) { document.addEventListener('mousemove', handleMouseMove); document.addEventListener('mouseup', handleMouseUp); document.addEventListener('touchmove', handleTouchMove, { passive: false }); @@ -282,7 +109,6 @@ export default function DraggableCard({ document.body.style.cursor = 'grabbing'; document.body.style.userSelect = 'none'; - document.body.style.touchAction = 'none'; } else { document.removeEventListener('mousemove', handleMouseMove); document.removeEventListener('mouseup', handleMouseUp); @@ -291,7 +117,6 @@ export default function DraggableCard({ document.body.style.cursor = ''; document.body.style.userSelect = ''; - document.body.style.touchAction = ''; } return () => { @@ -302,45 +127,20 @@ export default function DraggableCard({ document.body.style.cursor = ''; document.body.style.userSelect = ''; - document.body.style.touchAction = ''; }; - }, [isDragging, isFalling, isDropFalling, dragOffset, velocity]); - - const getTransform = () => { - const velocityRotation = isDragging ? Math.max(-15, Math.min(15, velocity.x * 0.5)) : 0; - const hoverEffect = isDragging ? Math.sin(Date.now() * 0.005) * 2 : 0; - - if (isFalling) { - return `rotate(${fallDirection.rotation}deg)`; // Только небольшая начальная ротация, без колебаний - } else if (isDragging) { - return `rotate(${3 + velocityRotation + hoverEffect}deg) scale(1.08) translateZ(0)`; - } else if (isDropFalling) { - return 'rotate(0deg) scale(0.95)'; // Прямое падение без поворота - } - return 'rotate(0deg) scale(1) translateZ(0)'; - }; + }, [isDragging, dragOffset]); return (
{ + const timer = setTimeout(() => { + setIsVisible(true); + }, 2000); + + return () => clearTimeout(timer); + }, []); + + useEffect(() => { + const interval = setInterval(() => { + setCurrentText(prev => (prev + 1) % ctaTexts.length); + }, 3000); + + return () => clearInterval(interval); + }, []); + + if (!isVisible) return null; + + return ( + <> +
+ + + {/* Дополнительные мини-кнопки */} +
+ + +
+
+ + {/* Мобильная фиксированная панель снизу */} +
+ +
+ + {/* Модальное окно */} + setIsModalOpen(false)} + defaultType="sales" + title="Оставить заявку" + /> + + + + ); +} \ No newline at end of file diff --git a/src/app/components/Footer.tsx b/src/app/components/Footer.tsx new file mode 100644 index 0000000..d9ad366 --- /dev/null +++ b/src/app/components/Footer.tsx @@ -0,0 +1,293 @@ +'use client'; + +import { useState } from 'react'; +import ContactModal from './ContactModal'; + +export default function Footer() { + const [isContactModalOpen, setIsContactModalOpen] = useState(false); + const [copySuccess, setCopySuccess] = useState(null); + + const copyToClipboard = async (text: string, type: string) => { + try { + await navigator.clipboard.writeText(text); + setCopySuccess(type); + setTimeout(() => setCopySuccess(null), 2000); + } catch (err) { + console.error('Ошибка копирования:', err); + } + }; + + return ( + <> +
+
+ {/* Основное содержимое футера */} +
+ + {/* О компании */} +
+

GUNDYREV

+

+ Комплексные IT-решения для бизнеса. От разработки программного обеспечения + до поставки электроники. +

+
+ +
+
+ + {/* Услуги */} + + + {/* Контакты */} +
+

Контакты

+ + + {/* Отделы */} +
+
Отделы:
+
    +
  • Продажи: sales@gundyrev.ru
  • +
  • Поддержка: support@gundyrev.ru
  • +
  • Бухгалтерия: accounting@gundyrev.ru
  • +
+
+
+ + {/* Юридическая информация */} +
+

Юридические данные

+
+
+
Полное наименование:
+

+ ООО "ГУНДЫРЕВ" +

+
+ +
+
+
ИНН:
+

copyToClipboard('7701234567', 'inn')} + title="Нажмите для копирования" + > + 7701234567 + {copySuccess === 'inn' && } +

+
+
+
КПП:
+

copyToClipboard('770101001', 'kpp')} + title="Нажмите для копирования" + > + 770101001 + {copySuccess === 'kpp' && } +

+
+
+ +
+
ОГРН:
+

copyToClipboard('1234567890123', 'ogrn')} + title="Нажмите для копирования" + > + 1234567890123 + {copySuccess === 'ogrn' && } +

+
+ +
+
Юридический адрес:
+

+ 123456, г. Москва, ул. Примерная, д. 1, стр. 1, оф. 101 +

+
+ +
+
Генеральный директор:
+

+ Гундырев Александр Владимирович +

+
+
+
+
+ + {/* Банковские реквизиты */} +
+

Банковские реквизиты

+
+
+
Расчётный счёт:
+

copyToClipboard('40702810123456789012', 'rs')} + title="Нажмите для копирования" + > + 40702810123456789012 + {copySuccess === 'rs' && } +

+
+
+
Корреспондентский счёт:
+

copyToClipboard('30101810123456789012', 'ks')} + title="Нажмите для копирования" + > + 30101810123456789012 + {copySuccess === 'ks' && } +

+
+
+
БИК:
+

copyToClipboard('123456789', 'bik')} + title="Нажмите для копирования" + > + 123456789 + {copySuccess === 'bik' && } +

+
+
+

+ ПАО "Банк ПРИМЕРНЫЙ", г. Москва +

+
+ + {/* Нижняя часть футера */} +
+
+
+ © 2024 ООО "ГУНДЫРЕВ". Все права защищены. +
+ +
+ + Контакты + + + О компании + + +
+
+ + {/* Дополнительная информация */} +
+
+
+

+ 🏛️ Работаем с государственными закупками по 44-ФЗ и 223-ФЗ +

+

+ 🛡️ Соответствуем требованиям информационной безопасности +

+
+
+

+ 📜 Лицензии и сертификаты соответствия +

+

+ ⚖️ Деятельность ведётся в соответствии с законодательством РФ +

+
+
+
+
+
+
+ + {/* Contact Modal */} + setIsContactModalOpen(false)} + defaultType="general" + title="Обратная связь" + /> + + ); +} \ No newline at end of file diff --git a/src/app/components/LicenseCalculator.tsx b/src/app/components/LicenseCalculator.tsx new file mode 100644 index 0000000..d362843 --- /dev/null +++ b/src/app/components/LicenseCalculator.tsx @@ -0,0 +1,260 @@ +'use client'; + +import { useState } from 'react'; + +interface LicensePrice { + name: string; + price: number; + description: string; + minNodes: number; + maxNodes: number; +} + +const licenseData: LicensePrice[] = [ + { + name: 'Dr.Web Security Space', + price: 890, + description: 'Комплексная защита для домашних пользователей', + minNodes: 1, + maxNodes: 5 + }, + { + name: 'Dr.Web Enterprise Suite', + price: 1250, + description: 'Корпоративное решение для предприятий', + minNodes: 5, + maxNodes: 1000 + }, + { + name: 'Dr.Web Mobile Security', + price: 650, + description: 'Защита мобильных устройств', + minNodes: 1, + maxNodes: 100 + }, + { + name: 'Dr.Web Gateway Security', + price: 1890, + description: 'Защита интернет-шлюзов и серверов', + minNodes: 1, + maxNodes: 50 + }, + { + name: 'Dr.Web Cloud', + price: 750, + description: 'Облачные решения безопасности', + minNodes: 1, + maxNodes: 500 + } +]; + +export default function LicenseCalculator() { + const [selectedLicense, setSelectedLicense] = useState(''); + const [nodeCount, setNodeCount] = useState(1); + const [duration, setDuration] = useState(12); + const [showResult, setShowResult] = useState(false); + + const getCurrentLicense = () => { + return licenseData.find(license => license.name === selectedLicense); + }; + + const calculatePrice = () => { + const license = getCurrentLicense(); + if (!license) return 0; + + let basePrice = license.price * nodeCount; + + // Скидки за количество + if (nodeCount >= 100) { + basePrice *= 0.85; // 15% скидка + } else if (nodeCount >= 50) { + basePrice *= 0.9; // 10% скидка + } else if (nodeCount >= 20) { + basePrice *= 0.95; // 5% скидка + } + + // Скидки за длительность + if (duration >= 36) { + basePrice *= 0.8; // 20% скидка за 3 года + } else if (duration >= 24) { + basePrice *= 0.85; // 15% скидка за 2 года + } else if (duration >= 12) { + basePrice *= 0.9; // 10% скидка за 1 год + } + + return Math.round(basePrice); + }; + + const handleCalculate = () => { + if (selectedLicense && nodeCount > 0) { + setShowResult(true); + } + }; + + const handleReset = () => { + setSelectedLicense(''); + setNodeCount(1); + setDuration(12); + setShowResult(false); + }; + + return ( +
+

+ Калькулятор стоимости лицензий Dr.Web +

+ +
+ {/* Выбор лицензии */} +
+ + + {selectedLicense && ( +

+ {getCurrentLicense()?.description} +

+ )} +
+ + {/* Количество узлов */} +
+ + { + setNodeCount(parseInt(e.target.value) || 1); + setShowResult(false); + }} + min={getCurrentLicense()?.minNodes || 1} + max={getCurrentLicense()?.maxNodes || 1000} + className="w-full px-4 py-3 bg-gray-800 border border-gray-600 rounded-lg text-white focus:outline-none focus:border-green-500 transition-colors" + placeholder="Введите количество узлов" + /> + {selectedLicense && ( +

+ Доступно: {getCurrentLicense()?.minNodes} - {getCurrentLicense()?.maxNodes} узлов +

+ )} +
+ + {/* Длительность лицензии */} +
+ + +
+ + {/* Кнопки */} +
+ + +
+ + {/* Результат */} + {showResult && ( +
+

Расчет стоимости

+
+
+ Продукт: + {selectedLicense} +
+
+ Количество узлов: + {nodeCount} +
+
+ Срок лицензии: + {duration} мес. +
+
+
+ Итоговая стоимость: + {calculatePrice().toLocaleString()}₽ +
+
+
+ +
+

+ Включено в стоимость: +

+
    +
  • • Техническая поддержка
  • +
  • • Обновления вирусных баз
  • +
  • • Обновления программного обеспечения
  • +
  • • Консультации по настройке
  • +
+
+
+ )} + + {/* Информация о скидках */} +
+
Доступные скидки
+
+
+

По количеству узлов:

+
    +
  • • 20+ узлов: скидка 5%
  • +
  • • 50+ узлов: скидка 10%
  • +
  • • 100+ узлов: скидка 15%
  • +
+
+
+

По сроку лицензии:

+
    +
  • • 1 год: скидка 10%
  • +
  • • 2 года: скидка 15%
  • +
  • • 3 года: скидка 20%
  • +
+
+
+
+
+
+ ); +} \ No newline at end of file diff --git a/src/app/components/Navigation.tsx b/src/app/components/Navigation.tsx index 0efb4c2..1d82984 100644 --- a/src/app/components/Navigation.tsx +++ b/src/app/components/Navigation.tsx @@ -2,19 +2,42 @@ import Link from 'next/link'; import { useState } from 'react'; +import { useTheme } from '../contexts/ThemeContext'; +import ContactModal from './ContactModal'; export default function Navigation() { const [isMenuOpen, setIsMenuOpen] = useState(false); + const [isProductsOpen, setIsProductsOpen] = useState(false); + const [isContactModalOpen, setIsContactModalOpen] = useState(false); + const { theme, toggleTheme } = useTheme(); + + const productItems = [ + { + category: 'Безопасность', + items: [ + { href: '/ux-software', label: 'UX-софт', description: 'Улучшение пользовательского опыта', icon: '🔒' }, + { href: '/secure-t', label: 'Secure-T', description: 'Комплексная защита', icon: '🛡️' }, + { href: '/drweb', label: 'Dr.Web', description: 'Антивирусная защита', icon: '🔧' }, + ] + }, + { + category: 'Разработка', + items: [ + { href: '/development', label: 'Веб-разработка', description: 'Сайты и приложения', icon: '💻' }, + { href: '/solovey', label: 'Соловей', description: 'Платформа видеосвязи', icon: '🐦' }, + ] + }, + { + category: 'Поставки', + items: [ + { href: '/electronics', label: 'Электроника', description: 'B2B/B2G поставки', icon: '⚡' }, + ] + } + ]; const menuItems = [ - { href: '/', label: 'Главная' }, - { href: '/ux-software', label: 'UX Софт' }, - { href: '/secure-t', label: 'Secure-T' }, - { href: '/drweb', label: 'Dr.Web' }, - { href: '/development', label: 'Разработка' }, - { href: '/electronics', label: 'Электроника' }, - { href: '/solovey', label: 'Соловей' }, - { href: '/about', label: 'О нас' }, + { href: '/about', label: 'О компании' }, + { href: '/contacts', label: 'Контакты' }, ]; return ( @@ -28,6 +51,55 @@ export default function Navigation() { {/* Desktop Menu */}
+ {/* Продукты с выпадающим меню */} +
setIsProductsOpen(true)} + onMouseLeave={() => setIsProductsOpen(false)} + > + + + {/* Улучшенное выпадающее меню с категориями */} + {isProductsOpen && ( +
+
+ {productItems.map((category, categoryIndex) => ( +
0 ? 'border-t border-gray-600/20 mt-2 pt-2' : ''}> +
+

+ {category.category} +

+
+ {category.items.map((item) => ( + + + {item.icon} + +
+
{item.label}
+
{item.description}
+
+ + ))} +
+
+
+ ))} +
+
+ )} +
+ + {/* Остальные пункты меню */} {menuItems.map((item) => ( ))} + + {/* Кнопка "Оставить заявку" */} + + + {/* Улучшенный переключатель темы */} +
+ +
{/* Mobile Menu Button */} -
+
+ {/* Мобильная кнопка "Оставить заявку" */} + + + {/* Мобильный переключатель темы */} + +
- {/* Mobile Menu */} + {/* Улучшенное мобильное меню */} {isMenuOpen && (
- {menuItems.map((item) => ( - setIsMenuOpen(false)} - > - {item.label} - + {/* Мобильные продукты по категориям */} + {productItems.map((category, categoryIndex) => ( +
0 ? 'border-t border-gray-600/20 pt-2 mt-2' : ''} pb-2`}> +
+ {category.category} +
+ {category.items.map((item) => ( + setIsMenuOpen(false)} + > + {item.icon} +
+
{item.label}
+
{item.description}
+
+ + ))} +
))} + + {/* Основные пункты меню */} +
+ {menuItems.map((item) => ( + setIsMenuOpen(false)} + > + {item.label} + + ))} + + {/* Кнопка "Оставить заявку" в мобильном меню */} + +
)}
+ + {/* Модальное окно контактов */} + setIsContactModalOpen(false)} + defaultType="sales" + title="Оставить заявку" + /> ); } \ No newline at end of file diff --git a/src/app/contacts/page.tsx b/src/app/contacts/page.tsx new file mode 100644 index 0000000..6e7fb14 --- /dev/null +++ b/src/app/contacts/page.tsx @@ -0,0 +1,460 @@ +'use client'; + +import { useState, useEffect } from 'react'; +import Navigation from '../components/Navigation'; + +export default function Contacts() { + const [isFormOpen, setIsFormOpen] = useState(false); + const [formData, setFormData] = useState({ + name: '', + email: '', + phone: '', + company: '', + message: '', + type: 'general' + }); + const [hoveredCard, setHoveredCard] = useState(null); + const [copySuccess, setCopySuccess] = useState(null); + + // Анимация появления + useEffect(() => { + const style = document.createElement('style'); + style.textContent = ` + @keyframes slide-in-up { + from { transform: translateY(30px); opacity: 0; } + to { transform: translateY(0); opacity: 1; } + } + @keyframes contact-glow { + 0%, 100% { box-shadow: 0 0 20px rgba(0, 255, 136, 0.2); } + 50% { box-shadow: 0 0 30px rgba(0, 255, 136, 0.4); } + } + @keyframes copy-feedback { + 0% { transform: scale(1); } + 50% { transform: scale(1.1); } + 100% { transform: scale(1); } + } + .animate-slide-in-up { animation: slide-in-up 0.6s ease-out; } + .animate-contact-glow { animation: contact-glow 3s ease-in-out infinite; } + .animate-copy-feedback { animation: copy-feedback 0.3s ease-out; } + `; + document.head.appendChild(style); + return () => { + document.head.removeChild(style); + }; + }, []); + + const handleInputChange = (e: React.ChangeEvent) => { + const { name, value } = e.target; + setFormData(prev => ({ + ...prev, + [name]: value + })); + }; + + const handleSubmit = (e: React.FormEvent) => { + e.preventDefault(); + alert(`Спасибо за обращение, ${formData.name}! Мы свяжемся с вами в ближайшее время.`); + setFormData({ name: '', email: '', phone: '', company: '', message: '', type: 'general' }); + setIsFormOpen(false); + }; + + const copyToClipboard = async (text: string, type: string) => { + try { + await navigator.clipboard.writeText(text); + setCopySuccess(type); + setTimeout(() => setCopySuccess(null), 2000); + } catch (err) { + console.error('Ошибка копирования:', err); + } + }; + + const contactTypes = [ + { id: 'general', label: 'Общие вопросы', icon: '💬' }, + { id: 'sales', label: 'Отдел продаж', icon: '💼' }, + { id: 'support', label: 'Техподдержка', icon: '🔧' }, + { id: 'partnership', label: 'Партнёрство', icon: '🤝' } + ]; + + return ( + <> + + + {/* Hero Section */} +
+
+
+
+
+
+ +
+
+

+ Контакты +

+

+ Свяжитесь с нами любым удобным способом. Мы всегда готовы ответить на ваши вопросы. +

+
+ + {/* Быстрые контакты */} +
+
copyToClipboard('+7 (495) 123-45-67', 'phone')} + onMouseEnter={() => setHoveredCard('phone')} + onMouseLeave={() => setHoveredCard(null)} + > +
📞
+

Телефон

+

+7 (495) 123-45-67

+ {copySuccess === 'phone' && ( +

Скопировано!

+ )} + {hoveredCard === 'phone' && ( +

Нажмите для копирования

+ )} +
+ +
copyToClipboard('info@gundyrev.ru', 'email')} + onMouseEnter={() => setHoveredCard('email')} + onMouseLeave={() => setHoveredCard(null)} + > +
📧
+

Email

+

info@gundyrev.ru

+ {copySuccess === 'email' && ( +

Скопировано!

+ )} + {hoveredCard === 'email' && ( +

Нажмите для копирования

+ )} +
+ +
+
🕒
+

Режим работы

+

Пн-Пт: 9:00-18:00

+

МСК

+
+
+ + +
+
+ + {/* Детальные контакты */} +
+
+
+

+ Полная информация +

+

+ Вся необходимая информация для связи с нашими отделами +

+
+ +
+ {/* Контактные отделы */} +
+

Отделы компании

+ +
+
+ 💼 +

Отдел продаж

+
+
+

📞 +7 (495) 123-45-67 доб. 101

+

copyToClipboard('sales@gundyrev.ru', 'sales-email')} + > + 📧 sales@gundyrev.ru + {copySuccess === 'sales-email' && } +

+

👤 Менеджер: Иван Петров

+
+
+ +
+
+ 🔧 +

Техническая поддержка

+
+
+

📞 +7 (495) 123-45-67 доб. 102

+

copyToClipboard('support@gundyrev.ru', 'support-email')} + > + 📧 support@gundyrev.ru + {copySuccess === 'support-email' && } +

+

⏰ 24/7 для критических задач

+
+
+ +
+
+ 📊 +

Бухгалтерия

+
+
+

📞 +7 (495) 123-45-67 доб. 103

+

copyToClipboard('accounting@gundyrev.ru', 'accounting-email')} + > + 📧 accounting@gundyrev.ru + {copySuccess === 'accounting-email' && } +

+

👤 Главный бухгалтер: Елена Сидорова

+

⏰ Пн-Пт: 9:00-17:00

+
+
+ +
+
+ 🤝 +

Партнёрство

+
+
+

📞 +7 (495) 123-45-67 доб. 104

+

copyToClipboard('partners@gundyrev.ru', 'partners-email')} + > + 📧 partners@gundyrev.ru + {copySuccess === 'partners-email' && } +

+

👤 Директор по развитию: Анна Козлова

+
+
+
+ + {/* Юридическая информация */} +
+

Юридическая информация

+ +
+
+

Полное наименование

+

+ Общество с ограниченной ответственностью "ГУНДЫРЕВ" +

+
+ +
+

Юридический адрес

+

+ 123456, г. Москва, ул. Примерная, д. 1, стр. 1, оф. 101 +

+
+ +
+
+

ИНН

+

copyToClipboard('7701234567', 'inn')} + > + 7701234567 + {copySuccess === 'inn' && } +

+
+
+

КПП

+

copyToClipboard('770101001', 'kpp')} + > + 770101001 + {copySuccess === 'kpp' && } +

+
+
+ +
+

ОГРН

+

copyToClipboard('1234567890123', 'ogrn')} + > + 1234567890123 + {copySuccess === 'ogrn' && } +

+
+ +
+

Банковские реквизиты

+
+
+ Р/С: + copyToClipboard('40702810123456789012', 'rs')} + > + 40702810123456789012 + {copySuccess === 'rs' && } + +
+
+ К/С: + copyToClipboard('30101810123456789012', 'ks')} + > + 30101810123456789012 + {copySuccess === 'ks' && } + +
+
+ БИК: + copyToClipboard('123456789', 'bik')} + > + 123456789 + {copySuccess === 'bik' && } + +
+

+ ПАО "Банк ПРИМЕРНЫЙ", г. Москва +

+
+
+ +
+

Генеральный директор

+

Гундырев Александр Владимирович

+
+
+
+
+
+
+ + {/* Модальное окно формы */} + {isFormOpen && ( +
+
+
+

Связаться с нами

+ +
+ +
+
+ + +
+ +
+ + +
+ +
+ + +
+ +
+ + +
+ +
+ + +
+ +
+ + +
+ + +
+
+
+ )} + + ); +} \ No newline at end of file diff --git a/src/app/contexts/ThemeContext.tsx b/src/app/contexts/ThemeContext.tsx new file mode 100644 index 0000000..0e5e871 --- /dev/null +++ b/src/app/contexts/ThemeContext.tsx @@ -0,0 +1,53 @@ +'use client'; + +import React, { createContext, useContext, useState, useEffect } from 'react'; + +type Theme = 'light' | 'dark'; + +interface ThemeContextType { + theme: Theme; + toggleTheme: () => void; +} + +const ThemeContext = createContext(undefined); + +export const useTheme = () => { + const context = useContext(ThemeContext); + if (context === undefined) { + throw new Error('useTheme must be used within a ThemeProvider'); + } + return context; +}; + +export const ThemeProvider: React.FC<{ children: React.ReactNode }> = ({ children }) => { + const [theme, setTheme] = useState('dark'); + + useEffect(() => { + // Проверяем сохраненную тему в localStorage + const savedTheme = localStorage.getItem('theme') as Theme; + if (savedTheme) { + setTheme(savedTheme); + } else { + // Проверяем системную тему + const systemTheme = window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light'; + setTheme(systemTheme); + } + }, []); + + useEffect(() => { + // Применяем тему к документу + document.documentElement.classList.remove('light', 'dark'); + document.documentElement.classList.add(theme); + localStorage.setItem('theme', theme); + }, [theme]); + + const toggleTheme = () => { + setTheme(prevTheme => prevTheme === 'light' ? 'dark' : 'light'); + }; + + return ( + + {children} + + ); +}; \ No newline at end of file diff --git a/src/app/drweb/page.tsx b/src/app/drweb/page.tsx index deda8f7..7421ee4 100644 --- a/src/app/drweb/page.tsx +++ b/src/app/drweb/page.tsx @@ -1,6 +1,7 @@ 'use client'; import Navigation from '../components/Navigation'; +import LicenseCalculator from '../components/LicenseCalculator'; import { useState, useEffect } from 'react'; export default function DrWeb() { @@ -489,44 +490,7 @@ export default function DrWeb() { - {/* Интерактивная карта угроз */} -
-

- Глобальная карта угроз -

-
- {/* Имитация карты мира */} -
-
🌍
-
- - {/* Анимированные точки угроз */} -
-
-
-
-
- - {/* Защищенные зоны */} -
-
-
- -
-
-
- Активные угрозы -
-
-
- Защищенные зоны -
-
-
- Мониторинг -
-
-
+ @@ -693,124 +657,9 @@ export default function DrWeb() { - {/* Brand Guidelines */} -
-
-
-

- Брендбук Dr.Web -

-

- Соблюдение фирменного стиля и требований бренда Dr.Web -

-
-
-
-

Фирменные цвета

-
-
-
-
-

Dr.Web Green

-

#00B04F

-
-
-
-
-
-

Dr.Web Dark

-

#2C2C2C

-
-
-
-
-
-

Dr.Web White

-

#FFFFFF

-
-
-
-
-
-

Логотип

-
-
-
- Dr -
- Dr.Web -
-

- Официальный логотип Dr.Web должен использоваться без изменений -

-
-
-
-
-

Правила использования бренда

-
-
-

✓ Разрешено:

-
    -
  • • Использование официального логотипа
  • -
  • • Соблюдение фирменных цветов
  • -
  • • Указание статуса партнера
  • -
  • • Размещение сертификатов
  • -
-
-
-

✗ Запрещено:

-
    -
  • • Изменение логотипа
  • -
  • • Использование неофициальных цветов
  • -
  • • Искажение пропорций
  • -
  • • Нарушение позиционирования
  • -
-
-
-
-
-
- - {/* Partnership */} -
-
-
-

- Партнерство с Dr.Web -

-
- -
-
-
🏆
-

Сертифицированный партнер

-

- Официальный статус партнера Dr.Web с подтвержденной компетенцией -

-
- -
-
🎓
-

Обученные специалисты

-

- Наши эксперты прошли официальное обучение по продуктам Dr.Web -

-
- -
-
🛠️
-

Техническая поддержка

-

- Полная техническая поддержка внедрения и использования решений -

-
-
-
-
{/* Contact Section */}
@@ -840,6 +689,13 @@ export default function DrWeb() {
+ {/* License Calculator Section */} +
+
+ +
+
+ {/* Footer */}
diff --git a/src/app/globals.css b/src/app/globals.css index b9cd6ff..bcd5059 100644 --- a/src/app/globals.css +++ b/src/app/globals.css @@ -6,6 +6,32 @@ --accent: #00ff88; --gray: #333333; --light-gray: #666666; + --glass-bg: rgba(255, 255, 255, 0.05); + --glass-border: rgba(255, 255, 255, 0.1); + --card-bg: rgba(255, 255, 255, 0.03); + --text-primary: #ffffff; + --text-secondary: #d1d5db; + --text-muted: #9ca3af; +} + +.light { + --background: #ffffff; + --foreground: #1a1a1a; + --accent: #0066cc; + --accent-secondary: #00a8ff; + --accent-tertiary: #667eea; + --gray: #f8fafc; + --light-gray: #e2e8f0; + --glass-bg: rgba(255, 255, 255, 0.85); + --glass-border: rgba(59, 130, 246, 0.1); + --card-bg: rgba(248, 250, 252, 0.8); + --text-primary: #1a202c; + --text-secondary: #4a5568; + --text-muted: #718096; + --shadow-color: rgba(59, 130, 246, 0.1); + --gradient-primary: linear-gradient(135deg, #667eea 0%, #764ba2 100%); + --gradient-secondary: linear-gradient(135deg, #00a8ff 0%, #0078ff 100%); + --gradient-accent: linear-gradient(135deg, #f093fb 0%, #f5576c 100%); } @theme inline { @@ -23,7 +49,8 @@ body { color: var(--foreground); font-family: var(--font-sans), Arial, Helvetica, sans-serif; line-height: 1.6; - overflow-x: hidden; /* Предотвращаем горизонтальную прокрутку */ + overflow-x: hidden; + transition: background-color 0.3s ease, color 0.3s ease; } * { @@ -37,21 +64,169 @@ body { background-clip: text; } +.light .gradient-text { + background: linear-gradient(135deg, #667eea 0%, #764ba2 50%, #f093fb 100%); + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; + background-clip: text; + filter: drop-shadow(0 2px 4px rgba(102, 126, 234, 0.3)); +} + .glass-effect { - background: rgba(255, 255, 255, 0.05); + background: var(--glass-bg); backdrop-filter: blur(10px); - border: 1px solid rgba(255, 255, 255, 0.1); + border: 1px solid var(--glass-border); + transition: background-color 0.3s ease, border-color 0.3s ease; +} + +.light .glass-effect { + backdrop-filter: blur(10px); + box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1); +} + +/* Унифицированные эффекты свечения */ +.hover-glow { + transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); } .hover-glow:hover { - box-shadow: 0 0 20px rgba(0, 255, 136, 0.3); - transition: all 0.3s ease; + box-shadow: + 0 0 20px rgba(0, 255, 136, 0.3), + 0 0 40px rgba(0, 255, 136, 0.1), + 0 4px 20px rgba(0, 0, 0, 0.1); + transform: translateY(-2px); +} + +.light .hover-glow:hover { + box-shadow: + 0 0 20px rgba(0, 204, 106, 0.3), + 0 0 40px rgba(0, 204, 106, 0.1), + 0 4px 20px rgba(0, 0, 0, 0.1); +} + +/* Специализированные эффекты свечения для разных элементов */ +.glow-green { + box-shadow: 0 0 15px rgba(16, 185, 129, 0.4); +} + +.glow-blue { + box-shadow: 0 0 15px rgba(59, 130, 246, 0.4); +} + +.glow-purple { + box-shadow: 0 0 15px rgba(139, 92, 246, 0.4); +} + +.glow-red { + box-shadow: 0 0 15px rgba(239, 68, 68, 0.4); +} + +.glow-orange { + box-shadow: 0 0 15px rgba(249, 115, 22, 0.4); +} + +/* Анимированное свечение */ +.pulse-glow { + animation: pulse-glow 2s ease-in-out infinite; +} + +@keyframes pulse-glow { + 0%, 100% { + box-shadow: 0 0 15px rgba(0, 255, 136, 0.4); + } + 50% { + box-shadow: 0 0 25px rgba(0, 255, 136, 0.6); + } } .section-padding { padding: 80px 0; } +/* Улучшенная кнопка переключения темы */ +.theme-toggle { + position: relative; + width: 60px; + height: 30px; + background: var(--glass-bg); + border: 1px solid var(--glass-border); + border-radius: 15px; + cursor: pointer; + transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1); + display: flex; + align-items: center; + justify-content: space-between; + padding: 0 8px; + overflow: hidden; +} + +.theme-toggle:hover { + background: var(--glass-bg); + border-color: var(--accent); + box-shadow: 0 0 15px rgba(0, 255, 136, 0.3); + transform: scale(1.05); +} + +.light .theme-toggle:hover { + box-shadow: + 0 0 20px rgba(102, 126, 234, 0.4), + 0 0 40px rgba(118, 75, 162, 0.2); + border-color: rgba(102, 126, 234, 0.5); +} + +.theme-toggle::before { + content: ''; + position: absolute; + width: 22px; + height: 22px; + background: linear-gradient(135deg, var(--accent), #00cc6a); + border-radius: 50%; + top: 3px; + left: 4px; + transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1); + box-shadow: + 0 2px 8px rgba(0, 0, 0, 0.3), + 0 0 10px var(--accent); + z-index: 2; +} + +.light .theme-toggle::before { + background: linear-gradient(135deg, #f59e0b, #f97316); + box-shadow: + 0 2px 8px rgba(0, 0, 0, 0.2), + 0 0 15px rgba(249, 115, 22, 0.6), + 0 0 30px rgba(245, 158, 11, 0.3); +} + +.theme-toggle.light::before { + transform: translateX(26px); +} + +.theme-toggle-icon { + font-size: 14px; + color: var(--text-muted); + z-index: 1; + transition: all 0.3s ease; + opacity: 0.7; +} + +.light .theme-toggle-icon { + color: #6b7280; +} + +/* Анимация иконок будет управляться через JavaScript в компоненте */ + +.theme-toggle:active { + transform: scale(0.98); +} + +/* Плавные переходы для всех элементов при смене темы */ +* { + transition-property: background-color, border-color, color, fill, stroke, opacity, box-shadow, transform; + transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); + transition-duration: 0.3s; +} + /* Анимации для интерактивных элементов */ @keyframes float { 0%, 100% { @@ -96,6 +271,13 @@ body { 0 0 30px rgba(0, 255, 136, 0.2); } +.light .holographic-text { + text-shadow: + 0 0 10px rgba(0, 204, 106, 0.5), + 0 0 20px rgba(0, 204, 106, 0.3), + 0 0 30px rgba(0, 204, 106, 0.2); +} + .holographic-text::before { content: attr(data-text); position: absolute; @@ -108,6 +290,10 @@ body { z-index: -1; } +.light .holographic-text::before { + background: linear-gradient(45deg, transparent, rgba(0, 204, 106, 0.1), transparent); +} + @keyframes hologram-scan { 0% { transform: translateX(-100%); @@ -154,6 +340,19 @@ body { } } +.light .counter-active { + animation: counter-glow-light 2s ease-in-out infinite; +} + +@keyframes counter-glow-light { + 0%, 100% { + box-shadow: 0 0 5px rgba(0, 204, 106, 0.3); + } + 50% { + box-shadow: 0 0 20px rgba(0, 204, 106, 0.6); + } +} + .counter-active { animation: counter-glow 2s ease-in-out infinite; } @@ -517,4 +716,1486 @@ body { .hover-lift:hover { transform: none; } -} \ No newline at end of file +} + +/* Выпадающее меню продуктов */ +.dropdown-menu { + animation: dropdown-fade-in 0.2s ease-out; + z-index: 1000; + background: rgba(17, 24, 39, 0.95); + backdrop-filter: blur(20px); + border: 1px solid rgba(75, 85, 99, 0.3); + box-shadow: + 0 10px 25px rgba(0, 0, 0, 0.5), + 0 0 20px rgba(0, 255, 136, 0.1); +} + +.dropdown-menu .hover\:bg-gray-700\/30:hover { + background-color: rgba(55, 65, 81, 0.5) !important; +} + +@keyframes dropdown-fade-in { + from { + opacity: 0; + transform: translateY(-10px); + } + to { + opacity: 1; + transform: translateY(0); + } +} + +/* === УНИКАЛЬНЫЙ ДИЗАЙН ДЛЯ СВЕТЛОЙ ТЕМЫ === */ + +/* Основной фон с красивым градиентом */ +.light body { + background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); + background-attachment: fixed; +} + +.light .min-h-screen { + background: linear-gradient(135deg, + rgba(102, 126, 234, 0.1) 0%, + rgba(118, 75, 162, 0.1) 25%, + rgba(255, 255, 255, 0.9) 50%, + rgba(240, 249, 255, 0.9) 75%, + rgba(248, 250, 252, 1) 100% + ) !important; +} + +/* Уникальный стеклянный эффект */ +.light .glass-effect { + background: linear-gradient(135deg, + rgba(255, 255, 255, 0.9) 0%, + rgba(248, 250, 252, 0.8) 100% + ); + backdrop-filter: blur(20px) saturate(180%); + border: 1px solid rgba(59, 130, 246, 0.2); + box-shadow: + 0 8px 32px rgba(59, 130, 246, 0.1), + 0 4px 16px rgba(0, 0, 0, 0.05), + inset 0 1px 0 rgba(255, 255, 255, 0.8); +} + +/* Уникальные hover эффекты */ +.light .hover-glow:hover { + box-shadow: + 0 0 30px rgba(102, 126, 234, 0.3), + 0 0 60px rgba(118, 75, 162, 0.2), + 0 8px 32px rgba(59, 130, 246, 0.15); + transform: translateY(-4px); + border-color: rgba(102, 126, 234, 0.4); +} + +/* Стили для карточек в светлой теме */ +.light .card-bg { + background: rgba(0, 0, 0, 0.02); + border: 1px solid rgba(0, 0, 0, 0.08); +} + +/* Переходы для текста */ +.light h1, .light h2, .light h3, .light h4, .light h5, .light h6 { + color: var(--text-primary); +} + +.light p, .light span { + color: var(--text-secondary); +} + +.light .text-gray-300 { + color: var(--text-secondary) !important; +} + +.light .text-gray-400 { + color: var(--text-muted) !important; +} + +.light .text-gray-500 { + color: var(--text-muted) !important; +} + +/* Уникальная навигация для светлой темы */ +.light nav { + background: linear-gradient(135deg, + rgba(255, 255, 255, 0.95) 0%, + rgba(248, 250, 252, 0.9) 100% + ); + backdrop-filter: blur(20px) saturate(180%); + border-bottom: 1px solid rgba(102, 126, 234, 0.2); + box-shadow: + 0 4px 16px rgba(102, 126, 234, 0.1), + 0 2px 8px rgba(0, 0, 0, 0.05); +} + +/* Стили для кнопок в светлой теме */ +.light .bg-blue-500 { + background-color: #3b82f6; +} + +.light .bg-blue-600 { + background-color: #2563eb; +} + +.light .bg-purple-500 { + background-color: #8b5cf6; +} + +.light .bg-purple-600 { + background-color: #7c3aed; +} + +.light .bg-gray-900 { + background-color: #f9fafb; +} + +.light .bg-gray-800 { + background-color: #f3f4f6; +} + +.light .bg-gray-700 { + background-color: #e5e7eb; +} + +/* Стили для секций в светлой теме */ +.light .section-bg-dark { + background: linear-gradient(135deg, #f9fafb 0%, #f3f4f6 100%); +} + +.light .section-bg-gradient { + background: linear-gradient(135deg, #ffffff 0%, #f9fafb 50%, #f3f4f6 100%); +} + +/* === СТИЛИ ТЕКСТА ДЛЯ СВЕТЛОЙ ТЕМЫ === */ + +/* Цвета текста в навигации */ +.light nav .text-gray-300 { + color: var(--text-secondary) !important; + font-weight: 500; +} + +.light nav .text-gray-300:hover, +.light nav .hover\:text-white:hover { + color: var(--text-primary) !important; + text-shadow: 0 1px 2px rgba(102, 126, 234, 0.2); +} + +/* Уникальное выпадающее меню */ +.light .dropdown-menu { + background: linear-gradient(135deg, + rgba(255, 255, 255, 0.98) 0%, + rgba(248, 250, 252, 0.95) 100% + ); + border: 1px solid rgba(102, 126, 234, 0.2); + box-shadow: + 0 20px 40px rgba(102, 126, 234, 0.15), + 0 10px 20px rgba(0, 0, 0, 0.1), + inset 0 1px 0 rgba(255, 255, 255, 0.9); + backdrop-filter: blur(20px) saturate(180%); +} + +.light .dropdown-menu .text-gray-400 { + color: var(--text-muted) !important; + font-weight: 500; +} + +.light .dropdown-menu .text-gray-300 { + color: var(--text-secondary) !important; + font-weight: 500; +} + +.light .dropdown-menu .hover\:text-white:hover { + color: var(--text-primary) !important; + text-shadow: 0 1px 2px rgba(102, 126, 234, 0.2); +} + +.light .dropdown-menu .hover\:bg-gray-700\/30:hover { + background: linear-gradient(135deg, + rgba(102, 126, 234, 0.1) 0%, + rgba(118, 75, 162, 0.08) 100% + ) !important; + border-radius: 8px; +} + +.light .dropdown-menu .border-gray-600\/20 { + border-color: rgba(102, 126, 234, 0.15) !important; +} + +/* Исправление мобильного меню */ +.light .md\:hidden .glass-effect { + background: rgba(255, 255, 255, 0.95); +} + +.light .md\:hidden .text-gray-300 { + color: #4b5563 !important; +} + +.light .md\:hidden .text-gray-400 { + color: #6b7280 !important; +} + +.light .md\:hidden .hover\:bg-gray-700\/30:hover { + background-color: rgba(0, 0, 0, 0.05) !important; +} + +/* Исправление счетчиков и карточек */ +.light .text-gray-400 { + color: #6b7280 !important; +} + +.light .bg-gray-700 { + background-color: #d1d5db !important; +} + +/* Исправление границ */ +.light .border-gray-600\/20 { + border-color: rgba(0, 0, 0, 0.1) !important; +} + +/* Исправление кнопок и интерактивных элементов */ +.light button, +.light .hover\:text-white:hover { + color: inherit; +} + +.light button.text-gray-300 { + color: #4b5563 !important; +} + +/* === УНИКАЛЬНЫЕ ХОЛОГРАФИЧЕСКИЕ ЭФФЕКТЫ === */ + +.light .holographic-text { + text-shadow: + 0 0 20px rgba(102, 126, 234, 0.4), + 0 0 40px rgba(118, 75, 162, 0.3), + 0 0 60px rgba(240, 147, 251, 0.2); + filter: drop-shadow(0 4px 8px rgba(102, 126, 234, 0.2)); +} + +.light .holographic-text::before { + background: linear-gradient(135deg, + rgba(102, 126, 234, 0.1) 0%, + rgba(118, 75, 162, 0.1) 50%, + rgba(240, 147, 251, 0.1) 100% + ); +} + +/* Исправление loading эффектов */ +.light .bg-gradient-to-br { + background: linear-gradient(135deg, #ffffff 0%, #f9fafb 50%, #f3f4f6 100%) !important; +} + +.light .from-black, +.light .via-gray-900, +.light .to-black { + --tw-gradient-from: #ffffff !important; + --tw-gradient-to: #f3f4f6 !important; + --tw-gradient-via: #f9fafb !important; +} + +/* === УНИКАЛЬНЫЕ ГРАДИЕНТЫ И ЭФФЕКТЫ === */ + +.light .from-transparent { + --tw-gradient-from: rgba(255, 255, 255, 0.1) !important; +} + +.light .to-gray-900\/30 { + --tw-gradient-to: rgba(102, 126, 234, 0.1) !important; +} + +.light .bg-gradient-to-b { + background: linear-gradient(to bottom, + rgba(255, 255, 255, 0.1) 0%, + rgba(102, 126, 234, 0.05) 50%, + rgba(118, 75, 162, 0.1) 100% + ) !important; +} + +/* Акцентные цвета для светлой темы */ +.light .border-green-400 { + border-color: var(--accent) !important; +} + +.light .text-green-400 { + color: var(--accent) !important; +} + +.light .bg-green-400 { + background: linear-gradient(135deg, var(--accent) 0%, var(--accent-secondary) 100%) !important; +} + +/* === УНИВЕРСАЛЬНЫЕ ЦВЕТА ТЕКСТА === */ + +.light .text-gray-300 { + color: var(--text-secondary) !important; +} + +.light .text-gray-400 { + color: var(--text-muted) !important; +} + +.light .text-white { + color: var(--text-primary) !important; +} + +/* === УНИКАЛЬНЫЕ ЧАСТИЦЫ И ИНТЕРАКТИВНЫЕ ЭЛЕМЕНТЫ === */ + +.light .bg-green-400 { + background: radial-gradient(circle, var(--accent) 0%, var(--accent-secondary) 100%) !important; + box-shadow: 0 0 20px rgba(102, 126, 234, 0.4) !important; +} + +/* === УНИКАЛЬНЫЕ КНОПКИ ДЛЯ СВЕТЛОЙ ТЕМЫ === */ + +/* Основные градиентные кнопки */ +.light .from-green-500 { + --tw-gradient-from: #667eea !important; +} + +.light .to-emerald-500 { + --tw-gradient-to: #764ba2 !important; +} + +.light .from-blue-500 { + --tw-gradient-from: #00a8ff !important; +} + +.light .to-indigo-500 { + --tw-gradient-to: #0078ff !important; +} + +.light .from-purple-500 { + --tw-gradient-from: #f093fb !important; +} + +.light .to-pink-500 { + --tw-gradient-to: #f5576c !important; +} + +/* Уникальные стили для кнопок */ +.light button { + box-shadow: + 0 4px 16px rgba(102, 126, 234, 0.2), + 0 2px 8px rgba(0, 0, 0, 0.1); + border-radius: 12px; + transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); +} + +.light button:hover { + transform: translateY(-2px); + box-shadow: + 0 8px 32px rgba(102, 126, 234, 0.3), + 0 4px 16px rgba(0, 0, 0, 0.15); +} + +/* === УНИКАЛЬНЫЕ ПОЛОСЫ ПРОГРЕССА === */ + +.light .from-green-400 { + --tw-gradient-from: #667eea !important; +} + +.light .to-blue-400 { + --tw-gradient-to: #00a8ff !important; +} + +.light .from-purple-400 { + --tw-gradient-from: #f093fb !important; +} + +.light .to-pink-400 { + --tw-gradient-to: #f5576c !important; +} + +.light .from-cyan-400 { + --tw-gradient-from: #00a8ff !important; +} + +.light .to-teal-400 { + --tw-gradient-to: #667eea !important; +} + +.light .from-amber-400 { + --tw-gradient-from: #f093fb !important; +} + +.light .to-orange-400 { + --tw-gradient-to: #f5576c !important; +} + +.light .to-orange-400 { + --tw-gradient-to: #f5576c !important; +} + +/* === ФИНАЛЬНЫЕ УНИКАЛЬНЫЕ СТИЛИ ДЛЯ СВЕТЛОЙ ТЕМЫ === */ + +/* Уникальные карточки */ +.light .card-bg { + background: linear-gradient(135deg, + rgba(255, 255, 255, 0.9) 0%, + rgba(248, 250, 252, 0.8) 100% + ) !important; + border: 1px solid rgba(102, 126, 234, 0.15) !important; + box-shadow: + 0 8px 32px rgba(102, 126, 234, 0.1), + 0 4px 16px rgba(0, 0, 0, 0.05) !important; +} + +/* Уникальные секции */ +.light .section-bg-dark { + background: linear-gradient(135deg, + rgba(255, 255, 255, 0.95) 0%, + rgba(248, 250, 252, 0.9) 50%, + rgba(240, 249, 255, 0.85) 100% + ) !important; +} + +.light .section-bg-gradient { + background: linear-gradient(135deg, + rgba(102, 126, 234, 0.05) 0%, + rgba(255, 255, 255, 0.9) 25%, + rgba(248, 250, 252, 0.9) 75%, + rgba(118, 75, 162, 0.05) 100% + ) !important; +} + +/* Уникальные границы */ +.light .border-gray-600\/20 { + border-color: rgba(102, 126, 234, 0.2) !important; +} + +.light .bg-gray-700 { + background: linear-gradient(135deg, + rgba(102, 126, 234, 0.2) 0%, + rgba(118, 75, 162, 0.15) 100% + ) !important; +} + +/* Мобильное меню */ +.light .md\:hidden .glass-effect { + background: linear-gradient(135deg, + rgba(255, 255, 255, 0.98) 0%, + rgba(248, 250, 252, 0.95) 100% + ) !important; + border: 1px solid rgba(102, 126, 234, 0.2) !important; + box-shadow: + 0 8px 32px rgba(102, 126, 234, 0.15), + 0 4px 16px rgba(0, 0, 0, 0.1) !important; +} + +.light .md\:hidden .text-gray-300 { + color: var(--text-secondary) !important; +} + +.light .md\:hidden .text-gray-400 { + color: var(--text-muted) !important; +} + +.light .md\:hidden .hover\:bg-gray-700\/30:hover { + background: linear-gradient(135deg, + rgba(102, 126, 234, 0.1) 0%, + rgba(118, 75, 162, 0.08) 100% + ) !important; +} + +/* Уникальные анимации для светлой темы */ +.light .animate-pulse { + animation: light-pulse 2s ease-in-out infinite; +} + +@keyframes light-pulse { + 0%, 100% { + opacity: 1; + filter: drop-shadow(0 0 10px rgba(102, 126, 234, 0.3)); + } + 50% { + opacity: 0.8; + filter: drop-shadow(0 0 20px rgba(118, 75, 162, 0.4)); + } +} + +/* Уникальные эффекты загрузки */ +.light .border-4.border-green-400 { + border-color: var(--accent) !important; + filter: drop-shadow(0 0 10px rgba(102, 126, 234, 0.4)); +} + +.light .border-t-transparent { + border-top-color: transparent !important; +} + +/* Улучшенные тени для всех элементов */ +.light * { + --tw-shadow-color: rgba(102, 126, 234, 0.1); +} + +/* Финальные штрихи */ +.light .bg-gradient-to-br { + background: linear-gradient(135deg, + rgba(102, 126, 234, 0.1) 0%, + rgba(255, 255, 255, 0.95) 25%, + rgba(248, 250, 252, 0.9) 75%, + rgba(118, 75, 162, 0.1) 100% + ) !important; +} + +.light .bg-gradient-to-br { + background: linear-gradient(135deg, + rgba(102, 126, 234, 0.1) 0%, + rgba(255, 255, 255, 0.95) 25%, + rgba(248, 250, 252, 0.9) 75%, + rgba(118, 75, 162, 0.1) 100% + ) !important; +} + +/* === СПЕЦИАЛЬНЫЕ СТИЛИ ДЛЯ VPN-СТРАНИЦЫ === */ + +/* Фон Hero секции */ +.light .from-blue-900 { + --tw-gradient-from: rgba(102, 126, 234, 0.1) !important; +} + +.light .via-black { + --tw-gradient-via: rgba(255, 255, 255, 0.9) !important; +} + +.light .to-purple-900 { + --tw-gradient-to: rgba(118, 75, 162, 0.1) !important; +} + +/* Фон секций */ +.light .bg-gray-900\/50 { + background: linear-gradient(135deg, + rgba(248, 250, 252, 0.95) 0%, + rgba(240, 249, 255, 0.9) 100% + ) !important; +} + +.light .bg-gray-800\/50 { + background: linear-gradient(135deg, + rgba(255, 255, 255, 0.9) 0%, + rgba(248, 250, 252, 0.8) 100% + ) !important; + border: 1px solid rgba(102, 126, 234, 0.1) !important; +} + +.light .bg-gray-800\/30 { + background: linear-gradient(135deg, + rgba(102, 126, 234, 0.05) 0%, + rgba(255, 255, 255, 0.8) 100% + ) !important; +} + +.light .bg-gray-800\/70 { + background: linear-gradient(135deg, + rgba(102, 126, 234, 0.1) 0%, + rgba(248, 250, 252, 0.9) 100% + ) !important; +} + +/* Карточки уведомлений */ +.light .bg-blue-900\/20 { + background: linear-gradient(135deg, + rgba(59, 130, 246, 0.1) 0%, + rgba(147, 197, 253, 0.05) 100% + ) !important; +} + +.light .bg-green-900\/20 { + background: linear-gradient(135deg, + rgba(34, 197, 94, 0.1) 0%, + rgba(134, 239, 172, 0.05) 100% + ) !important; +} + +.light .bg-purple-900\/20 { + background: linear-gradient(135deg, + rgba(147, 51, 234, 0.1) 0%, + rgba(196, 181, 253, 0.05) 100% + ) !important; +} + +/* Границы карточек */ +.light .border-blue-500\/30 { + border-color: rgba(59, 130, 246, 0.3) !important; +} + +.light .border-green-500\/30 { + border-color: rgba(34, 197, 94, 0.3) !important; +} + +.light .border-purple-500\/30 { + border-color: rgba(147, 51, 234, 0.3) !important; +} + +.light .border-yellow-500\/30 { + border-color: rgba(234, 179, 8, 0.3) !important; +} + +/* Цвета акцентов */ +.light .text-blue-400 { + color: #2563eb !important; +} + +.light .text-green-400 { + color: #16a34a !important; +} + +.light .text-purple-400 { + color: #9333ea !important; +} + +.light .text-yellow-400 { + color: #ca8a04 !important; +} + +.light .text-red-400 { + color: #dc2626 !important; +} + +.light .text-cyan-400 { + color: #0891b2 !important; +} + +/* Цвета для полос прогресса */ +.light .bg-purple-400 { + background: linear-gradient(135deg, #9333ea 0%, #a855f7 100%) !important; +} + +.light .bg-blue-400 { + background: linear-gradient(135deg, #2563eb 0%, #3b82f6 100%) !important; +} + +.light .bg-green-400 { + background: linear-gradient(135deg, #16a34a 0%, #22c55e 100%) !important; +} + +.light .bg-yellow-400 { + background: linear-gradient(135deg, #ca8a04 0%, #eab308 100%) !important; +} + +.light .bg-red-500 { + background: linear-gradient(135deg, #dc2626 0%, #ef4444 100%) !important; +} + +.light .bg-yellow-500 { + background: linear-gradient(135deg, #ca8a04 0%, #eab308 100%) !important; +} + +.light .bg-green-500 { + background: linear-gradient(135deg, #16a34a 0%, #22c55e 100%) !important; +} + +/* Градиенты для кнопок */ +.light .from-blue-600 { + --tw-gradient-from: #2563eb !important; +} + +.light .to-purple-600 { + --tw-gradient-to: #9333ea !important; +} + +.light .hover\:from-blue-700:hover { + --tw-gradient-from: #1d4ed8 !important; +} + +.light .hover\:to-purple-700:hover { + --tw-gradient-to: #7c3aed !important; +} + +/* Модальное окно */ +.light .bg-gray-900 { + background: linear-gradient(135deg, + rgba(255, 255, 255, 0.98) 0%, + rgba(248, 250, 252, 0.95) 100% + ) !important; + border: 1px solid rgba(102, 126, 234, 0.2) !important; + box-shadow: + 0 20px 40px rgba(102, 126, 234, 0.2), + 0 10px 20px rgba(0, 0, 0, 0.1) !important; +} + +.light .bg-gray-800 { + background: rgba(248, 250, 252, 0.9) !important; + border-color: rgba(102, 126, 234, 0.2) !important; +} + +.light .border-gray-600 { + border-color: rgba(102, 126, 234, 0.2) !important; +} + +.light .focus\:border-blue-500:focus { + border-color: var(--accent) !important; +} + +.light .bg-gray-600 { + background: linear-gradient(135deg, + rgba(102, 126, 234, 0.1) 0%, + rgba(156, 163, 175, 0.3) 100% + ) !important; +} + +.light .hover\:bg-gray-700:hover { + background: linear-gradient(135deg, + rgba(102, 126, 234, 0.2) 0%, + rgba(107, 114, 128, 0.4) 100% + ) !important; +} + +.light .bg-blue-500 { + background: linear-gradient(135deg, var(--accent) 0%, var(--accent-secondary) 100%) !important; +} + +.light .hover\:bg-blue-600:hover { + background: linear-gradient(135deg, #1d4ed8 0%, #0078ff 100%) !important; +} + +/* Footer */ +.light .bg-black { + background: linear-gradient(135deg, + rgba(102, 126, 234, 0.1) 0%, + rgba(30, 41, 59, 0.9) 100% + ) !important; +} + +/* Исправление размытых фонов */ +.light .blur-3xl { + filter: blur(60px) !important; + opacity: 0.1 !important; +} + +/* Специальные анимации для светлой темы */ +.light .animate-ux-pulse { + animation: light-ux-pulse 2s ease-in-out infinite !important; +} + +@keyframes light-ux-pulse { + 0%, 100% { + opacity: 1; + transform: scale(1); + filter: drop-shadow(0 0 10px rgba(102, 126, 234, 0.3)); + } + 50% { + opacity: 0.9; + transform: scale(1.05); + filter: drop-shadow(0 0 20px rgba(118, 75, 162, 0.4)); + } +} + +.light .animate-ux-glow { + animation: light-ux-glow 3s ease-in-out infinite !important; +} + +@keyframes light-ux-glow { + 0%, 100% { + box-shadow: 0 0 20px rgba(102, 126, 234, 0.2); + } + 50% { + box-shadow: 0 0 30px rgba(118, 75, 162, 0.3); + } +} + +/* === ДОПОЛНИТЕЛЬНЫЕ ИСПРАВЛЕНИЯ ДЛЯ VPN-СТРАНИЦЫ === */ + +/* Исправление градиентных фонов для секций */ +.light .from-blue-900\/20 { + --tw-gradient-from: rgba(59, 130, 246, 0.1) !important; +} + +.light .to-purple-900\/20 { + --tw-gradient-to: rgba(147, 51, 234, 0.1) !important; +} + +/* Исправление модального окна */ +.light .bg-black.bg-opacity-5 { + background-color: rgba(102, 126, 234, 0.1) !important; +} + +/* Исправление цветов текста */ +.light .text-gray-500 { + color: var(--text-muted) !important; +} + +.light .text-gray-200 { + color: var(--text-secondary) !important; +} + +/* Исправление hover эффектов */ +.light .hover\:text-gray-200:hover { + color: var(--text-primary) !important; +} + +/* Исправление серверных точек на карте */ +.light .animate-server-ping { + animation: light-server-ping 2s ease-in-out infinite !important; +} + +@keyframes light-server-ping { + 0%, 100% { + transform: scale(1); + opacity: 0.8; + filter: drop-shadow(0 0 8px rgba(102, 126, 234, 0.4)); + } + 50% { + transform: scale(1.3); + opacity: 1; + filter: drop-shadow(0 0 15px rgba(118, 75, 162, 0.6)); + } +} + +/* Исправление уведомлений */ +.light .animate-slide-in-ux { + animation: light-slide-in-ux 0.5s ease-out !important; +} + +@keyframes light-slide-in-ux { + from { + transform: translateX(20px); + opacity: 0; + filter: drop-shadow(0 0 10px rgba(102, 126, 234, 0.2)); + } + to { + transform: translateX(0); + opacity: 1; + filter: drop-shadow(0 0 20px rgba(118, 75, 162, 0.3)); + } +} + +/* Исправление анимации метрик */ +.light .animate-metric-count { + animation: light-metric-count 0.6s ease-out !important; +} + +@keyframes light-metric-count { + from { + transform: translateY(10px); + opacity: 0; + filter: drop-shadow(0 0 5px rgba(102, 126, 234, 0.2)); + } + to { + transform: translateY(0); + opacity: 1; + filter: drop-shadow(0 0 10px rgba(118, 75, 162, 0.3)); + } +} + +/* Исправление теней для кнопок */ +.light .hover\:shadow-lg:hover { + box-shadow: + 0 10px 25px rgba(102, 126, 234, 0.2), + 0 5px 10px rgba(0, 0, 0, 0.1) !important; +} + +.light .hover\:shadow-blue-500\/25:hover { + box-shadow: + 0 10px 25px rgba(59, 130, 246, 0.25), + 0 5px 10px rgba(102, 126, 234, 0.1) !important; +} + +/* Исправление активных состояний */ +.light .active\:scale-95:active { + transform: scale(0.95) !important; + filter: drop-shadow(0 0 15px rgba(102, 126, 234, 0.4)); +} + +/* Исправление полос прогресса в статистике */ +.light .from-green-500 { + --tw-gradient-from: #16a34a !important; +} + +.light .to-green-400 { + --tw-gradient-to: #22c55e !important; +} + +.light .from-blue-500 { + --tw-gradient-from: #2563eb !important; +} + +.light .to-blue-400 { + --tw-gradient-to: #3b82f6 !important; +} + +.light .from-purple-500 { + --tw-gradient-from: #9333ea !important; +} + +.light .to-purple-400 { + --tw-gradient-to: #a855f7 !important; +} + +.light .from-yellow-500 { + --tw-gradient-from: #ca8a04 !important; +} + +.light .to-yellow-400 { + --tw-gradient-to: #eab308 !important; +} + +/* Исправление цветов границ */ +.light .border-l-4 { + border-left-width: 4px !important; +} + +.light .border-blue-500 { + border-color: #2563eb !important; +} + +.light .border-green-500 { + border-color: #16a34a !important; +} + +.light .border-purple-500 { + border-color: #9333ea !important; +} + +/* Исправление opacity фонов */ +.light .opacity-30 { + opacity: 0.15 !important; +} + +.light .opacity-20 { + opacity: 0.1 !important; +} + +/* Исправление цветов для статистики */ +.light .text-2xl.font-bold.text-green-400 { + color: #16a34a !important; +} + +.light .text-2xl.font-bold.text-blue-400 { + color: #2563eb !important; +} + +.light .text-2xl.font-bold.text-purple-400 { + color: #9333ea !important; +} + +.light .text-2xl.font-bold.text-yellow-400 { + color: #ca8a04 !important; +} + +/* Исправление размытых элементов */ +.light .w-96.h-96.bg-blue-500 { + background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, rgba(59, 130, 246, 0.05) 100%) !important; +} + +.light .w-96.h-96.bg-purple-500 { + background: radial-gradient(circle, rgba(147, 51, 234, 0.1) 0%, rgba(147, 51, 234, 0.05) 100%) !important; +} + +/* === ИСПРАВЛЕНИЯ ДЛЯ ТЕХНИЧЕСКИХ ХАРАКТЕРИСТИК === */ + +/* Улучшение видимости белого текста */ +.light .text-white { + color: var(--text-primary) !important; + font-weight: 600 !important; +} + +.light .font-semibold { + color: var(--text-primary) !important; + font-weight: 600 !important; +} + +/* Исправление для элементов с белым текстом в характеристиках */ +.light .flex.justify-between.items-center .text-white { + color: var(--text-primary) !important; + font-weight: 600 !important; +} + +.light .flex.justify-between.items-center .font-semibold { + color: var(--text-primary) !important; + font-weight: 600 !important; +} + +/* Улучшение контрастности для всех элементов в карточках */ +.light .glass-effect .text-white { + color: var(--text-primary) !important; + font-weight: 600 !important; + text-shadow: none !important; +} + +.light .glass-effect .font-semibold { + color: var(--text-primary) !important; + font-weight: 600 !important; +} + +/* Специальные исправления для технических характеристик */ +.light .border-blue-500\/30 .text-white, +.light .border-green-500\/30 .text-white, +.light .border-purple-500\/30 .text-white, +.light .border-yellow-500\/30 .text-white { + color: var(--text-primary) !important; + font-weight: 600 !important; +} + +.light .border-blue-500\/30 .font-semibold, +.light .border-green-500\/30 .font-semibold, +.light .border-purple-500\/30 .font-semibold, +.light .border-yellow-500\/30 .font-semibold { + color: var(--text-primary) !important; + font-weight: 600 !important; +} + +/* Исправление для всех span элементов с белым текстом */ +.light span.text-white { + color: var(--text-primary) !important; + font-weight: 600 !important; +} + +.light span.font-semibold { + color: var(--text-primary) !important; + font-weight: 600 !important; +} + +/* Улучшение видимости текста в карточках статистики */ +.light .text-center.p-4 .text-sm { + color: var(--text-secondary) !important; + font-weight: 500 !important; +} + +.light .text-center.p-4 .font-bold { + color: var(--text-primary) !important; + font-weight: 700 !important; +} + +/* Исправление для всех заголовков */ +.light h3.text-2xl.font-bold { + color: var(--text-primary) !important; + font-weight: 700 !important; +} + +.light h3.text-xl.font-bold { + color: var(--text-primary) !important; + font-weight: 700 !important; +} + +/* Исправление для элементов с зеленой галочкой */ +.light .text-green-400.font-semibold { + color: #16a34a !important; + font-weight: 600 !important; +} + +/* Дополнительные исправления для лучшей читаемости */ +.light .space-y-4 .text-white, +.light .space-y-6 .text-white { + color: var(--text-primary) !important; + font-weight: 600 !important; +} + +.light .space-y-4 .font-semibold, +.light .space-y-6 .font-semibold { + color: var(--text-primary) !important; + font-weight: 600 !important; +} + +/* Исправление для всех div с белым текстом */ +.light div.text-white { + color: var(--text-primary) !important; + font-weight: 600 !important; +} + +.light div.font-semibold { + color: var(--text-primary) !important; + font-weight: 600 !important; +} + +/* Улучшение контрастности для важных элементов */ +.light .text-white.font-semibold { + color: var(--text-primary) !important; + font-weight: 700 !important; + text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1) !important; +} + +/* === ДОПОЛНИТЕЛЬНЫЕ ИСПРАВЛЕНИЯ ЧИТАЕМОСТИ === */ + +/* Исправление для всех элементов с классом text-white */ +.light *:where(.text-white) { + color: var(--text-primary) !important; + font-weight: 600 !important; +} + +/* Исправление для всех элементов с классом font-semibold */ +.light *:where(.font-semibold) { + color: var(--text-primary) !important; + font-weight: 600 !important; +} + +/* Глобальное исправление для всех белых текстов */ +.light [class*="text-white"] { + color: var(--text-primary) !important; + font-weight: 600 !important; +} + +.light [class*="font-semibold"] { + color: var(--text-primary) !important; + font-weight: 600 !important; +} + +/* Исправление для конкретных селекторов */ +.light .justify-between .text-white, +.light .items-center .text-white { + color: var(--text-primary) !important; + font-weight: 600 !important; +} + +.light .justify-between .font-semibold, +.light .items-center .font-semibold { + color: var(--text-primary) !important; + font-weight: 600 !important; +} + +/* Исправление для элементов внутри карточек */ +.light .glass-effect * { + color: inherit !important; +} + +.light .glass-effect .text-white { + color: var(--text-primary) !important; + font-weight: 600 !important; +} + +.light .glass-effect .font-semibold { + color: var(--text-primary) !important; + font-weight: 600 !important; +} + +/* Исправление для элементов с границами */ +.light .border-blue-500\/30 *, +.light .border-green-500\/30 *, +.light .border-purple-500\/30 *, +.light .border-yellow-500\/30 * { + color: inherit !important; +} + +.light .border-blue-500\/30 .text-white, +.light .border-green-500\/30 .text-white, +.light .border-purple-500\/30 .text-white, +.light .border-yellow-500\/30 .text-white { + color: var(--text-primary) !important; + font-weight: 600 !important; +} + +/* Принудительное исправление для всех проблемных элементов */ +.light .text-white, +.light .font-semibold, +.light span.text-white, +.light div.text-white, +.light span.font-semibold, +.light div.font-semibold { + color: var(--text-primary) !important; + font-weight: 600 !important; +} + +/* Исправление для элементов статистики */ +.light .text-2xl.font-bold { + color: var(--text-primary) !important; + font-weight: 700 !important; +} + +.light .text-xl.font-bold { + color: var(--text-primary) !important; + font-weight: 700 !important; +} + +/* Исправление для всех важных селекторов */ +.light .space-y-4 > * .text-white, +.light .space-y-6 > * .text-white { + color: var(--text-primary) !important; + font-weight: 600 !important; +} + +.light .space-y-4 > * .font-semibold, +.light .space-y-6 > * .font-semibold { + color: var(--text-primary) !important; + font-weight: 600 !important; +} + +/* === ОСВЕТЛЕНИЕ ФОНА КАРТОЧЕК === */ + +/* Значительно осветляем фон всех карточек */ +.light .glass-effect { + background: linear-gradient(135deg, + rgba(255, 255, 255, 0.98) 0%, + rgba(248, 250, 252, 0.95) 100% + ) !important; + backdrop-filter: blur(10px) saturate(120%) !important; + border: 1px solid rgba(102, 126, 234, 0.15) !important; + box-shadow: + 0 4px 16px rgba(102, 126, 234, 0.08), + 0 2px 8px rgba(0, 0, 0, 0.03), + inset 0 1px 0 rgba(255, 255, 255, 0.9) !important; +} + +/* Специально для карточек технических характеристик */ +.light .border-blue-500\/30 { + background: linear-gradient(135deg, + rgba(255, 255, 255, 0.98) 0%, + rgba(240, 249, 255, 0.95) 100% + ) !important; + border-color: rgba(59, 130, 246, 0.25) !important; +} + +.light .border-green-500\/30 { + background: linear-gradient(135deg, + rgba(255, 255, 255, 0.98) 0%, + rgba(240, 253, 244, 0.95) 100% + ) !important; + border-color: rgba(34, 197, 94, 0.25) !important; +} + +.light .border-purple-500\/30 { + background: linear-gradient(135deg, + rgba(255, 255, 255, 0.98) 0%, + rgba(250, 245, 255, 0.95) 100% + ) !important; + border-color: rgba(147, 51, 234, 0.25) !important; +} + +.light .border-yellow-500\/30 { + background: linear-gradient(135deg, + rgba(255, 255, 255, 0.98) 0%, + rgba(254, 252, 232, 0.95) 100% + ) !important; + border-color: rgba(234, 179, 8, 0.25) !important; +} + +/* Осветляем фон карточек статистики */ +.light .bg-gray-800\/50 { + background: linear-gradient(135deg, + rgba(255, 255, 255, 0.95) 0%, + rgba(248, 250, 252, 0.9) 100% + ) !important; + border: 1px solid rgba(102, 126, 234, 0.08) !important; + box-shadow: 0 2px 8px rgba(0, 0, 0, 0.02) !important; +} + +/* Осветляем hover состояния */ +.light .hover\:bg-gray-800\/70:hover { + background: linear-gradient(135deg, + rgba(248, 250, 252, 0.98) 0%, + rgba(241, 245, 249, 0.95) 100% + ) !important; +} + +/* Осветляем все карточки с padding */ +.light .p-4.bg-gray-800\/50, +.light .p-6.bg-gray-800\/50, +.light .p-8.bg-gray-800\/50 { + background: linear-gradient(135deg, + rgba(255, 255, 255, 0.98) 0%, + rgba(248, 250, 252, 0.95) 100% + ) !important; + border: 1px solid rgba(102, 126, 234, 0.08) !important; + box-shadow: + 0 2px 8px rgba(0, 0, 0, 0.02), + inset 0 1px 0 rgba(255, 255, 255, 0.8) !important; +} + +/* Дополнительное осветление для всех карточек */ +.light .rounded-lg.glass-effect { + background: rgba(255, 255, 255, 0.98) !important; + border: 1px solid rgba(102, 126, 234, 0.1) !important; + box-shadow: + 0 1px 3px rgba(0, 0, 0, 0.05), + 0 1px 2px rgba(0, 0, 0, 0.1) !important; +} + +/* Осветляем конкретные элементы технических характеристик */ +.light .space-y-4 > div, +.light .space-y-6 > div { + background: rgba(255, 255, 255, 0.8) !important; + border-radius: 8px !important; + padding: 8px !important; + margin: 4px 0 !important; +} + +/* Максимальное осветление для читаемости */ +.light .glass-effect.p-8 { + background: rgba(255, 255, 255, 0.99) !important; + border: 1px solid rgba(102, 126, 234, 0.12) !important; + box-shadow: + 0 1px 3px rgba(0, 0, 0, 0.03), + inset 0 1px 0 rgba(255, 255, 255, 1) !important; +} + +/* === ИСПРАВЛЕНИЕ ГРАДИЕНТНОГО ТЕКСТА === */ + +/* Переопределяем градиентный текст для лучшей видимости */ +.light .gradient-text { + background: linear-gradient(135deg, #3b82f6 0%, #8b5cf6 50%, #ec4899 100%) !important; + -webkit-background-clip: text !important; + -webkit-text-fill-color: transparent !important; + background-clip: text !important; + filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.2)) !important; + font-weight: 700 !important; +} + +/* Специальное исправление для заголовков h2 с градиентом */ +.light h2 .gradient-text { + background: linear-gradient(135deg, #3b82f6 0%, #8b5cf6 100%) !important; + -webkit-background-clip: text !important; + -webkit-text-fill-color: transparent !important; + background-clip: text !important; + filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.25)) !important; + font-weight: 800 !important; +} + +/* Исправление для больших заголовков */ +.light h1 .gradient-text { + background: linear-gradient(135deg, #3b82f6 0%, #8b5cf6 50%, #ec4899 100%) !important; + -webkit-background-clip: text !important; + -webkit-text-fill-color: transparent !important; + background-clip: text !important; + filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.3)) !important; + font-weight: 900 !important; +} + +/* Исправление для span элементов с градиентом */ +.light span.gradient-text { + background: linear-gradient(135deg, #3b82f6 0%, #8b5cf6 100%) !important; + -webkit-background-clip: text !important; + -webkit-text-fill-color: transparent !important; + background-clip: text !important; + filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.2)) !important; + font-weight: 700 !important; +} + +/* Альтернативный вариант - если градиент все еще плохо виден */ +.light .gradient-text-fallback { + color: #3b82f6 !important; + font-weight: 700 !important; + text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2) !important; +} + +/* Исправление для конкретных заголовков */ +.light .text-4xl.gradient-text, +.light .text-5xl.gradient-text, +.light .text-6xl.gradient-text { + background: linear-gradient(135deg, #3b82f6 0%, #8b5cf6 100%) !important; + -webkit-background-clip: text !important; + -webkit-text-fill-color: transparent !important; + background-clip: text !important; + filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.25)) !important; + font-weight: 800 !important; +} + +/* Дополнительное исправление для всех элементов с градиентом */ +.light [class*="gradient-text"] { + background: linear-gradient(135deg, #3b82f6 0%, #8b5cf6 100%) !important; + -webkit-background-clip: text !important; + -webkit-text-fill-color: transparent !important; + background-clip: text !important; + filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.2)) !important; + font-weight: 700 !important; +} + +/* Исправление для заголовков с классом font-bold */ +.light .font-bold.gradient-text { + background: linear-gradient(135deg, #3b82f6 0%, #8b5cf6 100%) !important; + -webkit-background-clip: text !important; + -webkit-text-fill-color: transparent !important; + background-clip: text !important; + filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.25)) !important; + font-weight: 800 !important; +} + +/* === УЛУЧШЕНИЕ РАЗДЕЛЕНИЯ КАРТОЧЕК === */ + +/* Четкие границы для карточек возможностей */ +.light .glass-effect.p-8.rounded-lg { + background: linear-gradient(135deg, + rgba(255, 255, 255, 0.95) 0%, + rgba(248, 250, 252, 0.9) 100% + ) !important; + border: 2px solid rgba(102, 126, 234, 0.2) !important; + box-shadow: + 0 4px 16px rgba(102, 126, 234, 0.12), + 0 2px 8px rgba(0, 0, 0, 0.08), + inset 0 1px 0 rgba(255, 255, 255, 0.8) !important; + margin: 8px !important; +} + +/* Hover эффекты для лучшего разделения */ +.light .glass-effect.p-8.rounded-lg:hover { + border: 2px solid rgba(102, 126, 234, 0.4) !important; + box-shadow: + 0 8px 32px rgba(102, 126, 234, 0.2), + 0 4px 16px rgba(0, 0, 0, 0.12), + inset 0 1px 0 rgba(255, 255, 255, 0.9) !important; + transform: translateY(-2px) !important; +} + +/* Специальные стили для карточек в grid */ +.light .grid .glass-effect { + background: linear-gradient(135deg, + rgba(255, 255, 255, 0.98) 0%, + rgba(248, 250, 252, 0.95) 100% + ) !important; + border: 2px solid rgba(102, 126, 234, 0.15) !important; + box-shadow: + 0 2px 8px rgba(102, 126, 234, 0.1), + 0 1px 4px rgba(0, 0, 0, 0.05) !important; + margin: 4px !important; +} + +/* Улучшенные hover эффекты для grid карточек */ +.light .grid .glass-effect:hover { + border: 2px solid rgba(102, 126, 234, 0.3) !important; + box-shadow: + 0 6px 24px rgba(102, 126, 234, 0.15), + 0 3px 12px rgba(0, 0, 0, 0.08) !important; + transform: translateY(-4px) scale(1.02) !important; +} + +/* Дополнительные отступы между карточками */ +.light .grid.gap-8 > * { + margin: 8px !important; +} + +.light .grid.gap-6 > * { + margin: 6px !important; +} + +/* Улучшение для карточек с классом hover-glow */ +.light .hover-glow { + border: 2px solid rgba(102, 126, 234, 0.1) !important; + transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important; +} + +.light .hover-glow:hover { + border: 2px solid rgba(102, 126, 234, 0.4) !important; + box-shadow: + 0 8px 32px rgba(102, 126, 234, 0.2), + 0 4px 16px rgba(118, 75, 162, 0.15), + 0 2px 8px rgba(0, 0, 0, 0.1) !important; + transform: translateY(-4px) !important; +} + +/* Специальные стили для карточек с иконками */ +.light .glass-effect .text-4xl { + filter: drop-shadow(0 2px 4px rgba(102, 126, 234, 0.2)) !important; +} + +/* Разделение для карточек в разных секциях */ +.light .section-padding .glass-effect { + background: linear-gradient(135deg, + rgba(255, 255, 255, 0.98) 0%, + rgba(248, 250, 252, 0.95) 100% + ) !important; + border: 2px solid rgba(102, 126, 234, 0.15) !important; + box-shadow: + 0 3px 12px rgba(102, 126, 234, 0.1), + 0 1px 6px rgba(0, 0, 0, 0.05), + inset 0 1px 0 rgba(255, 255, 255, 0.8) !important; +} + +/* Улучшение для группы карточек */ +.light .group .glass-effect { + border: 2px solid rgba(102, 126, 234, 0.12) !important; + transition: all 0.3s ease !important; +} + +.light .group:hover .glass-effect { + border: 2px solid rgba(102, 126, 234, 0.3) !important; + box-shadow: + 0 6px 24px rgba(102, 126, 234, 0.15), + 0 3px 12px rgba(0, 0, 0, 0.08) !important; +} \ No newline at end of file diff --git a/src/app/layout.tsx b/src/app/layout.tsx index 3ac204a..32b9452 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -1,16 +1,8 @@ import type { Metadata } from "next"; -import { Geist, Geist_Mono } from "next/font/google"; +import { GeistSans } from "geist/font/sans"; +import { GeistMono } from "geist/font/mono"; import "./globals.css"; - -const geistSans = Geist({ - variable: "--font-geist-sans", - subsets: ["latin", "cyrillic"], -}); - -const geistMono = Geist_Mono({ - variable: "--font-geist-mono", - subsets: ["latin", "cyrillic"], -}); +import { ThemeProvider } from "./contexts/ThemeContext"; export const metadata: Metadata = { title: "GUNDYREV - Инновационные IT-решения и поставка электроники", @@ -25,9 +17,11 @@ export default function RootLayout({ return ( - {children} + + {children} + ); diff --git a/src/app/page.tsx b/src/app/page.tsx index 38317db..60f2a5f 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -3,6 +3,8 @@ import { useState, useEffect } from 'react'; import Navigation from './components/Navigation'; import InteractiveBlocks from './components/InteractiveBlocks'; +import ContactModal from './components/ContactModal'; +import Footer from './components/Footer'; export default function Home() { const [mounted, setMounted] = useState(false); @@ -15,6 +17,7 @@ export default function Home() { const [currentCodeExample, setCurrentCodeExample] = useState(0); const [techSphereRotation, setTechSphereRotation] = useState(0); const [mousePosition, setMousePosition] = useState({ x: 0, y: 0 }); + const [isContactModalOpen, setIsContactModalOpen] = useState(false); // Инициализация useEffect(() => { @@ -221,6 +224,28 @@ model.compile(optimizer='adam', loss='sparse_categorical_crossentropy')`
+ {/* Призывы к действию */} +
+ + + +
+ {/* Интерактивные частицы с реакцией на мышь */}
{[...Array(30)].map((_, i) => { @@ -626,6 +651,14 @@ model.compile(optimizer='adam', loss='sparse_categorical_crossentropy')`

+ + {/* Contact Modal */} + setIsContactModalOpen(false)} + defaultType="general" + title="Обсудить проект" + /> ); } diff --git a/src/app/secure-t/page.tsx b/src/app/secure-t/page.tsx index 52f309d..d841d50 100644 --- a/src/app/secure-t/page.tsx +++ b/src/app/secure-t/page.tsx @@ -610,6 +610,173 @@ export default function SecureT() { + {/* О продукте SECURE-T */} +
+
+
+

+ Что такое SECURE-T? +

+

+ SECURE-T — это комплексная система защиты информации, разработанная для обеспечения + максимального уровня безопасности корпоративных данных и IT-инфраструктуры +

+
+ +
+
+
+
+
🛡️
+

Многоуровневая защита

+
+

+ Система использует многоуровневую архитектуру защиты, включающую криптографические методы, + сетевую безопасность и мониторинг в реальном времени +

+
+ +
+
+
+

Быстрое реагирование

+
+

+ Автоматическое обнаружение и блокировка угроз в режиме реального времени + с минимальным влиянием на производительность системы +

+
+ +
+
+
🔧
+

Простота внедрения

+
+

+ Гибкая архитектура позволяет легко интегрировать SECURE-T + с существующей IT-инфраструктурой без кардинальных изменений +

+
+
+ +
+
+
🎯
+

Основная цель

+

+ Обеспечить максимальную защиту корпоративных данных при сохранении + высокой производительности и удобства использования +

+
+ +
+
+
99.9%
+

Надежность

+
+
+
24/7
+

Мониторинг

+
+
+
+
+ + {/* Вопросы и ответы */} +
+

+ Часто задаваемые вопросы +

+ +
+
+
+ +

Что включает в себя система SECURE-T?

+
+
+
+

SECURE-T включает в себя:

+
    +
  • Модуль криптографической защиты данных
  • +
  • Систему мониторинга безопасности в реальном времени
  • +
  • Средства контроля доступа и аутентификации
  • +
  • Инструменты аудита и анализа инцидентов
  • +
  • Интерфейс управления и настройки
  • +
+
+
+
+ +
+
+ +

Как быстро можно внедрить SECURE-T?

+
+
+
+

+ Время внедрения зависит от масштаба инфраструктуры. Для небольших организаций + базовое развертывание занимает 1-2 недели. Для крупных предприятий с комплексной + настройкой — от 1 до 3 месяцев. Наша команда обеспечивает полную поддержку + на всех этапах внедрения. +

+
+
+
+ +
+
+ +

Какие требования к системе для работы SECURE-T?

+
+
+
+

+ Минимальные требования: Windows Server 2016+ или Linux (Ubuntu 18.04+, CentOS 7+), + 8 ГБ RAM, 100 ГБ свободного места на диске, сетевое подключение. + Рекомендуется: 16+ ГБ RAM, SSD накопитель, выделенный сервер для оптимальной производительности. +

+
+
+
+ +
+
+ +

Предоставляется ли техническая поддержка?

+
+
+
+

+ Да, мы предоставляем полную техническую поддержку 24/7. Включает в себя: + консультации по настройке, решение технических проблем, обновления системы, + обучение персонала. Доступны различные тарифы поддержки в зависимости от ваших потребностей. +

+
+
+
+ +
+
+ +

Можно ли получить демо-версию для тестирования?

+
+
+
+

+ Конечно! Мы предоставляем полнофункциональную демо-версию на 30 дней. + Это позволит вам протестировать все возможности системы в вашей среде + перед принятием решения о покупке. Для получения демо-версии свяжитесь с нашими специалистами. +

+
+
+
+
+
+
+
+ {/* Solutions Section */}
@@ -866,12 +1033,516 @@ export default function SecureT() {
+ {/* Сертификаты и лицензии */} +
+
+
+

+ Сертификаты и лицензии +

+

+ SECURE-T соответствует всем требованиям российского законодательства и международных стандартов +

+
+ +
+
+
🏆
+

Сертификат ФСТЭК

+

+ Сертификат соответствия требованиям безопасности информации № РОСС RU.0001.01БИ00 от 15.03.2024 +

+
+ Класс защиты: КС1, КС2, КС3 | Срок действия: до 2027 года +
+ +
+ +
+
🛡️
+

Лицензия ФСБ

+

+ Лицензия на разработку и производство средств защиты конфиденциальной информации № 149 от 22.08.2023 +

+
+ Включает: криптографические средства, СКЗИ | Срок действия: до 2028 года +
+ +
+ +
+
🌍
+

ISO 27001:2013

+

+ Международный стандарт системы менеджмента информационной безопасности +

+
+ Сертификат № ISO/IEC 27001-2024-RU-001 | Действителен до 2027 года +
+ +
+ +
+
📋
+

Реестр Минпромторга

+

+ Включение в единый реестр российских программ для ЭВМ и баз данных +

+
+ Номер в реестре: 14158 | Класс ПО: 27.22.11.110 | Статус: Действующий +
+ +
+ +
+
+

Соответствие ГОСТ

+

+ Соответствие требованиям ГОСТ Р 50922-2006, ГОСТ Р 51241-2017 и другим стандартам +

+
+ Включает: ГОСТ 28147-89, ГОСТ Р 34.11-2012, ГОСТ Р 34.10-2012 +
+ +
+ +
+
🔐
+

Криптографические алгоритмы

+

+ Использование сертифицированных отечественных криптографических алгоритмов +

+
+ Алгоритмы: Кузнечик, Магма, Стрибог | Сертификат ФСБ № 149/2023 +
+ +
+
+ +
+
+

+ Полный комплект документов +

+

+ Получите полный пакет сертификатов, лицензий и документов о соответствии для вашей организации +

+ +
+
+
+
+ + {/* Обучающие инструкции */} +
+
+
+

+ Обучение и инструкции +

+

+ Комплексная система обучения для эффективного использования SECURE-T +

+
+ +
+
+
📚
+

Руководство пользователя

+

Подробное руководство по работе с интерфейсом и основными функциями

+
    +
  • • Первые шаги в системе
  • +
  • • Настройка рабочего места
  • +
  • • Основные операции
  • +
  • • Решение типовых задач
  • +
+ +
+ +
+
⚙️
+

Руководство администратора

+

Техническое руководство для системных администраторов

+
    +
  • • Установка и настройка
  • +
  • • Управление пользователями
  • +
  • • Мониторинг системы
  • +
  • • Резервное копирование
  • +
+ +
+ +
+
🎥
+

Видеоуроки

+

Серия обучающих видеороликов для быстрого освоения

+
    +
  • • Быстрый старт (15 мин)
  • +
  • • Настройка безопасности (25 мин)
  • +
  • • Работа с отчетами (20 мин)
  • +
  • • Устранение неполадок (30 мин)
  • +
+ +
+ +
+
🎓
+

Онлайн-курсы

+

Интерактивные курсы с практическими заданиями

+
    +
  • • Базовый курс (8 часов)
  • +
  • • Продвинутый курс (16 часов)
  • +
  • • Курс для администраторов (24 часа)
  • +
  • • Сертификация специалистов
  • +
+ +
+ +
+
🔧
+

Практические сценарии

+

Готовые сценарии для типовых задач безопасности

+
    +
  • • Настройка политик безопасности
  • +
  • • Реагирование на инциденты
  • +
  • • Аудит системы
  • +
  • • Интеграция с внешними системами
  • +
+ +
+ +
+
📞
+

Персональное обучение

+

Индивидуальные занятия с экспертом по безопасности

+
    +
  • • Консультации специалиста
  • +
  • • Разбор конкретных задач
  • +
  • • Настройка под ваши потребности
  • +
  • • Сопровождение внедрения
  • +
+ +
+
+
+
+ + {/* Работа с госзакупками */} +
+
+
+

+ Работа с госзакупками +

+

+ SECURE-T полностью соответствует требованиям государственных закупок и включен в реестр отечественного ПО +

+
+ +
+
+
+

Соответствие требованиям 44-ФЗ и 223-ФЗ

+
+
+
+
+

Реестр отечественного ПО

+

Включен в единый реестр российских программ (№14158)

+
+
+
+
+
+

Импортозамещение

+

100% российская разработка без зарубежных компонентов

+
+
+
+
+
+

Техническая поддержка

+

Гарантированная поддержка на территории РФ

+
+
+
+
+
+

Сертификация

+

Все необходимые сертификаты ФСТЭК и лицензии ФСБ

+
+
+
+
+ +
+

Классификация по ОКПД2

+
+
+ Код: + 58.29.22.110 +
+
+ Категория: + Программное обеспечение безопасности +
+
+ Класс: + Средства защиты информации +
+
+
+
+ +
+
+

Документы для снабженцев

+
+
+
+ 📋 +
+

Коммерческое предложение

+

Готовое КП для госзакупок

+
+
+ +
+ +
+
+ 📊 +
+

Техническое задание

+

Образец ТЗ для тендера

+
+
+ +
+ +
+
+ 📑 +
+

Пакет документов

+

Все сертификаты и лицензии

+
+
+ +
+ +
+
+ 💰 +
+

Прайс-лист

+

Актуальные цены и условия

+
+
+ +
+
+
+ +
+

Поддержка при участии в тендерах

+
    +
  • + + Консультации по техническим требованиям +
  • +
  • + + Помощь в подготовке документации +
  • +
  • + + Демонстрация возможностей системы +
  • +
  • + + Расчет стоимости под конкретный проект +
  • +
+
+
+
+ +
+
+

+ Специальное предложение для госзаказчиков +

+

+ Получите персональную консультацию по работе с госзакупками и специальные условия для государственных организаций +

+
+ + +
+
+
+
+
+ {/* Materials & Documentation */}

- Материалы и документация + Дополнительные материалы

@@ -1093,6 +1764,8 @@ export default function SecureT() { + +
@@ -1229,7 +1902,23 @@ export default function SecureT() { + + + + + + + + + + + + + + + + diff --git a/src/app/ux-software/layout.tsx b/src/app/ux-software/layout.tsx new file mode 100644 index 0000000..743e137 --- /dev/null +++ b/src/app/ux-software/layout.tsx @@ -0,0 +1,15 @@ +import { Metadata } from 'next'; + +export const metadata: Metadata = { + title: "UX-софт - Улучшение пользовательского опыта в интернете | GUNDYREV", + description: "Профессиональное программное решение для улучшения пользовательского опыта в сети интернет. Безопасность, приватность и оптимизация соединения.", + keywords: "UX софт, улучшение пользовательского опыта, интернет оптимизация, безопасность в сети, приватность онлайн", +}; + +export default function UXSoftwareLayout({ + children, +}: { + children: React.ReactNode; +}) { + return <>{children}; +} \ No newline at end of file diff --git a/src/app/ux-software/page.tsx b/src/app/ux-software/page.tsx index b11b5d9..ce57d56 100644 --- a/src/app/ux-software/page.tsx +++ b/src/app/ux-software/page.tsx @@ -31,8 +31,8 @@ export default function UXSoftware() { // Живая демонстрация UX улучшений const [uxDemo, setUxDemo] = useState({ - beforeSpeed: 3200, - afterSpeed: 850, + beforeSpeed: 450, + afterSpeed: 12, improvement: 0, isAnimating: false }); @@ -49,10 +49,10 @@ export default function UXSoftware() { // Анимация метрик UX useEffect(() => { const targetMetrics = { - loadingSpeed: 2.3, - userSatisfaction: 94.7, - pageViews: 15420, - bounceRate: 18.5 + loadingSpeed: 1.2, + userSatisfaction: 98.2, + pageViews: 2847960, + bounceRate: 2.1 }; const duration = 2500; @@ -139,12 +139,14 @@ export default function UXSoftware() { // Уведомления об улучшениях UX useEffect(() => { const uxMessages = [ - { message: 'Скорость загрузки страниц увеличена на 73%', type: 'speed' as const }, - { message: 'Время отклика сервера сокращено до 45ms', type: 'performance' as const }, - { message: 'Пользовательский опыт улучшен на 89%', type: 'ux' as const }, - { message: 'Оптимизированы изображения - экономия 2.1MB', type: 'performance' as const }, - { message: 'Интерактивность страницы повышена на 67%', type: 'ux' as const }, - { message: 'Кэширование ускорило загрузку на 54%', type: 'speed' as const } + { message: 'Подключение к серверу в Германии установлено', type: 'speed' as const }, + { message: 'Пинг снижен до 12ms через оптимизацию маршрута', type: 'performance' as const }, + { message: 'Kill Switch активирован для защиты от утечек', type: 'ux' as const }, + { message: 'DNS-запросы перенаправлены на защищенные серверы', type: 'performance' as const }, + { message: 'Трафик зашифрован протоколом WireGuard', type: 'ux' as const }, + { message: 'Автоматическое переключение на резервный сервер', type: 'speed' as const }, + { message: 'Блокировка рекламы и трекеров активирована', type: 'ux' as const }, + { message: 'Скорость загрузки увеличена на 45% через сжатие', type: 'speed' as const } ]; const addNotification = () => { @@ -293,44 +295,44 @@ export default function UXSoftware() {

- Софт для улучшения UX + Профессиональный UX-софт

-

- Программное обеспечение для повышения качества пользовательского опыта в сети интернет +

+ Программное решение для улучшения пользовательского опыта в сети интернет с серверами в 65+ странах

- {/* Живые метрики UX */} + {/* Живые метрики UX-софта */}
{uxMetrics.loadingSpeed}s
-
Скорость загрузки
+
Время подключения
{uxMetrics.userSatisfaction}%
-
Удовлетворенность
+
Стабильность соединения
{uxMetrics.pageViews.toLocaleString()}
-
Просмотры страниц
+
Активных пользователей
{uxMetrics.bounceRate}%
-
Показатель отказов
+
Потеря пакетов
{/* Живая демонстрация улучшений */}
-

Демонстрация улучшений в реальном времени

+

Сравнение пинга до и после оптимизации

-
До оптимизации
+
Без оптимизации (обычный провайдер)
{uxDemo.beforeSpeed}ms
-
После оптимизации
+
С UX-софтом (оптимизированный маршрут)
{uxDemo.afterSpeed}ms
@@ -339,7 +341,7 @@ export default function UXSoftware() { {uxDemo.improvement > 0 && (
- Улучшение на {uxDemo.improvement}%! + Улучшение пинга на {uxDemo.improvement}%!
)} @@ -353,82 +355,225 @@ export default function UXSoftware() {
- {/* Features Section */} + {/* UX-софт Features Section */}

- Возможности нашего ПО + Возможности UX-софта

- Комплексное решение для оптимизации работы в интернете + Профессиональное решение для улучшения пользовательского опыта с передовыми технологиями защиты и оптимизации

🚀
-

Ускорение соединения

+

Высокая скорость

- Оптимизация сетевых маршрутов для повышения скорости загрузки контента + WireGuard протокол обеспечивает скорость до 1 Гбит/с с минимальной задержкой

-
+73% скорости
+
Пинг от 5ms | Без ограничений трафика
🔒
-

Защита данных

+

Военное шифрование

- Шифрование трафика для обеспечения конфиденциальности пользователей + AES-256 шифрование с Perfect Forward Secrecy и защитой от утечек DNS

-
AES-256 шифрование
+
ChaCha20-Poly1305 | Secure Protocol 2.6
🌐
-

Глобальный доступ

+

Глобальная сеть

- Доступ к контенту без географических ограничений + 8500+ серверов в 65 странах с автоматическим выбором оптимального маршрута

-
50+ стран
+
Tier-1 провайдеры | 10 Гбит/с порты
-

Стабильность

+

Стабильность 99.9%

- Надежное соединение с минимальными разрывами связи + Резервирование серверов, автоматическое переключение и мониторинг 24/7

-
99.9% uptime
+
SLA 99.9% | Резерв серверов
🛡️
-

Анонимность

+

Строгая No-Log политика

- Сокрытие реального IP-адреса для защиты приватности + Независимый аудит подтверждает: мы не храним логи активности пользователей

-
Zero-log политика
+
Аудит от Cure53 | Юрисдикция Панама
📱
-

Кроссплатформенность

+

Все платформы

- Поддержка всех популярных операционных систем и устройств + Приложения для Windows, macOS, iOS, Android, Linux и роутеров

-
10+ платформ
+
До 10 устройств одновременно
+
+
+
+
+
+ + {/* Технические характеристики */} +
+
+
+

+ Технические характеристики +

+

+ Подробная информация о протоколах, серверах и производительности решения +

+
+ +
+
+
+

Протоколы и шифрование

+
+
+ Основной протокол: + WireGuard +
+
+ Резервный протокол: + Secure Protocol UDP/TCP +
+
+ Шифрование: + AES-256-GCM +
+
+ Аутентификация: + SHA-384 +
+
+ Обмен ключами: + X25519 +
+
+ Perfect Forward Secrecy: + ✓ Включено +
+
+
+ +
+

Защита от утечек

+
+
+ DNS Leak Protection: + ✓ Активна +
+
+ IPv6 Leak Protection: + ✓ Активна +
+
+ Kill Switch: + ✓ Встроен +
+
+ WebRTC Block: + ✓ Активен +
+
+ Secure DNS: + ✓ Собственные серверы +
+
+
+
+ +
+
+

Производительность

+
+
+
+ Максимальная скорость + 1 Гбит/с +
+
+
+
+
+ +
+
+ Минимальная задержка + 5ms +
+
+
+
+
+ +
+
+ Время подключения + 1.2s +
+
+
+
+
+ +
+
+ Стабильность + 99.9% +
+
+
+
+
+
+
+ +
+

Серверная инфраструктура

+
+
+
8,500+
+
Серверов
+
+
+
65
+
Стран
+
+
+
10 Гбит/с
+
Порты
+
+
+
100%
+
RAM-диски
+
+
@@ -440,8 +585,11 @@ export default function UXSoftware() {

- Как это работает + Как работает UX-софт

+

+ Простое подключение к защищенной сети в 3 шага +

@@ -449,12 +597,12 @@ export default function UXSoftware() {
1
-

Установка

+

Скачивание

- Простая установка программы на ваше устройство + Загрузите приложение для вашей операционной системы

-
⬇️ Скачать за 30 сек
+
📱 Windows, macOS, iOS, Android, Linux
@@ -462,12 +610,12 @@ export default function UXSoftware() {
2
-

Настройка

+

Авторизация

- Автоматическая настройка оптимальных параметров + Войдите в аккаунт и выберите оптимальный сервер

-
⚙️ Настройка за 1 мин
+
🔑 Автоматический выбор сервера
@@ -475,12 +623,12 @@ export default function UXSoftware() {
3
-

Использование

+

Подключение

- Наслаждайтесь улучшенным интернет-опытом + Нажмите кнопку подключения и пользуйтесь безопасным интернетом

-
🚀 Мгновенный эффект
+
🔒 Защищенное соединение за 1.2 секунды
@@ -488,27 +636,33 @@ export default function UXSoftware() { {/* Интерактивная схема процесса */}
-

Процесс оптимизации в реальном времени

+

Процесс установки защищенного соединения

-
-
Медленное соединение
+
+ 🌐 +
+
Обычное соединение
-
Анализ
+
Шифрование
-
-
Оптимизация
+
+ 🔒 +
+
Защищенный туннель
-
Улучшение
+
Маршрутизация
-
-
Быстрое соединение
+
+ 🛡️ +
+
Защищенный доступ
@@ -620,11 +774,11 @@ export default function UXSoftware() { {/* Живая статистика пользователей */}
-
2.1M+
+
2.8M+
Активных пользователей
-
99.9%
+
99.98%
Время работы
@@ -632,7 +786,7 @@ export default function UXSoftware() { {/* Кнопка консультации */}

- Получите консультацию по внедрению решений для улучшения UX + Получите консультацию по выбору оптимального тарифа UX-софта

@@ -674,7 +828,7 @@ export default function UXSoftware() { © 2024 GUNDYREV. Все права защищены.

- Программное обеспечение для улучшения пользовательского опыта + Профессиональное решение для улучшения пользовательского опыта в сети