first

static/css/style.css

@@ -0,0 +1,444 @@
+* {
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+}
+
+body {
+    font-family: 'Inter', sans-serif;
+    background-color: #fefcf5;
+    color: #1a1f2b;
+    line-height: 1.4;
+    scroll-behavior: smooth;
+}
+
+.container {
+    max-width: 1280px;
+    margin: 0 auto;
+    padding: 0 24px;
+}
+
+.section {
+    padding: 80px 0;
+}
+
+.section-sm {
+    padding: 60px 0;
+}
+
+.bg-light {
+    background-color: #ffffff;
+}
+
+.bg-gentle {
+    background-color: #f8f6f0;
+}
+
+.btn {
+    display: inline-flex;
+    align-items: center;
+    gap: 12px;
+    padding: 14px 32px;
+    border-radius: 60px;
+    font-weight: 600;
+    font-size: 1rem;
+    text-decoration: none;
+    transition: all 0.25s ease;
+    cursor: pointer;
+    border: none;
+    background: none;
+    font-family: inherit;
+}
+
+.btn-primary {
+    background: #c52a1c;
+    color: white;
+    box-shadow: 0 8px 20px rgba(197, 42, 28, 0.25);
+}
+
+.btn-primary:hover {
+    background: #9e2015;
+    transform: translateY(-3px);
+    box-shadow: 0 14px 28px rgba(197, 42, 28, 0.35);
+}
+
+.btn-outline {
+    border: 2px solid #c52a1c;
+    color: #c52a1c;
+    background: transparent;
+}
+
+.btn-outline:hover {
+    background: #c52a1c;
+    color: white;
+    transform: translateY(-2px);
+}
+
+h1, h2, h3 {
+    font-weight: 700;
+    letter-spacing: -0.02em;
+}
+
+h1 {
+    font-size: 3.2rem;
+    line-height: 1.2;
+}
+
+h2 {
+    font-size: 2.4rem;
+    margin-bottom: 1.5rem;
+}
+
+.badge {
+    background: rgba(197, 42, 28, 0.12);
+    color: #c52a1c;
+    padding: 6px 18px;
+    border-radius: 40px;
+    font-size: 0.85rem;
+    font-weight: 600;
+    display: inline-block;
+    margin-bottom: 20px;
+}
+
+.navbar {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding: 20px 0;
+    flex-wrap: wrap;
+}
+
+.logo {
+    font-weight: 800;
+    font-size: 1.6rem;
+    letter-spacing: -0.02em;
+}
+
+.logo span {
+    color: #c52a1c;
+}
+
+.nav-links {
+    display: flex;
+    gap: 32px;
+    align-items: center;
+}
+
+.nav-links a {
+    text-decoration: none;
+    color: #1a1f2b;
+    font-weight: 500;
+    transition: color 0.2s;
+}
+
+.nav-links a:hover {
+    color: #c52a1c;
+}
+
+.hero {
+    display: flex;
+    flex-wrap: wrap;
+    align-items: center;
+    justify-content: space-between;
+    gap: 48px;
+}
+
+.hero-content {
+    flex: 1.2;
+}
+
+.hero-description {
+    font-size: 1.2rem;
+    margin: 24px 0 20px;
+    color: #2e3a48;
+    line-height: 1.4;
+}
+
+.hero-buttons {
+    display: flex;
+    gap: 20px;
+    flex-wrap: wrap;
+}
+
+.hero-info {
+    margin-top: 32px;
+    display: flex;
+    gap: 24px;
+    flex-wrap: wrap;
+}
+
+.hero-stats {
+    flex: 0.9;
+    background: white;
+    padding: 32px;
+    border-radius: 32px;
+    box-shadow: 0 20px 35px -12px rgba(0,0,0,0.08);
+    border: 1px solid #edeae2;
+}
+
+.stats-title {
+    font-weight: 600;
+    font-size: 1rem;
+    border-bottom: 2px solid #c52a1c;
+    display: inline-block;
+    margin-bottom: 16px;
+}
+
+.stat-grid {
+    display: grid;
+    grid-template-columns: 1fr 1fr;
+    gap: 24px;
+    margin-top: 20px;
+}
+
+.stat-item h4 {
+    font-size: 2rem;
+    font-weight: 800;
+    color: #c52a1c;
+}
+
+.stats-note {
+    font-size: 0.8rem;
+    margin-top: 20px;
+    color: #5e6f8d;
+}
+
+.about-grid {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 40px;
+    justify-content: space-between;
+}
+
+.about-content {
+    flex: 1.2;
+}
+
+.about-content p {
+    font-size: 1.05rem;
+    line-height: 1.5;
+    margin-bottom: 24px;
+}
+
+.values-list {
+    display: flex;
+    gap: 16px;
+    flex-wrap: wrap;
+}
+
+.values-list span {
+    background: #f4f2ec;
+    padding: 6px 14px;
+    border-radius: 40px;
+}
+
+.about-quote {
+    flex: 0.8;
+    background: #fefaf2;
+    border-radius: 32px;
+    padding: 28px;
+}
+
+.about-quote p {
+    font-style: italic;
+    margin: 12px 0;
+}
+
+.quote-author {
+    font-weight: 600;
+    margin-top: 16px;
+}
+
+.section-header {
+    text-align: center;
+    max-width: 700px;
+    margin: 0 auto 40px;
+}
+
+.cards-grid {
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
+    gap: 32px;
+    margin-top: 32px;
+}
+
+.card {
+    background: white;
+    padding: 28px;
+    border-radius: 28px;
+    box-shadow: 0 8px 24px rgba(0,0,0,0.03);
+    transition: transform 0.2s, box-shadow 0.2s;
+    border: 1px solid #efebe3;
+}
+
+.card:hover {
+    transform: translateY(-6px);
+    box-shadow: 0 20px 30px -12px rgba(0,0,0,0.1);
+}
+
+.card i {
+    font-size: 2.2rem;
+    color: #c52a1c;
+    margin-bottom: 20px;
+}
+
+.agenda-list {
+    background: white;
+    border-radius: 32px;
+    overflow: hidden;
+    border: 1px solid #e9e5db;
+}
+
+.agenda-item {
+    display: flex;
+    padding: 20px 28px;
+    border-bottom: 1px solid #efebe3;
+    align-items: flex-start;
+    gap: 20px;
+    flex-wrap: wrap;
+}
+
+.agenda-time {
+    font-weight: 700;
+    min-width: 100px;
+    color: #c52a1c;
+}
+
+.stats-wrapper {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 40px;
+    align-items: center;
+}
+
+.stats-info {
+    flex: 1;
+}
+
+.stats-info ul {
+    margin-top: 20px;
+    list-style: none;
+}
+
+.stats-info li {
+    margin-bottom: 12px;
+}
+
+.stats-cta {
+    flex: 1;
+    background: #ffffff;
+    border-radius: 32px;
+    padding: 32px;
+    text-align: center;
+    box-shadow: 0 10px 25px rgba(0,0,0,0.02);
+}
+
+.stats-cta i {
+    font-size: 3rem;
+    color: #c52a1c;
+    margin-bottom: 16px;
+    display: inline-block;
+}
+
+.form-card {
+    background: white;
+    border-radius: 36px;
+    padding: 40px;
+    box-shadow: 0 20px 40px rgba(0,0,0,0.05);
+    border: 1px solid #eae5db;
+    max-width: 700px;
+    margin: 0 auto;
+}
+
+.input-group {
+    margin-bottom: 20px;
+}
+
+input, select, textarea {
+    width: 100%;
+    padding: 14px 20px;
+    border-radius: 60px;
+    border: 1.5px solid #e2dcd0;
+    font-family: 'Inter', sans-serif;
+    font-size: 1rem;
+    transition: 0.2s;
+    background: #fff;
+}
+
+input:focus, select:focus, textarea:focus {
+    outline: none;
+    border-color: #c52a1c;
+    box-shadow: 0 0 0 3px rgba(197,42,28,0.1);
+}
+
+textarea {
+    border-radius: 28px;
+    resize: vertical;
+}
+
+.submit-btn {
+    width: 100%;
+    justify-content: center;
+}
+
+.form-message {
+    margin-top: 16px;
+    font-size: 0.9rem;
+    font-weight: 500;
+}
+
+.success-msg {
+    color: #1f8a4c;
+    background: #e0f2e9;
+    padding: 12px;
+    border-radius: 60px;
+    text-align: center;
+}
+
+.error-msg {
+    color: #c52a1c;
+    background: #ffe8e5;
+    padding: 12px;
+    border-radius: 60px;
+    text-align: center;
+}
+
+.form-note {
+    font-size: 0.75rem;
+    color: #7a7c7f;
+    margin-top: 20px;
+    text-align: center;
+}
+
+footer {
+    background: #0a1a2f;
+    color: #b9c7d9;
+    padding: 48px 0;
+    text-align: center;
+}
+
+.footer-logo {
+    font-weight: 800;
+    font-size: 1.4rem;
+    margin-bottom: 24px;
+}
+
+footer a {
+    color: #c9a87c;
+    text-decoration: none;
+}
+
+@media (max-width: 900px) {
+    h1 { font-size: 2.4rem; }
+    h2 { font-size: 1.9rem; }
+    .hero { flex-direction: column; }
+    .navbar { flex-direction: column; gap: 16px; }
+    .nav-links { gap: 20px; flex-wrap: wrap; justify-content: center; }
+    .section { padding: 50px 0; }
+    .form-card { padding: 28px; }
+}
+
+@media (max-width: 550px) {
+    .container { padding: 0 20px; }
+    .btn { padding: 10px 22px; }
+}

static/js/main.js

@@ -0,0 +1,63 @@
+// Обработка формы регистрации
+const form = document.getElementById('registrationForm');
+const feedbackDiv = document.getElementById('formFeedback');
+
+if (form) {
+    form.addEventListener('submit', async function(e) {
+        e.preventDefault();
+
+        if (feedbackDiv) {
+            feedbackDiv.innerHTML = '';
+            feedbackDiv.className = 'form-message';
+        }
+
+        const formData = new FormData(form);
+        const submitBtn = form.querySelector('button[type="submit"]');
+        const originalText = submitBtn.innerHTML;
+
+        submitBtn.disabled = true;
+        submitBtn.innerHTML = '<i class="fas fa-spinner fa-pulse"></i> Отправка...';
+
+        try {
+            const response = await fetch('/api/register', {
+                method: 'POST',
+                body: formData
+            });
+            const data = await response.json();
+
+            if (feedbackDiv) {
+                if (data.success) {
+                    feedbackDiv.innerHTML = '<div class="success-msg">✅ ' + data.message + '</div>';
+                    form.reset();
+                } else {
+                    feedbackDiv.innerHTML = '<div class="error-msg">❌ ' + data.message + '</div>';
+                }
+            }
+        } catch (err) {
+            console.error('Error:', err);
+            if (feedbackDiv) {
+                feedbackDiv.innerHTML = '<div class="error-msg">❌ Ошибка соединения. Попробуйте позже.</div>';
+            }
+        } finally {
+            submitBtn.disabled = false;
+            submitBtn.innerHTML = originalText;
+
+            setTimeout(() => {
+                if (feedbackDiv) feedbackDiv.innerHTML = '';
+            }, 5000);
+        }
+    });
+}
+
+// Плавная прокрутка для якорных ссылок
+document.querySelectorAll('a[href^="#"]').forEach(anchor => {
+    anchor.addEventListener('click', function(e) {
+        const hash = this.getAttribute('href');
+        if (hash === '#') return;
+        const target = document.querySelector(hash);
+        if (target) {
+            e.preventDefault();
+            target.scrollIntoView({ behavior: 'smooth', block: 'start' });
+        }
+    });
+});