Найден корректный robots.txt
Файл управления сканированием сайта роботами
?
Robots.txt указывает поисковым роботам, какие страницы сканировать, а какие — нет. Ошибки в файле могут случайно закрыть важные разделы от индексации.
Robots.txt настроен корректно. Размер файла: 54699 байт. Загружен за: 50мсек.
Проверяемая страница не запрещена в robots.txt.
Цепочка редиректов для файла robots.txt:
http://botnova-studio.ru/robots.txt
301 MovedPermanently
https://botnova-studio.ru/robots.txt
200 OK
Показать содержимое robots.txt
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>BotNova Studio — разработка сайтов, Telegram-ботов, автоматизация</title>
<meta name="description" content="Создаём сайты, Telegram-ботов и автоматизируем бизнес. Разработка под ключ. Доступные цены — от 3 000 ₽. Гарантия качества. Узнайте стоимость!">
<link rel="canonical" href="https://botnova-studio.ru/">
<meta property="og:title" content="BotNova Studio — разработка сайтов и Telegram-ботов">
<meta property="og:description" content="Создаём сайты, Telegram-ботов и автоматизируем бизнес. Доступные цены, гарантия качества.">
<meta property="og:url" content="https://botnova-studio.ru/">
<meta property="og:type" content="website">
<link rel="icon" type="image/x-icon" href="/favicon.ico">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;600;700;800;900&display=swap" rel="stylesheet">
<style>
/* ===== ОСНОВНЫЕ СТИЛИ ===== */
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
:root {
--bg-primary: #0b0d15;
--bg-secondary: #11141f;
--bg-card: #161a2b;
--text-primary: #ffffff;
--text-secondary: #8892b0;
--accent-cyan: #64ffda;
--accent-blue: #4facfe;
--gradient-start: #4facfe;
--gradient-end: #00f2fe;
--border-color: #1d2340;
}
html { scroll-behavior: smooth; }
body {
font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
background: var(--bg-primary);
color: var(--text-primary);
line-height: 1.6;
overflow-x: hidden;
}
/* ===== АНИМИРОВАННЫЙ ФОН ===== */
.bg-animation {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 0;
overflow: hidden;
pointer-events: none;
}
.bg-animation .orb {
position: absolute;
border-radius: 50%;
filter: blur(80px);
opacity: 0.4;
animation: orbFloat 20s ease-in-out infinite;
}
.bg-animation .orb:nth-child(1) {
width: 500px;
height: 500px;
background: rgba(79, 172, 254, 0.15);
top: -10%;
left: -10%;
animation-delay: 0s;
}
.bg-animation .orb:nth-child(2) {
width: 400px;
height: 400px;
background: rgba(100, 255, 218, 0.08);
bottom: -10%;
right: -10%;
animation-delay: -7s;
}
.bg-animation .orb:nth-child(3) {
width: 300px;
height: 300px;
background: rgba(79, 172, 254, 0.1);
top: 50%;
left: 50%;
animation-delay: -14s;
}
@keyframes orbFloat {
0%, 100% { transform: translate(0, 0) scale(1); }
33% { transform: translate(60px, -40px) scale(1.1); }
66% { transform: translate(-40px, 30px) scale(0.9); }
}
.grid-overlay {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 0;
pointer-events: none;
background-image:
linear-gradient(rgba(255,255,255,0.02) 1px, transparent 1px),
linear-gradient(90deg, rgba(255,255,255,0.02) 1px, transparent 1px);
background-size: 60px 60px;
}
.container {
max-width: 1200px;
margin: 0 auto;
padding: 0 24px;
position: relative;
z-index: 1;
}
.section {
padding: 100px 0;
position: relative;
}
.section-label {
font-size: 14px;
font-weight: 600;
color: var(--accent-cyan);
text-transform: uppercase;
letter-spacing: 3px;
margin-bottom: 12px;
display: inline-block;
}
.section-title {
font-size: 44px;
font-weight: 800;
line-height: 1.1;
margin-bottom: 16px;
}
.section-title .highlight {
background: linear-gradient(135deg, var(--gradient-start), var(--gradient-end));
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
}
.section-subtitle {
font-size: 18px;
color: var(--text-secondary);
max-width: 560px;
line-height: 1.7;
}
.btn {
display: inline-block;
padding: 16px 40px;
border-radius: 12px;
font-size: 16px;
font-weight: 600;
text-decoration: none;
transition: all 0.3s ease;
border: none;
cursor: pointer;
position: relative;
overflow: hidden;
}
.btn-primary {
background: linear-gradient(135deg, var(--gradient-start), var(--gradient-end));
color: #0b0d15;
box-shadow: 0 4px 30px rgba(79, 172, 254, 0.3);
}
.btn-primary:hover {
transform: translateY(-3px);
box-shadow: 0 8px 50px rgba(79, 172, 254, 0.4);
}
.btn-secondary {
background: rgba(255,255,255,0.05);
color: var(--text-primary);
border: 1px solid rgba(255,255,255,0.1);
}
.btn-secondary:hover {
background: rgba(255,255,255,0.1);
transform: translateY(-3px);
}
/* ===== НАВИГАЦИЯ ===== */
.nav {
position: fixed;
top: 0;
left: 0;
width: 100%;
padding: 20px 0;
z-index: 100;
background: rgba(11, 13, 21, 0.8);
backdrop-filter: blur(20px);
border-bottom: 1px solid rgba(255,255,255,0.05);
transition: all 0.3s ease;
}
.nav.scrolled {
background: rgba(11, 13, 21, 0.95);
box-shadow: 0 4px 30px rgba(0,0,0,0.3);
}
.nav .container {
display: flex;
justify-content: space-between;
align-items: center;
}
.nav-logo {
font-size: 24px;
font-weight: 800;
text-decoration: none;
color: var(--text-primary);
}
.nav-logo .logo-highlight {
background: linear-gradient(135deg, var(--gradient-start), var(--gradient-end));
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
}
.nav-links {
display: flex;
gap: 32px;
align-items: center;
}
.nav-links a {
color: var(--text-secondary);
text-decoration: none;
font-size: 15px;
font-weight: 500;
transition: color 0.3s;
position: relative;
}
.nav-links a::after {
content: '';
position: absolute;
bottom: -4px;
left: 0;
width: 0;
height: 2px;
background: linear-gradient(135deg, var(--gradient-start), var(--gradient-end));
transition: width 0.3s;
}
.nav-links a:hover {
color: var(--text-primary);
}
.nav-links a:hover::after {
width: 100%;
}
.nav-cta {
padding: 10px 24px;
border-radius: 8px;
background: linear-gradient(135deg, var(--gradient-start), var(--gradient-end));
color: #0b0d15 !important;
font-weight: 600;
}
.nav-cta:hover {
transform: scale(1.05);
color: #0b0d15 !important;
}
.nav-toggle {
display: none;
flex-direction: column;
gap: 5px;
cursor: pointer;
background: none;
border: none;
}
.nav-toggle span {
width: 28px;
height: 2px;
background: var(--text-primary);
transition: all 0.3s;
border-radius: 2px;
}
/* ===== ГЕРОЙ ===== */
.hero {
min-height: 100vh;
display: flex;
align-items: center;
padding-top: 80px;
position: relative;
}
.hero-content {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 60px;
align-items: center;
}
.hero-text { animation: fadeInUp 0.8s ease; }
.hero-badge {
display: inline-block;
padding: 8px 20px;
border-radius: 50px;
background: rgba(100, 255, 218, 0.08);
border: 1px solid rgba(100, 255, 218, 0.15);
color: var(--accent-cyan);
font-size: 14px;
font-weight: 600;
margin-bottom: 24px;
animation: pulse 2s ease-in-out infinite;
}
@keyframes pulse {
0%, 100% { opacity: 1; }
50% { opacity: 0.6; }
}
.hero-title {
font-size: 64px;
font-weight: 900;
line-height: 1.05;
margin-bottom: 20px;
}
.hero-title .highlight {
background: linear-gradient(135deg, var(--gradient-start), var(--gradient-end));
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
}
.hero-description {
font-size: 20px;
color: var(--text-secondary);
line-height: 1.7;
margin-bottom: 32px;
max-width: 520px;
}
.hero-buttons {
display: flex;
gap: 16px;
flex-wrap: wrap;
}
.hero-stats {
display: flex;
gap: 48px;
margin-top: 48px;
padding-top: 32px;
border-top: 1px solid var(--border-color);
}
.hero-stat h3 {
font-size: 32px;
font-weight: 800;
background: linear-gradient(135deg, var(--gradient-start), var(--gradient-end));
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
}
.hero-stat p {
color: var(--text-secondary);
font-size: 14px;
}
.hero-visual .code-block {
background: var(--bg-secondary);
border: 1px solid var(--border-color);
border-radius: 16px;
padding: 32px;
width: 100%;
max-width: 460px;
position: relative;
overflow: hidden;
}
.code-block .code-line {
font-family: 'Fira Code', monospace;
font-size: 14px;
padding: 4px 0;
opacity: 0;
animation: typeCode 3s ease forwards;
}
.code-block .code-line:nth-child(1) { animation-delay: 0.1s; }
.code-block .code-line:nth-child(2) { animation-delay: 0.3s; }
.code-block .code-line:nth-child(3) { animation-delay: 0.5s; }
.code-block .code-line:nth-child(4) { animation-delay: 0.7s; }
.code-block .code-line:nth-child(5) { animation-delay: 0.9s; }
.code-block .code-line:nth-child(6) { animation-delay: 1.1s; }
.code-block .code-line:nth-child(7) { animation-delay: 1.3s; }
.code-block .code-line:nth-child(8) { animation-delay: 1.5s; }
@keyframes typeCode {
0% { opacity: 0; transform: translateX(-10px); }
100% { opacity: 1; transform: translateX(0); }
}
.code-line .comment { color: #3a4a5a; }
.code-line .keyword { color: var(--accent-cyan); }
.code-line .string { color: #ffa07a; }
.code-line .variable { color: #4facfe; }
.code-line .function { color: #f0e68c; }
.code-block .cursor {
display: inline-block;
width: 2px;
height: 18px;
background: var(--accent-cyan);
animation: blink 1s step-end infinite;
vertical-align: middle;
margin-left: 2px;
}
@keyframes blink {
0%, 50% { opacity: 1; }
51%, 100% { opacity: 0; }
}
.code-block .floating-icons {
position: absolute;
top: 12px;
right: 16px;
display: flex;
gap: 8px;
}
.code-block .floating-icons span {
width: 12px;
height: 12px;
border-radius: 50%;
display: inline-block;
}
.code-block .floating-icons span:nth-child(1) { background: #ff5f56; }
.code-block .floating-icons span:nth-child(2) { background: #ffbd2e; }
.code-block .floating-icons span:nth-child(3) { background: #27c93f; }
/* ===== УСЛУГИ ===== */
.services-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
gap: 24px;
margin-top: 48px;
}
.service-card {
background: var(--bg-secondary);
border: 1px solid var(--border-color);
border-radius: 16px;
padding: 32px 28px;
transition: all 0.4s ease;
position: relative;
overflow: hidden;
}
.service-card::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 2px;
background: linear-gradient(135deg, var(--gradient-start), var(--gradient-end));
transform: scaleX(0);
transform-origin: left;
transition: transform 0.4s ease;
}
.service-card:hover::before {
transform: scaleX(1);
}
.service-card:hover {
transform: translateY(-8px);
border-color: rgba(79, 172, 254, 0.2);
box-shadow: 0 20px 60px rgba(0,0,0,0.3);
}
.service-icon {
font-size: 40px;
margin-bottom: 16px;
display: block;
}
.service-card h3 {
font-size: 20px;
font-weight: 700;
margin-bottom: 8px;
}
.service-card p {
color: var(--text-secondary);
font-size: 15px;
line-height: 1.6;
}
.price-block {
margin-top: 16px;
display: flex;
flex-direction: column;
gap: 4px;
}
.price-old {
font-size: 14px;
color: #ff6b6b;
text-decoration: line-through;
}
.price-new {
font-size: 24px;
font-weight: 800;
color: var(--accent-cyan);
}
.price-badge {
display: inline-block;
padding: 4px 12px;
border-radius: 20px;
background: rgba(255, 107, 107, 0.15);
color: #ff6b6b;
font-size: 12px;
font-weight: 600;
}
/* ===== ПОДПИСКИ ===== */
.subscriptions-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
gap: 30px;
margin-top: 48px;
}
.subscription-card {
background: var(--bg-secondary);
border: 1px solid var(--border-color);
border-radius: 16px;
padding: 32px 28px;
text-align: center;
transition: all 0.4s ease;
display: flex;
flex-direction: column;
align-items: center;
}
.subscription-card:hover {
transform: translateY(-8px);
border-color: rgba(79, 172, 254, 0.3);
box-shadow: 0 20px 60px rgba(0,0,0,0.3);
}
.subscription-card.featured {
border-color: var(--accent-cyan);
box-shadow: 0 0 30px rgba(100, 255, 218, 0.1);
}
.subscription-badge {
font-size: 14px;
font-weight: 700;
padding: 6px 16px;
border-radius: 20px;
background: linear-gradient(135deg, #4facfe, #64ffda);
color: #0b0d15;
margin-bottom: 16px;
}
.subscription-card .price {
font-size: 36px;
font-weight: 800;
color: var(--text-primary);
}
.subscription-card .period {
font-size: 16px;
color: var(--text-secondary);
}
.subscription-features {
list-style: none;
padding: 0;
margin: 0 0 24px 0;
text-align: left;
width: 100%;
}
.subscription-features li {
padding: 8px 0;
color: var(--text-secondary);
font-size: 15px;
border-bottom: 1px solid rgba(255, 255, 255, 0.03);
}
.subscription-features li:last-child {
border-bottom: none;
}
.btn-subscribe { width: 100%; text-align: center; }
/* ===== ПОРТФОЛИО (ОБНОВЛЕНО) ===== */
.portfolio-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
gap: 30px;
margin-top: 48px;
}
.portfolio-card {
background: var(--bg-secondary);
border: 1px solid var(--border-color);
border-radius: 16px;
overflow: hidden;
transition: all 0.4s ease;
}
.portfolio-card:hover {
transform: translateY(-8px);
border-color: rgba(79, 172, 254, 0.2);
box-shadow: 0 20px 60px rgba(0,0,0,0.3);
}
.portfolio-image {
height: 200px;
display: flex;
align-items: center;
justify-content: center;
font-size: 48px;
background: linear-gradient(135deg, #1a1a2e, #16213e);
position: relative;
overflow: hidden;
}
.portfolio-image .demo-badge {
position: absolute;
top: 12px;
right: 12px;
padding: 4px 14px;
border-radius: 20px;
background: rgba(79, 172, 254, 0.15);
color: var(--accent-blue);
font-size: 12px;
font-weight: 600;
}
.portfolio-image .demo-link {
position: absolute;
bottom: 16px;
right: 16px;
padding: 8px 16px;
border-radius: 8px;
background: rgba(0,0,0,0.6);
backdrop-filter: blur(8px);
color: #fff;
text-decoration: none;
font-size: 13px;
font-weight: 600;
transition: all 0.3s;
}
.portfolio-image .demo-link:hover {
background: rgba(79, 172, 254, 0.3);
transform: scale(1.05);
}
.portfolio-card h4 {
padding: 20px 24px 8px;
font-size: 18px;
}
.portfolio-card p {
padding: 0 24px;
color: var(--text-secondary);
font-size: 14px;
}
.portfolio-card .tech-stack {
padding: 8px 24px;
display: flex;
gap: 8px;
flex-wrap: wrap;
}
.portfolio-card .tech-stack span {
padding: 2px 12px;
border-radius: 12px;
font-size: 12px;
font-weight: 600;
background: rgba(79, 172, 254, 0.1);
color: var(--accent-blue);
}
/* ===== ЭТАПЫ ===== */
.stages-timeline {
display: flex;
justify-content: space-between;
margin-top: 48px;
position: relative;
flex-wrap: wrap;
gap: 20px;
}
.stages-timeline::before {
content: '';
position: absolute;
top: 32px;
left: 5%;
right: 5%;
height: 2px;
background: var(--border-color);
z-index: 0;
}
.stage-item {
flex: 1;
min-width: 120px;
text-align: center;
position: relative;
z-index: 1;
}
.stage-number {
width: 48px;
height: 48px;
border-radius: 50%;
background: var(--bg-secondary);
border: 2px solid var(--border-color);
display: flex;
align-items: center;
justify-content: center;
font-weight: 800;
font-size: 18px;
margin: 0 auto 12px;
transition: all 0.3s;
color: var(--text-secondary);
}
.stage-item.active .stage-number {
border-color: var(--accent-cyan);
color: var(--accent-cyan);
box-shadow: 0 0 30px rgba(100, 255, 218, 0.1);
}
.stage-item h4 { font-size: 15px; font-weight: 600; margin-bottom: 4px; }
.stage-item p { color: var(--text-secondary); font-size: 13px; }
/* ===== О КОМПАНИИ ===== */
.about-grid {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 60px;
align-items: center;
margin-top: 48px;
}
.about-text p {
color: var(--text-secondary);
font-size: 17px;
line-height: 1.8;
margin-bottom: 16px;
}
.about-features {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 16px;
margin-top: 24px;
}
.about-feature {
display: flex;
align-items: center;
gap: 10px;
color: var(--text-secondary);
font-size: 14px;
}
.about-feature .check {
color: var(--accent-cyan);
font-weight: 700;
}
.about-image {
background: var(--bg-secondary);
border: 1px solid var(--border-color);
border-radius: 16px;
padding: 40px;
text-align: center;
font-size: 72px;
min-height: 300px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.about-image p {
margin-top: 16px;
color: var(--text-secondary);
font-size: 16px;
}
/* ===== ФОРМА ===== */
.form-wrapper {
max-width: 600px;
margin: 48px auto 0;
}
.form-group {
margin-bottom: 20px;
}
.form-group label {
display: block;
margin-bottom: 8px;
font-weight: 600;
font-size: 14px;
}
.form-group input,
.form-group textarea,
.form-group select {
width: 100%;
padding: 14px 18px;
border-radius: 12px;
border: 1px solid var(--border-color);
background: var(--bg-secondary);
color: var(--text-primary);
font-size: 16px;
transition: all 0.3s;
font-family: 'Inter', sans-serif;
}
.form-group input:focus,
.form-group textarea:focus {
outline: none;
border-color: var(--accent-blue);
box-shadow: 0 0 0 3px rgba(79, 172, 254, 0.1);
}
.form-group textarea {
resize: vertical;
min-height: 120px;
}
.form-success {
display: none;
padding: 16px 24px;
background: rgba(100, 255, 218, 0.08);
border: 1px solid rgba(100, 255, 218, 0.15);
border-radius: 12px;
color: var(--accent-cyan);
text-align: center;
margin-top: 20px;
}
/* ===== КОНТАКТЫ ===== */
.contact-info {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 24px;
margin-top: 48px;
text-align: center;
}
.contact-item {
background: var(--bg-secondary);
border: 1px solid var(--border-color);
border-radius: 16px;
padding: 24px;
transition: all 0.3s;
}
.contact-item:hover {
transform: translateY(-4px);
border-color: rgba(79, 172, 254, 0.2);
}
.contact-item .icon {
font-size: 32px;
display: block;
margin-bottom: 12px;
}
.contact-item h4 { font-size: 16px; margin-bottom: 4px; }
.contact-item a {
color: var(--accent-cyan);
text-decoration: none;
font-size: 14px;
}
.contact-item a:hover { text-decoration: underline; }
/* ===== ФУТЕР ===== */
.footer {
padding: 40px 0;
border-top: 1px solid var(--border-color);
text-align: center;
color: var(--text-secondary);
font-size: 14px;
}
.footer .social {
display: flex;
justify-content: center;
gap: 24px;
margin-bottom: 16px;
}
.footer .social a {
color: var(--text-secondary);
text-decoration: none;
transition: color 0.3s;
font-size: 16px;
}
.footer .social a:hover { color: var(--text-primary); }
/* ===== АНИМАЦИИ ===== */
@keyframes fadeInUp {
from {
opacity: 0;
transform: translateY(40px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
.animate-on-scroll {
opacity: 0;
transform: translateY(40px);
transition: all 0.8s ease;
}
.animate-on-scroll.visible {
opacity: 1;
transform: translateY(0);
}
/* ===== АДАПТИВ ===== */
@media (max-width: 992px) {
.hero-content {
grid-template-columns: 1fr;
text-align: center;
}
.hero-description {
margin-left: auto;
margin-right: auto;
}
.hero-buttons { justify-content: center; }
.hero-stats { justify-content: center; }
.hero-visual .code-block { max-width: 100%; }
.about-grid { grid-template-columns: 1fr; text-align: center; }
.about-features { justify-items: center; }
.stages-timeline::before { display: none; }
.stage-item { flex: 0 0 calc(50% - 20px); }
.section-title { font-size: 34px; }
.hero-title { font-size: 44px; }
.subscriptions-grid { grid-template-columns: 1fr 1fr; }
.portfolio-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 768px) {
.nav-links {
display: none;
flex-direction: column;
position: absolute;
top: 100%;
left: 0;
width: 100%;
background: var(--bg-primary);
padding: 24px;
gap: 16px;
border-bottom: 1px solid var(--border-color);
}
.nav-links.open { display: flex; }
.nav-toggle { display: flex; }
.hero-title { font-size: 34px; }
.hero-stats { flex-wrap: wrap; gap: 24px; }
.hero-stat h3 { font-size: 24px; }
.services-grid { grid-template-columns: 1fr; }
.portfolio-grid { grid-template-columns: 1fr; }
.about-features { grid-template-columns: 1fr; }
.stage-item { flex: 0 0 100%; }
.section { padding: 60px 0; }
.section-title { font-size: 28px; }
.contact-info { grid-template-columns: 1fr; }
.subscriptions-grid { grid-template-columns: 1fr; }
.subscription-card.featured { transform: scale(1.02); }
}
</style>
</head>
<body>
<div class="bg-animation">
<div class="orb"></div>
<div class="orb"></div>
<div class="orb"></div>
</div>
<div class="grid-overlay"></div>
<nav class="nav" id="nav">
<div class="container">
<a href="/" class="nav-logo">
🤖 <span class="logo-highlight">BotNova</span>
</a>
<div class="nav-links" id="navLinks">
<a href="#services">Услуги</a>
<a href="#subscriptions">Тарифы</a>
<a href="#portfolio">Портфолио</a>
<a href="#about">О нас</a>
<a href="#contact">Контакты</a>
<a href="#form" class="nav-cta">Заказать</a>
<a href="/cabinet/login.php">🔑 Войти</a>
</div>
<button class="nav-toggle" id="navToggle" aria-label="Меню">
<span></span><span></span><span></span>
</button>
</div>
</nav>
<!-- ===== ГЕРОЙ ===== -->
<section class="hero" id="home">
<div class="container">
<div class="hero-content">
<div class="hero-text">
<div class="hero-badge">🔥 Скидки до 85%</div>
<h1 class="hero-title">
Создаём <span class="highlight">сайты</span> и<br>
<span class="highlight">Telegram-ботов</span>
</h1>
<p class="hero-description">
Разрабатываем цифровые продукты, которые помогают бизнесу расти.
От лендингов до сложной автоматизации. Доступные цены для стартапов.
</p>
<div class="hero-buttons">
<a href="#subscriptions" class="btn btn-primary">Выбрать тариф</a>
<a href="#services" class="btn btn-secondary">Наши услуги</a>
</div>
<div class="hero-stats">
<div class="hero-stat"><h3>5+</h3><p>Лет опыта</p></div>
<div class="hero-stat"><h3>50+</h3><p>Реализованных проектов</p></div>
<div class="hero-stat"><h3>100%</h3><p>Довольных клиентов</p></div>
</div>
</div>
<div class="hero-visual">
<div class="code-block">
<div class="floating-icons">
<span></span><span></span><span></span>
</div>
<div class="code-line"><span class="comment">// Разработка под ключ</span></div>
<div class="code-line"><span class="keyword">const</span> <span class="variable">studio</span> = <span class="keyword">new</span> <span class="function">BotNova</span>();</div>
<div class="code-line"><span class="variable">studio</span>.<span class="function">createProject</span>({</div>
<div class="code-line"> <span class="variable">type</span>: <span class="string">'site'</span>,</div>
<div class="code-line"> <span class="variable">design</span>: <span class="string">'modern'</span>,</div>
<div class="code-line"> <span class="variable">budget</span>: <span class="string">'от 10 000 ₽'</span>,</div>
<div class="code-line">});</div>
<div class="code-line"><span class="comment">// ✅ Проект готов!</span></div>
<div class="code-line"><span class="cursor"></span></div>
</div>
</div>
</div>
</div>
</section>
<!-- ===== УСЛУГИ ===== -->
<section class="section" id="services">
<div class="container">
<span class="section-label animate-on-scroll">Услуги</span>
<h2 class="section-title animate-on-scroll">Что мы <span class="highlight">делаем</span></h2>
<p class="section-subtitle animate-on-scroll">Разрабатываем цифровые продукты, которые приносят пользу вашему бизнесу</p>
<div class="services-grid">
<div class="service-card animate-on-scroll">
<span class="service-icon">🖥</span>
<h3>Разработка сайтов</h3>
<p>Лендинги, интернет-магазины, корпоративные порталы под ключ.</p>
<div class="price-block">
<span class="price-old">от 50 000 ₽</span>
<span class="price-new">от 10 000 ₽</span>
<span class="price-badge">🔥 Скидка 80%</span>
</div>
</div>
<div class="service-card animate-on-scroll">
<span class="service-icon">🤖</span>
<h3>Telegram-боты</h3>
<p>Автоматизация продаж, рассылок и поддержки в мессенджере.</p>
<div class="price-block">
<span class="price-old">от 30 000 ₽</span>
<span class="price-new">от 5 000 ₽</span>
<span class="price-badge">🔥 Скидка 83%</span>
</div>
</div>
<div class="service-card animate-on-scroll">
<span class="service-icon">⚙</span>
<h3>Автоматизация</h3>
<p>Интеграция CRM, настройка бизнес-процессов, дашборды для аналитики.</p>
<div class="price-block">
<span class="price-old">по запросу</span>
<span class="price-new">от 3 000 ₽</span>
<span class="price-badge">🚀 Старт</span>
</div>
</div>
<div class="service-card animate-on-scroll">
<span class="service-icon">📈</span>
<h3>Продвижение</h3>
<p>SEO-оптимизация, контекстная реклама, настройка аналитики.</p>
<div class="price-block">
<span class="price-old">от 20 000 ₽</span>
<span class="price-new">от 3 000 ₽</span>
<span class="price-badge">🔥 Скидка 85%</span>
</div>
</div>
</div>
</div>
</section>
<!-- ===== ТАРИФЫ ===== -->
<section class="section" id="subscriptions" style="background: var(--bg-secondary);">
<div class="container">
<span class="section-label animate-on-scroll">Тарифы</span>
<h2 class="section-title animate-on-scroll">Выберите <span class="highlight">подписку</span></h2>
<p class="section-subtitle animate-on-scroll">Гибкие тарифы для любого бизнеса. Оплата помесячно, без скрытых платежей.</p>
<div class="subscriptions-grid">
<div class="subscription-card animate-on-scroll">
<div class="subscription-badge">🌟 Старт</div>
<div class="subscription-price">
<span class="price">9 900 ₽</span>
<span class="period">/ месяц</span>
</div>
<ul class="subscription-features">
<li>✅ Лендинг до 5 страниц</li>
<li>✅ Адаптивный дизайн</li>
<li>✅ Форма обратной связи</li>
<li>✅ 1 месяц техподдержки</li>
<li>✅ Базовая SEO-оптимизация</li>
</ul>
<a href="#form" class="btn btn-primary btn-subscribe" onclick="selectTariff('Старт', 9900)">Выбрать тариф</a>
</div>
<div class="subscription-card featured animate-on-scroll">
<div class="subscription-badge">🔥 Бизнес</div>
<div class="subscription-price">
<span class="price">19 900 ₽</span>
<span class="period">/ месяц</span>
</div>
<ul class="subscription-features">
<li>✅ Интернет-магазин до 50 товаров</li>
<li>✅ Корпоративный дизайн</li>
<li>✅ Telegram-бот</li>
<li>✅ Интеграция с CRM</li>
<li>✅ 3 месяца техподдержки</li>
<li>✅ SEO-оптимизация</li>
<li>✅ Контекстная реклама</li>
</ul>
<a href="#form" class="btn btn-primary btn-subscribe" onclick="selectTariff('Бизнес', 19900)">Выбрать тариф</a>
</div>
<div class="subscription-card animate-on-scroll">
<div class="subscription-badge">💎 VIP</div>
<div class="subscription-price">
<span class="price">39 900 ₽</span>
<span class="period">/ месяц</span>
</div>
<ul class="subscription-features">
<li>✅ Корпоративный портал</li>
<li>✅ Кастомизированная разработка</li>
<li>✅ Telegram-бот с AI</li>
<li>✅ Полная автоматизация бизнеса</li>
<li>✅ Круглосуточная поддержка</li>
<li>✅ SEO + контекстная реклама</li>
<li>✅ 6 месяцев техподдержки</li>
</ul>
<a href="#form" class="btn btn-primary btn-subscribe" onclick="selectTariff('VIP', 39900)">Выбрать тариф</a>
</div>
</div>
</div>
</section>
<!-- ===== ПОРТФОЛИО (ОБНОВЛЕНО) ===== -->
<section class="section" id="portfolio">
<div class="container">
<span class="section-label animate-on-scroll">Портфолио</span>
<h2 class="section-title animate-on-scroll">Наши <span class="highlight">работы</span></h2>
<p class="section-subtitle animate-on-scroll">Демо-версии проектов — показываем, что умеем</p>
<div class="portfolio-grid">
<div class="portfolio-card animate-on-scroll">
<div class="portfolio-image">
🛒
<span class="demo-badge">Демо</span>
<a href="https://demo.botnova-studio.ru" target="_blank" class="demo-link">🔗 Смотреть демо</a>
</div>
<h4>Интернет-магазин техники</h4>
<p>Современный интернет-магазин с корзиной, оплатой и админ-панелью</p>
<div class="tech-stack">
<span>PHP</span>
<span>Node.js</span>
<span>PostgreSQL</span>
</div>
</div>
<!-- Следующие карточки можно добавить позже, оставлены как заглушки -->
<div class="portfolio-card animate-on-scroll" style="opacity:0.5;">
<div class="portfolio-image" style="background: linear-gradient(135deg, #1a1a2e, #0a0a1a);">
🚧
<span class="demo-badge">Скоро</span>
</div>
<h4>Новый проект</h4>
<p>Скоро здесь появится новый демо-проект</p>
<div class="tech-stack">
<span>Скоро</span>
</div>
</div>
<div class="portfolio-card animate-on-scroll" style="opacity:0.5;">
<div class="portfolio-image" style="background: linear-gradient(135deg, #1a1a2e, #0a0a1a);">
🚧
<span class="demo-badge">Скоро</span>
</div>
<h4>Новый проект</h4>
<p>Скоро здесь появится новый демо-проект</p>
<div class="tech-stack">
<span>Скоро</span>
</div>
</div>
</div>
</div>
</section>
<!-- ===== ЭТАПЫ ===== -->
<section class="section" style="background: var(--bg-secondary);">
<div class="container">
<span class="section-label animate-on-scroll">Процесс</span>
<h2 class="section-title animate-on-scroll">Как мы <span class="highlight">работаем</span></h2>
<p class="section-subtitle animate-on-scroll">Прозрачный процесс разработки с контролем на каждом этапе</p>
<div class="stages-timeline">
<div class="stage-item active animate-on-scroll"><div class="stage-number">1</div><h4>Заявка</h4><p>Вы оставляете заявку</p></div>
<div class="stage-item animate-on-scroll"><div class="stage-number">2</div><h4>Созвон</h4><p>Обсуждаем задачу</p></div>
<div class="stage-item animate-on-scroll"><div class="stage-number">3</div><h4>Договор</h4><p>Фиксируем сроки</p></div>
<div class="stage-item animate-on-scroll"><div class="stage-number">4</div><h4>Разработка</h4><p>Создаём ваш продукт</p></div>
<div class="stage-item animate-on-scroll"><div class="stage-number">5</div><h4>Тестирование</h4><p>Проверяем качество</p></div>
<div class="stage-item animate-on-scroll"><div class="stage-number">6</div><h4>Запуск</h4><p>Деплой на сервер</p></div>
<div class="stage-item animate-on-scroll"><div class="stage-number">7</div><h4>Поддержка</h4><p>Мы всегда на связи</p></div>
</div>
</div>
</section>
<!-- ===== О КОМПАНИИ ===== -->
<section class="section" id="about" style="background: var(--bg-secondary);">
<div class="container">
<div class="about-grid">
<div class="about-text animate-on-scroll">
<span class="section-label">О нас</span>
<h2 class="section-title">Молодая студия с <span class="highlight">свежим взглядом</span></h2>
<p>BotNova Studio — команда разработчиков и дизайнеров, которые любят свою работу. Мы создаём цифровые продукты, которые помогают бизнесу расти и развиваться.</p>
<p>Мы не боимся сложных задач и всегда идём в ногу со временем, используя современные технологии и подходы.</p>
<div class="about-features">
<div class="about-feature"><span class="check">✓</span> Индивидуальный подход</div>
<div class="about-feature"><span class="check">✓</span> Современные технологии</div>
<div class="about-feature"><span class="check">✓</span> Прозрачные цены</div>
<div class="about-feature"><span class="check">✓</span> Поддержка 24/7</div>
</div>
</div>
<div class="about-image animate-on-scroll">
🤖
<p style="font-size: 18px; font-weight: 600; -webkit-text-fill-color: initial; color: var(--text-primary);">BotNova Studio</p>
<p style="font-size: 14px;">Разработка с душой</p>
</div>
</div>
</div>
</section>
<!-- ===== ФОРМА ===== -->
<section class="section" id="form">
<div class="container">
<span class="section-label animate-on-scroll">Заявка</span>
<h2 class="section-title animate-on-scroll">Обсудить <span class="highlight">проект</span></h2>
<p class="section-subtitle animate-on-scroll">Оставьте заявку, и мы свяжемся с вами в течение 15 минут</p>
<div class="form-wrapper animate-on-scroll">
<form id="requestForm">
<div class="form-group">
<label for="name">Ваше имя *</label>
<input type="text" id="name" name="name" placeholder="Иван Иванов" required>
</div>
<div class="form-group">
<label for="phone">Телефон *</label>
<input type="tel" id="phone" name="phone" placeholder="+7 (999) 123-45-67" required>
</div>
<div class="form-group">
<label for="email">Email</label>
<input type="email" id="email" name="email" placeholder="ivan@mail.ru">
</div>
<div class="form-group">
<label for="service">Услуга *</label>
<select id="service" name="service" required>
<option value="">Выберите услугу</option>
<option value="sites">Разработка сайтов</option>
<option value="bots">Telegram-боты</option>
<option value="automation">Автоматизация</option>
<option value="marketing">Продвижение</option>
</select>
</div>
<div class="form-group">
<label for="budget">Бюджет</label>
<select id="budget" name="budget">
<option value="">Не указан</option>
<option value="0-50k">до 50 000 ₽</option>
<option value="50-150k">50 000 - 150 000 ₽</option>
<option value="150-300k">150 000 - 300 000 ₽</option>
<option value="300k+">от 300 000 ₽</option>
</select>
</div>
<div class="form-group">
<label for="description">Описание задачи</label>
<textarea id="description" name="description" placeholder="Расскажите подробнее о вашем проекте..."></textarea>
</div>
<button type="submit" class="btn btn-primary" style="width: 100%;">Отправить заявку</button>
<div class="form-success" id="formSuccess">✅ Спасибо! Мы свяжемся с вами в ближайшее время.</div>
</form>
</div>
</div>
</section>
<!-- ===== КОНТАКТЫ ===== -->
<section class="section" id="contact" style="background: var(--bg-secondary);">
<div class="container">
<span class="section-label animate-on-scroll">Контакты</span>
<h2 class="section-title animate-on-scroll">Свяжитесь с <span class="highlight">нами</span></h2>
<p class="section-subtitle animate-on-scroll">Всегда на связи для ваших проектов</p>
<div class="contact-info">
<div class="contact-item animate-on-scroll">
<span class="icon">📱</span>
<h4>Telegram</h4>
<a href="https://t.me/slavastaryi" target="_blank">@SlavaStaryi</a>
</div>
<div class="contact-item animate-on-scroll">
<span class="icon">📧</span>
<h4>Email</h4>
<a href="mailto:vyacheslavivliev2021@yandex.ru">vyacheslavivliev2021@yandex.ru</a>
</div>
<div class="contact-item animate-on-scroll">
<span class="icon">💬</span>
<h4>VK</h4>
<a href="https://vk.ru/staryi_slava" target="_blank">Написать в VK</a>
</div>
<div class="contact-item animate-on-scroll">
<span class="icon">🌐</span>
<h4>Сайт</h4>
<a href="https://botnova-studio.ru">botnova-studio.ru</a>
</div>
</div>
</div>
</section>
<!-- ===== ФУТЕР ===== -->
<footer class="footer">
<div class="container">
<div class="social">
<a href="https://t.me/slavastaryi" target="_blank">📱 Telegram</a>
<a href="https://vk.ru/staryi_slava" target="_blank">💬 VK</a>
<a href="mailto:vyacheslavivliev2021@yandex.ru">📧 Email</a>
</div>
<p>© 2026 BotNova Studio. Все права защищены.</p>
<p style="margin-top: 4px; font-size: 12px; color: #2a2a4a;">Разработка сайтов и Telegram-ботов</p>
</div>
</footer>
<script>
// ===== НАВИГАЦИЯ =====
const nav = document.getElementById('nav');
const navToggle = document.getElementById('navToggle');
const navLinks = document.getElementById('navLinks');
navToggle.addEventListener('click', () => {
navLinks.classList.toggle('open');
});
document.querySelectorAll('.nav-links a').forEach(link => {
link.addEventListener('click', () => {
navLinks.classList.remove('open');
});
});
window.addEventListener('scroll', () => {
if (window.scrollY > 50) {
nav.classList.add('scrolled');
} else {
nav.classList.remove('scrolled');
}
});
// ===== АНИМАЦИЯ ПРИ СКРОЛЛЕ =====
const animateElements = document.querySelectorAll('.animate-on-scroll');
const observer = new IntersectionObserver((entries) => {
entries.forEach(entry => {
if (entry.isIntersecting) {
entry.target.classList.add('visible');
}
});
}, {
threshold: 0.1,
rootMargin: '0px 0px -50px 0px'
});
animateElements.forEach(el => observer.observe(el));
// ===== МАСКА ТЕЛЕФОНА =====
const phoneInput = document.getElementById('phone');
phoneInput.addEventListener('input', function(e) {
let value = this.value.replace(/\D/g, '');
if (value.length > 11) value = value.slice(0, 11);
let formatted = '';
if (value.length > 0) {
formatted = '+7';
if (value.length > 1) {
formatted += ' (' + value.slice(1, 4);
}
if (value.length >= 4) {
formatted += ') ' + value.slice(4, 7);
}
if (value.length >= 7) {
formatted += '-' + value.slice(7, 9);
}
if (value.length >= 9) {
formatted += '-' + value.slice(9, 11);
}
}
this.value = formatted;
});
// ===== ОТПРАВКА ФОРМЫ =====
document.getElementById('requestForm').addEventListener('submit', async function(e) {
e.preventDefault();
const formData = new FormData(this);
const data = Object.fromEntries(formData);
data.source = 'site';
if (!data.name || data.name.length < 2) {
alert('Введите ваше имя');
return;
}
if (!data.phone || data.phone.replace(/\D/g, '').length < 10) {
alert('Введите корректный номер телефона');
return;
}
if (!data.service) {
alert('Выберите услугу');
return;
}
try {
const response = await fetch('/api/requests', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify(data)
});
const result = await response.json();
if (response.ok) {
document.getElementById('formSuccess').style.display = 'block';
this.reset();
setTimeout(() => {
document.getElementById('formSuccess').style.display = 'none';
}, 5000);
} else {
alert(result.message || 'Произошла ошибка. Попробуйте позже.');
}
} catch (error) {
console.error('Ошибка:', error);
alert('Произошла ошибка. Попробуйте позже.');
}
});
// ===== ПЛАВНЫЙ СКРОЛЛ =====
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
anchor.addEventListener('click', function(e) {
const href = this.getAttribute('href');
if (href === '#') return;
e.preventDefault();
const target = document.querySelector(href);
if (target) {
target.scrollIntoView({ behavior: 'smooth' });
}
});
});
// ===== ВЫБОР ТАРИФА =====
function selectTariff(name, price) {
const serviceSelect = document.getElementById('service');
const descriptionText = document.getElementById('description');
if (serviceSelect) {
serviceSelect.value = 'sites';
}
if (descriptionText) {
descriptionText.value = `Тариф: ${name} (${price.toLocaleString()} ₽/месяц)`;
descriptionText.focus();
}
document.getElementById('form').scrollIntoView({ behavior: 'smooth' });
}
console.log('🚀 BotNova Studio готов к работе!');
</script>
</body>
</html>
nginx