mirror of
https://github.com/wasrusgen/wasrusgen1-crm.git
synced 2026-06-03 23:04:46 +00:00
461 lines
29 KiB
HTML
461 lines
29 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="ru">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>AI КОНСАЛТИНГ CRM — @wasrusgen1</title>
|
||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Montserrat:wght@700;800&display=swap" rel="stylesheet">
|
||
<style>
|
||
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
|
||
:root {
|
||
--bg: #0F172A;
|
||
--bg2: #1E293B;
|
||
--bg3: #0D1B2A;
|
||
--accent: #10B981;
|
||
--accent2: #047857;
|
||
--accent3: #34D399;
|
||
--text: #F1F5F9;
|
||
--muted: #94A3B8;
|
||
--border: #334155;
|
||
}
|
||
html { scroll-behavior: smooth; }
|
||
body { background: var(--bg); color: var(--text); font-family: 'Inter', sans-serif; font-size: 16px; line-height: 1.6; -webkit-font-smoothing: antialiased; }
|
||
h1,h2,h3 { font-family: 'Montserrat', sans-serif; }
|
||
a { text-decoration: none; color: inherit; }
|
||
.container { max-width: 1120px; margin: 0 auto; padding: 0 24px; }
|
||
|
||
/* NAV */
|
||
nav {
|
||
position: fixed; top: 0; left: 0; right: 0; z-index: 100;
|
||
background: rgba(15,23,42,0.85); backdrop-filter: blur(12px);
|
||
border-bottom: 1px solid var(--border);
|
||
padding: 0 24px;
|
||
height: 64px; display: flex; align-items: center; justify-content: space-between;
|
||
}
|
||
.nav-logo { font-family: 'Montserrat', sans-serif; font-weight: 800; font-size: 20px; color: var(--accent); letter-spacing: -0.5px; }
|
||
.nav-logo span { color: var(--text); }
|
||
.nav-links { display: flex; gap: 32px; }
|
||
.nav-links a { font-size: 14px; font-weight: 500; color: var(--muted); transition: color 0.2s; }
|
||
.nav-links a:hover { color: var(--text); }
|
||
.nav-cta { background: var(--accent); color: #fff; padding: 8px 20px; border-radius: 8px; font-size: 14px; font-weight: 600; transition: background 0.2s; }
|
||
.nav-cta:hover { background: var(--accent2); color: #fff; }
|
||
|
||
/* HERO */
|
||
.hero {
|
||
min-height: 100vh;
|
||
background: linear-gradient(135deg, #064E3B 0%, #0F172A 50%, #0F172A 100%);
|
||
display: flex; align-items: center; justify-content: center;
|
||
text-align: center; padding: 80px 24px 60px;
|
||
position: relative; overflow: hidden;
|
||
}
|
||
.hero::before {
|
||
content: '';
|
||
position: absolute; inset: 0;
|
||
background: radial-gradient(ellipse 80% 60% at 50% 30%, rgba(16,185,129,0.12) 0%, transparent 70%);
|
||
}
|
||
.hero-content { position: relative; z-index: 1; max-width: 800px; }
|
||
.hero-badge {
|
||
display: inline-flex; align-items: center; gap: 8px;
|
||
background: rgba(16,185,129,0.12); border: 1px solid rgba(16,185,129,0.3);
|
||
color: var(--accent3); padding: 6px 16px; border-radius: 100px;
|
||
font-size: 13px; font-weight: 600; letter-spacing: 0.5px; margin-bottom: 28px;
|
||
}
|
||
.hero-badge::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: var(--accent); display: block; }
|
||
.hero h1 { font-size: clamp(32px, 6vw, 60px); font-weight: 800; line-height: 1.1; margin-bottom: 20px; letter-spacing: -1px; }
|
||
.hero h1 em { font-style: normal; color: var(--accent); }
|
||
.hero p { font-size: clamp(16px, 2vw, 20px); color: var(--muted); max-width: 600px; margin: 0 auto 40px; }
|
||
.hero-btns { display: flex; gap: 16px; justify-content: center; flex-wrap: wrap; }
|
||
.btn-primary {
|
||
background: var(--accent); color: #fff; padding: 14px 32px; border-radius: 10px;
|
||
font-size: 16px; font-weight: 600; transition: transform .25s cubic-bezier(.2,.7,.3,1), box-shadow .25s, background .2s;
|
||
box-shadow: 0 4px 20px rgba(16,185,129,0.3);
|
||
position: relative; overflow: hidden; isolation: isolate;
|
||
}
|
||
/* блик, пробегающий по кнопке при наведении (timeweb-style) */
|
||
.btn-primary::after {
|
||
content: ''; position: absolute; top: 0; left: -120%; width: 70%; height: 100%; z-index: -1;
|
||
background: linear-gradient(100deg, transparent, rgba(255,255,255,.35), transparent);
|
||
transform: skewX(-18deg); transition: left .6s ease;
|
||
}
|
||
.btn-primary:hover { background: var(--accent2); transform: translateY(-3px); box-shadow: 0 14px 38px rgba(16,185,129,0.45); }
|
||
.btn-primary:hover::after { left: 130%; }
|
||
.btn-primary:active { transform: translateY(-1px) scale(.98); }
|
||
/* стрелка → в тексте кнопки уезжает вправо */
|
||
.btn-arrow { display: inline-block; transition: transform .25s cubic-bezier(.2,.7,.3,1); }
|
||
.btn-primary:hover .btn-arrow { transform: translateX(5px); }
|
||
.btn-outline {
|
||
background: transparent; color: var(--text); padding: 14px 32px; border-radius: 10px;
|
||
font-size: 16px; font-weight: 600; border: 1px solid var(--border);
|
||
transition: border-color .25s, color .25s, transform .25s cubic-bezier(.2,.7,.3,1), box-shadow .25s;
|
||
}
|
||
.btn-outline:hover { border-color: var(--accent); color: var(--accent); transform: translateY(-3px); box-shadow: 0 10px 26px rgba(16,185,129,.18); }
|
||
.btn-outline:active { transform: translateY(-1px) scale(.98); }
|
||
.hero-stat { display: flex; gap: 48px; justify-content: center; margin-top: 60px; padding-top: 40px; border-top: 1px solid var(--border); }
|
||
.stat-item { text-align: center; }
|
||
.stat-num { font-family: 'Montserrat', sans-serif; font-size: 28px; font-weight: 800; color: var(--accent); }
|
||
.stat-label { font-size: 13px; color: var(--muted); margin-top: 4px; }
|
||
|
||
/* SECTIONS */
|
||
section { padding: 96px 24px; }
|
||
.section-tag { font-size: 13px; font-weight: 700; color: var(--accent); text-transform: uppercase; letter-spacing: 1.5px; margin-bottom: 12px; }
|
||
.section-title { font-size: clamp(26px, 4vw, 40px); font-weight: 800; margin-bottom: 16px; letter-spacing: -0.5px; }
|
||
.section-sub { font-size: 17px; color: var(--muted); max-width: 560px; }
|
||
|
||
/* PROBLEM */
|
||
.problem { background: var(--bg); }
|
||
.problem-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 24px; margin-top: 56px; }
|
||
.problem-card {
|
||
background: var(--bg2); border: 1px solid var(--border); border-radius: 20px;
|
||
padding: 32px; position: relative; overflow: hidden;
|
||
}
|
||
.problem-card::before {
|
||
content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px;
|
||
background: linear-gradient(90deg, #EF4444, #F97316);
|
||
}
|
||
.problem-icon { font-size: 32px; margin-bottom: 16px; }
|
||
.problem-card h3 { font-size: 18px; font-weight: 700; margin-bottom: 10px; font-family: 'Inter', sans-serif; }
|
||
.problem-card p { font-size: 14px; color: var(--muted); }
|
||
|
||
/* FEATURES */
|
||
.features { background: linear-gradient(180deg, #0A1628 0%, var(--bg) 100%); }
|
||
.features-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 20px; margin-top: 56px; }
|
||
.feature-card {
|
||
background: var(--bg2); border: 1px solid var(--border); border-radius: 20px;
|
||
padding: 28px; transition: all .2s ease-in-out;
|
||
}
|
||
/* hover feature-card — см. общий блок «бегущий огонь» ниже */
|
||
.feature-icon { width: 48px; height: 48px; background: rgba(16,185,129,0.1); border-radius: 12px; display: flex; align-items: center; justify-content: center; font-size: 22px; margin-bottom: 16px; transition: transform .3s cubic-bezier(.2,.7,.3,1), background .3s, box-shadow .3s; }
|
||
.feature-card:hover .feature-icon { transform: translateY(-2px) scale(1.08); background: rgba(16,185,129,0.18); box-shadow: 0 8px 22px rgba(16,185,129,.28); }
|
||
.feature-card:hover .feature-icon svg { stroke: #10B981; }
|
||
.feature-card h3 { font-size: 17px; font-weight: 700; margin-bottom: 8px; font-family: 'Inter', sans-serif; }
|
||
.feature-card p { font-size: 14px; color: var(--muted); }
|
||
|
||
/* секции, где карточки увеличиваются при hover — режем по X, по Y видимость сохраняем,
|
||
чтобы подъём/свечение не создавали горизонтальный скролл и не обрезались сверху */
|
||
.problem, .features, .funnel, .demo { overflow-x: clip; overflow-y: visible; }
|
||
|
||
/* FUNNEL */
|
||
.funnel { background: var(--bg2); }
|
||
.funnel-flow { display: flex; align-items: flex-start; gap: 0; margin-top: 56px; overflow: visible; padding: 10px 0 24px; }
|
||
@media (max-width: 760px) { .funnel-flow { overflow-x: auto; -webkit-overflow-scrolling: touch; } }
|
||
.funnel-step {
|
||
flex: 1; min-width: 160px;
|
||
background: var(--bg); border: 1px solid var(--border); border-radius: 14px;
|
||
padding: 24px 20px; text-align: center; position: relative;
|
||
}
|
||
.funnel-step.active { border-color: var(--accent); background: rgba(16,185,129,0.05); }
|
||
.funnel-arrow {
|
||
flex: 0 0 32px; display: flex; align-items: center; justify-content: center;
|
||
color: var(--accent); font-size: 20px; padding-top: 36px;
|
||
}
|
||
.funnel-num {
|
||
width: 32px; height: 32px; border-radius: 50%; background: rgba(16,185,129,0.15);
|
||
color: var(--accent); font-weight: 700; font-size: 14px;
|
||
display: flex; align-items: center; justify-content: center; margin: 0 auto 12px;
|
||
}
|
||
.funnel-step.active .funnel-num { background: var(--accent); color: #fff; }
|
||
.funnel-num { transition: transform .3s cubic-bezier(.2,.7,.3,1), box-shadow .3s; }
|
||
.funnel-step:hover .funnel-num { transform: translateY(-2px) scale(1.1); box-shadow: 0 8px 20px rgba(16,185,129,.3); }
|
||
.funnel-step h4 { font-size: 14px; font-weight: 700; margin-bottom: 8px; }
|
||
.funnel-step p { font-size: 12px; color: var(--muted); line-height: 1.5; }
|
||
.funnel-desc { margin-top: 40px; display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 20px; }
|
||
|
||
/* DEMO */
|
||
.demo { background: var(--bg); }
|
||
.demo-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 20px; margin-top: 56px; }
|
||
.demo-card {
|
||
background: var(--bg2); border: 1px solid var(--border); border-radius: 20px;
|
||
padding: 28px; transition: all 0.2s;
|
||
}
|
||
.demo-card:hover { border-color: var(--accent); transform: translateY(-2px); box-shadow: 0 8px 30px rgba(0,0,0,0.2); }
|
||
.demo-num { font-family: 'Montserrat', sans-serif; font-size: 36px; font-weight: 800; color: rgba(16,185,129,0.2); margin-bottom: 16px; line-height: 1; }
|
||
.demo-card h3 { font-size: 17px; font-weight: 700; margin-bottom: 8px; }
|
||
.demo-card p { font-size: 13px; color: var(--muted); margin-bottom: 20px; }
|
||
.demo-link {
|
||
display: inline-flex; align-items: center; gap: 6px;
|
||
color: var(--accent); font-size: 14px; font-weight: 600;
|
||
transition: gap 0.2s;
|
||
}
|
||
.demo-link:hover { gap: 10px; }
|
||
.demo-link::after { content: '→'; }
|
||
|
||
/* FOOTER */
|
||
footer {
|
||
background: var(--bg3); border-top: 1px solid var(--border);
|
||
padding: 48px 24px;
|
||
}
|
||
.footer-inner { max-width: 1120px; margin: 0 auto; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 24px; }
|
||
.footer-brand .logo { font-family: 'Montserrat', sans-serif; font-weight: 800; font-size: 20px; color: var(--accent); }
|
||
.footer-brand p { font-size: 13px; color: var(--muted); margin-top: 6px; }
|
||
.footer-links { display: flex; gap: 24px; }
|
||
.footer-links a { font-size: 14px; color: var(--muted); transition: color 0.2s; }
|
||
.footer-links a:hover { color: var(--text); }
|
||
.footer-contact { font-size: 14px; color: var(--muted); }
|
||
.footer-contact a { color: var(--accent); }
|
||
.footer-bottom { max-width: 1120px; margin: 24px auto 0; padding-top: 24px; border-top: 1px solid var(--border); display: flex; justify-content: space-between; flex-wrap: wrap; gap: 12px; }
|
||
.footer-bottom p { font-size: 13px; color: var(--muted); }
|
||
|
||
@media(max-width: 768px) {
|
||
.nav-links { display: none; }
|
||
.hero-stat { gap: 24px; flex-wrap: wrap; }
|
||
.funnel-flow { flex-wrap: nowrap; }
|
||
.footer-inner { justify-content: center; text-align: center; }
|
||
.footer-links { justify-content: center; }
|
||
.footer-bottom { justify-content: center; }
|
||
}
|
||
|
||
/* ── Анимации ── */
|
||
@keyframes riseIn { from { opacity:0; transform: translateY(22px); } to { opacity:1; transform: none; } }
|
||
.hero-content > * { animation: riseIn .75s cubic-bezier(.2,.7,.3,1) both; }
|
||
.hero-badge { animation-delay: .05s; }
|
||
.hero h1 { animation-delay: .15s; }
|
||
.hero p { animation-delay: .28s; }
|
||
.hero-btns { animation-delay: .40s; }
|
||
.hero-stat { animation-delay: .54s; }
|
||
|
||
.reveal { opacity:0; transform: translateY(26px); transition: opacity .6s ease, transform .65s cubic-bezier(.2,.7,.3,1); }
|
||
.reveal.in { opacity:1; transform: none; }
|
||
.reveal-d1{transition-delay:.08s} .reveal-d2{transition-delay:.16s} .reveal-d3{transition-delay:.24s} .reveal-d4{transition-delay:.32s} .reveal-d5{transition-delay:.40s}
|
||
|
||
/* Пульс-знак логотипа — «живой» */
|
||
@keyframes pulseBeat { 0%,70%,100%{ transform:scale(1);} 12%{ transform:scale(1.14);} 24%{ transform:scale(.98);} 36%{ transform:scale(1.06);} 48%{ transform:scale(1);} }
|
||
@keyframes pulseGlow { 0%,100%{ box-shadow:0 0 0 0 rgba(16,185,129,.35);} 50%{ box-shadow:0 0 0 6px rgba(16,185,129,0);} }
|
||
.pulse-chip { animation: pulseBeat 3s ease-in-out infinite, pulseGlow 3s ease-in-out infinite; }
|
||
@keyframes drawPulse { to { stroke-dashoffset: 0; } }
|
||
.pulse-chip svg polyline { stroke-dasharray: 70; stroke-dashoffset: 70; animation: drawPulse 1.4s ease-out .3s forwards; }
|
||
|
||
/* Hover карточек: осветление фона + мягкая тень */
|
||
.problem-card, .funnel-step, .demo-card { transition: all .2s ease-in-out; }
|
||
.feature-card:hover, .problem-card:hover, .funnel-step:hover, .demo-card:hover {
|
||
background: #233148; border-color: #2D3A52;
|
||
transform: translateY(-4px) scale(1.03);
|
||
box-shadow: 0 0 26px rgba(16,185,129,.22), 0 22px 50px rgba(0,0,0,.34);
|
||
}
|
||
|
||
/* «Бегущий огонь» — неон пробегает по периметру (вращающийся конический градиент в маске-рамке) */
|
||
@property --nflow { syntax: '<angle>'; inherits: false; initial-value: 0deg; }
|
||
.feature-card, .problem-card, .funnel-step, .demo-card { position: relative; }
|
||
.feature-card::after, .problem-card::after, .funnel-step::after, .demo-card::after {
|
||
content: ''; position: absolute; inset: 0; border-radius: inherit; padding: 1.6px;
|
||
pointer-events: none; z-index: 2; opacity: 0; transition: opacity .25s ease;
|
||
filter: brightness(1.5) drop-shadow(0 0 5px rgba(16,185,129,.6));
|
||
background: conic-gradient(from var(--nflow),
|
||
transparent 0deg, transparent 140deg,
|
||
rgba(16,185,129,.3) 180deg, #10B981 240deg, #6EE7B7 315deg, #10B981 350deg, transparent 360deg);
|
||
-webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
|
||
mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
|
||
-webkit-mask-composite: xor; mask-composite: exclude;
|
||
}
|
||
.feature-card:hover::after, .problem-card:hover::after, .funnel-step:hover::after, .demo-card:hover::after {
|
||
opacity: 1; animation: nflowRun 1.15s linear infinite;
|
||
}
|
||
@keyframes nflowRun { to { --nflow: 360deg; } }
|
||
|
||
@media (prefers-reduced-motion: reduce) {
|
||
.hero-content > *, .reveal, .pulse-chip, .pulse-chip svg polyline { animation: none !important; transition: none !important; opacity:1 !important; transform:none !important; stroke-dashoffset:0 !important; }
|
||
.feature-card:hover::after, .problem-card:hover::after, .funnel-step:hover::after, .demo-card:hover::after { animation: none !important; background: #10B981; opacity: .9; }
|
||
}
|
||
</style>
|
||
</head>
|
||
<body>
|
||
|
||
<!-- NAV -->
|
||
<nav>
|
||
<div class="nav-logo" style="display:flex;align-items:center;gap:10px;font-size:18px">
|
||
<span class="pulse-chip" style="width:30px;height:30px;background:#047857;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0"><svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="#fff" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><polyline points="22 12 18 12 15 21 9 3 6 12 2 12"/></svg></span>
|
||
<span style="line-height:1"><span style="color:#9CA3AF;font-weight:700;letter-spacing:-.3px">@wasrusgen1</span> <span style="color:#F1F5F9;font-weight:800;letter-spacing:-.5px">КОНСАЛТИНГ</span></span>
|
||
</div>
|
||
<div class="nav-links">
|
||
<a href="#problem">Проблемы</a>
|
||
<a href="#features">Что получите</a>
|
||
<a href="#funnel">Как работаем</a>
|
||
<a href="#demo">Кейс</a>
|
||
</div>
|
||
<a href="https://wasrusgen1.ru/consulting/cabinet.html?src=landing" target="_blank" class="nav-cta">Бесплатная диагностика</a>
|
||
</nav>
|
||
|
||
<!-- HERO -->
|
||
<section class="hero">
|
||
<div class="hero-content">
|
||
<div class="hero-badge">Консалтинг для малого и среднего бизнеса</div>
|
||
<h1>Разберём ваш бизнес<br><em>по полочкам</em></h1>
|
||
<p>За несколько дней находим, где вы теряете деньги и время: процессы, люди, учёт. Даём целевую модель, регламенты и план внедрения — понятным языком, без слайдов на 100 страниц.</p>
|
||
<div class="hero-btns">
|
||
<a href="https://wasrusgen1.ru/consulting/cabinet.html?src=landing" target="_blank" class="btn-primary">Получить бесплатную диагностику <span class="btn-arrow">→</span></a>
|
||
<a href="#funnel" class="btn-outline">Как это работает</a>
|
||
</div>
|
||
<div class="hero-stat">
|
||
<div class="stat-item">
|
||
<div class="stat-num">0 ₽</div>
|
||
<div class="stat-label">первичная диагностика</div>
|
||
</div>
|
||
<div class="stat-item">
|
||
<div class="stat-num">3–5 дней</div>
|
||
<div class="stat-label">до первого результата</div>
|
||
</div>
|
||
<div class="stat-item">
|
||
<div class="stat-num">100%</div>
|
||
<div class="stat-label">прозрачная смета</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- PROBLEM -->
|
||
<section class="problem" id="problem">
|
||
<div class="container">
|
||
<div class="section-tag reveal">Проблема</div>
|
||
<h2 class="section-title reveal">Почему бизнес теряет прибыль незаметно</h2>
|
||
<p class="section-sub reveal">Три дыры, которые есть почти в каждом малом и среднем бизнесе — и которые не видно изнутри</p>
|
||
<div class="problem-grid">
|
||
<div class="problem-card reveal">
|
||
<div class="problem-icon"><svg width="30" height="30" viewBox="0 0 24 24" fill="none" stroke="#10B981" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round"><path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"/><circle cx="9" cy="7" r="4"/><path d="M23 21v-2a4 4 0 0 0-3-3.87"/><path d="M16 3.13a4 4 0 0 1 0 7.75"/></svg></div>
|
||
<h3>Всё держится на людях, а не на системе</h3>
|
||
<p>Ключевой сотрудник ушёл — и работа встала. Процессы в головах, регламентов нет. Бизнес не масштабируется и не продаётся как актив.</p>
|
||
</div>
|
||
<div class="problem-card reveal reveal-d1">
|
||
<div class="problem-icon"><svg width="30" height="30" viewBox="0 0 24 24" fill="none" stroke="#10B981" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round"><rect x="2" y="6" width="20" height="12" rx="2"/><circle cx="12" cy="12" r="2"/><path d="M6 12h.01M18 12h.01"/></svg></div>
|
||
<h3>Деньги утекают — и непонятно, где</h3>
|
||
<p>Списания, брак, простои, серые зоны учёта. Прибыль есть «на бумаге», а на счёте её меньше, чем должно быть. Дыры не видно без разбора.</p>
|
||
</div>
|
||
<div class="problem-card reveal reveal-d2">
|
||
<div class="problem-icon"><svg width="30" height="30" viewBox="0 0 24 24" fill="none" stroke="#10B981" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round"><line x1="18" y1="20" x2="18" y2="10"/><line x1="12" y1="20" x2="12" y2="4"/><line x1="6" y1="20" x2="6" y2="14"/></svg></div>
|
||
<h3>Нет цельной картины бизнеса</h3>
|
||
<p>Вы в операционке 24/7, но единой модели «как всё устроено и где слабые места» нет. Решения принимаются наугад, рост — на ощупь.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- FEATURES -->
|
||
<section class="features" id="features">
|
||
<div class="container">
|
||
<div class="section-tag reveal">Что на выходе</div>
|
||
<h2 class="section-title reveal">Вы получаете не презентацию, а рабочие документы</h2>
|
||
<p class="section-sub reveal">То, по чему бизнес реально живёт и растёт — а не папку, которую закрыли и забыли</p>
|
||
<div class="features-grid">
|
||
<div class="feature-card reveal">
|
||
<div class="feature-icon"><svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#10B981" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round"><polyline points="22 12 18 12 15 21 9 3 6 12 2 12"/></svg></div>
|
||
<h3>Диагностика «как есть»</h3>
|
||
<p>Карта вашего бизнеса: где утекают деньги, время и качество. На старте — бесплатно.</p>
|
||
</div>
|
||
<div class="feature-card reveal reveal-d1">
|
||
<div class="feature-icon"><svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#10B981" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="3"/><path d="M19.07 4.93a10 10 0 0 1 0 14.14M4.93 19.07a10 10 0 0 1 0-14.14"/></svg></div>
|
||
<h3>Целевая модель процессов</h3>
|
||
<p>Как должно быть устроено: процессы выстроены, узкие места убраны, потери закрыты.</p>
|
||
</div>
|
||
<div class="feature-card reveal reveal-d2">
|
||
<div class="feature-icon"><svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#10B981" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round"><path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"/><circle cx="9" cy="7" r="4"/><path d="M23 21v-2a4 4 0 0 0-3-3.87"/><path d="M16 3.13a4 4 0 0 1 0 7.75"/></svg></div>
|
||
<h3>Оргструктура и должностные</h3>
|
||
<p>Кто за что отвечает, с понятными KPI. Бизнес перестаёт держаться на одном человеке.</p>
|
||
</div>
|
||
<div class="feature-card reveal reveal-d3">
|
||
<div class="feature-icon"><svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#10B981" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"/><polyline points="14 2 14 8 20 8"/><line x1="16" y1="13" x2="8" y2="13"/><line x1="16" y1="17" x2="8" y2="17"/></svg></div>
|
||
<h3>Регламенты и ТЗ на автоматизацию</h3>
|
||
<p>Готовые документы к внедрению — и техзадание на софт, если бизнесу нужна своя система.</p>
|
||
</div>
|
||
<div class="feature-card reveal reveal-d4">
|
||
<div class="feature-icon"><svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#10B981" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round"><polyline points="23 6 13.5 15.5 8.5 10.5 1 18"/><polyline points="17 6 23 6 23 12"/></svg></div>
|
||
<h3>План внедрения с сопровождением</h3>
|
||
<p>Пошагово: что делать и в каком порядке. Не бросаем с документами — ведём до результата.</p>
|
||
</div>
|
||
<div class="feature-card reveal reveal-d5">
|
||
<div class="feature-icon"><svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#10B981" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round"><rect x="1" y="4" width="22" height="16" rx="2" ry="2"/><line x1="1" y1="10" x2="23" y2="10"/></svg></div>
|
||
<h3>Прозрачная смета — платите помодульно</h3>
|
||
<p>Видно, за что и сколько. Вход — 0 ₽, дальше по этапам. Никаких «пакетов» вслепую.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- FUNNEL -->
|
||
<section class="funnel" id="funnel">
|
||
<div class="container">
|
||
<div class="section-tag reveal">Как работаем</div>
|
||
<h2 class="section-title reveal">Путь от хаоса к системе — 4 шага</h2>
|
||
<p class="section-sub reveal">Понятно и прозрачно: вы платите только за то, что реально нужно вашему бизнесу</p>
|
||
<div class="funnel-flow">
|
||
<div class="funnel-step reveal active">
|
||
<div class="funnel-num">1</div>
|
||
<h4>Бесплатная диагностика</h4>
|
||
<p>Расскажете о бизнесе — голосом или текстом, из Telegram. Покажем первые точки потерь и роста.</p>
|
||
</div>
|
||
<div class="funnel-arrow">›</div>
|
||
<div class="funnel-step reveal reveal-d1">
|
||
<div class="funnel-num">2</div>
|
||
<h4>Разбор «как есть»</h4>
|
||
<p>Раскладываем бизнес на процессы и находим, где утекают деньги, время и качество.</p>
|
||
</div>
|
||
<div class="funnel-arrow">›</div>
|
||
<div class="funnel-step reveal reveal-d2">
|
||
<div class="funnel-num">3</div>
|
||
<h4>Целевая модель + смета</h4>
|
||
<p>Проектируем «как должно быть». Прозрачная цена — платите помодульно, без сюрпризов.</p>
|
||
</div>
|
||
<div class="funnel-arrow">›</div>
|
||
<div class="funnel-step reveal reveal-d3">
|
||
<div class="funnel-num">4</div>
|
||
<h4>Внедрение и сопровождение</h4>
|
||
<p>Регламенты, оргструктура, обучение команды. Ведём до результата, а не бросаем с папкой.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- DEMO -->
|
||
<section class="demo" id="demo">
|
||
<div class="container">
|
||
<div class="section-tag reveal">Кейс</div>
|
||
<h2 class="section-title reveal">Швейный цех: убрали потери ткани и навели порядок в выпуске</h2>
|
||
<p class="section-sub reveal">Учёт ткани вёлся «на глаз», раскрой и склад держались на одном человеке — списания росли, а причину никто не видел. Разложили процессы по этапам, развели зоны ответственности, ввели нормы расхода и простой регламент. Расход материала стал прозрачным, а сроки выпуска — предсказуемыми.</p>
|
||
<div class="demo-grid">
|
||
<div class="demo-card reveal" style="grid-column:1/-1;text-align:center;padding:40px 28px">
|
||
<h3 style="font-size:22px;margin-bottom:8px">15 минут — и вы увидите, где теряете деньги</h3>
|
||
<p style="margin-bottom:22px">Бесплатная диагностика без обязательств. Расскажете о бизнесе — Елена структурирует и покажет первые точки.</p>
|
||
<a href="https://wasrusgen1.ru/consulting/cabinet.html?src=landing" target="_blank" class="btn-primary" style="display:inline-block">Начать бесплатную диагностику <span class="btn-arrow">→</span></a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- FOOTER -->
|
||
<footer>
|
||
<div class="footer-inner">
|
||
<div class="footer-brand">
|
||
<div class="logo">@wasrusgen1 · Консалтинг</div>
|
||
<p>Разбор и систематизация бизнеса для малого и среднего бизнеса</p>
|
||
</div>
|
||
<div class="footer-links">
|
||
<a href="#problem">Проблемы</a>
|
||
<a href="#features">Что получите</a>
|
||
<a href="#funnel">Как работаем</a>
|
||
<a href="#demo">Кейс</a>
|
||
</div>
|
||
<div class="footer-contact">
|
||
ИП Васильев Р.Г. | <a href="https://wasrusgen1.ru/consulting/cabinet.html?src=landing" target="_blank">Начать диагностику</a>
|
||
</div>
|
||
</div>
|
||
<div class="footer-bottom">
|
||
<p>© 2026 @wasrusgen1 · Консалтинг</p>
|
||
<p>Все права защищены</p>
|
||
</div>
|
||
</footer>
|
||
|
||
<script>
|
||
(function(){
|
||
if (window.matchMedia && window.matchMedia('(prefers-reduced-motion: reduce)').matches){
|
||
document.querySelectorAll('.reveal').forEach(function(el){el.classList.add('in');});
|
||
return;
|
||
}
|
||
var io = new IntersectionObserver(function(entries){
|
||
entries.forEach(function(e){
|
||
if(e.isIntersecting){ e.target.classList.add('in'); io.unobserve(e.target); }
|
||
});
|
||
}, {threshold:0.12, rootMargin:'0px 0px -8% 0px'});
|
||
document.querySelectorAll('.reveal').forEach(function(el){io.observe(el);});
|
||
})();
|
||
</script>
|
||
</body>
|
||
</html>
|