-
ROI24
+
+
+
+
-
- AI-автоматизация
маркетинга
-
-
-
- 🤖
- Лиды обрабатываются за 0 сек
-
-
- 📱
- 7 площадок, один инструмент
-
-
- 📊
- Сквозная аналитика
-
+
+ Архитектор
систем
+
+
-
-
-
-
-
-
-
- Хватит терять клиентов
-
-
- Попробуй бесплатно →
-
-
- ROI24 — Автоматизация без рутины
-
-
+
+
@@ -255,95 +458,97 @@
const tl = gsap.timeline({ paused: true });
- // ═══════════ SCENE 1: HOOK (0–3s) ═══════════
- tl.to("#hook-emoji", {
- opacity: 1, y: 0, duration: 0.6, ease: "power3.out"
+ // ═══════════ SCENE 1: HOOK — "$0/мес" (0–3s) ═══════════
+ tl.to("#s1-bg", { opacity: 1, duration: 0.4, ease: "power1.out" }, 0);
+ tl.to("#s1-grid", { opacity: 1, duration: 0.5, ease: "power1.out" }, 0.1);
+ tl.to(["#s1-c1", "#s1-c2", "#s1-c3", "#s1-c4"], {
+ opacity: 1, duration: 0.3, ease: "power2.out"
+ }, 0.2);
+ tl.from("#s1-subtitle", {
+ opacity: 0, y: 20, duration: 0.4, ease: "power2.out"
}, 0.3);
- tl.to("#hook-text", {
- opacity: 1, y: 0, duration: 0.7, ease: "power3.out"
- }, 0.4);
- tl.to("#hook-sub", {
- opacity: 1, y: 0, duration: 0.5, ease: "power2.out"
- }, 1.0);
+ tl.from("#s1-price", {
+ opacity: 0, scale: 0.7, duration: 0.6, ease: "back.out(1.7)"
+ }, 0.5);
+ tl.to("#s1-line", { opacity: 1, duration: 0.3, ease: "power2.out" }, 0.9);
+ tl.to("#s1-particles", { opacity: 1, duration: 0.5, ease: "power1.out" }, 0.4);
// Exit
- tl.to("#hook-emoji, #hook-text, #hook-sub", {
- opacity: 0, y: -50, duration: 0.25, ease: "power2.in"
- }, 2.5);
- tl.set("#hook-emoji, #hook-text, #hook-sub", { opacity: 0, y: -50 }, 3.0);
+ tl.to("#s1-price, #s1-subtitle, #s1-line, #s1-particles", {
+ opacity: 0, y: -40, duration: 0.2, ease: "power2.in"
+ }, 2.6);
+ tl.set("#s1-price, #s1-subtitle, #s1-line, #s1-particles", { opacity: 0, y: -40 }, 3.0);
- // ═══════════ SCENE 2: PAIN (3–8s) ═══════════
- tl.to("#pain-bg", {
- opacity: 1, duration: 0.5, ease: "power1.out"
- }, 3.0);
- tl.from("#pain-badge", {
- opacity: 0, y: 40, duration: 0.5, ease: "power3.out"
+ // ═══════════ SCENE 2: SHIELD (3–7s) ═══════════
+ tl.to("#s2-bg", { opacity: 1, duration: 0.4, ease: "power1.out" }, 3.0);
+ tl.to("#s2-grid", { opacity: 1, duration: 0.4, ease: "power1.out" }, 3.1);
+ tl.from("#s2-shield", {
+ opacity: 0, y: 50, duration: 0.6, ease: "power3.out"
}, 3.2);
- tl.from("#pain-stats", {
- opacity: 0, y: 50, duration: 0.7, ease: "power3.out"
+ tl.from("#s2-text", {
+ opacity: 0, skewX: -8, y: 40, duration: 0.5, ease: "power3.out"
}, 3.6);
- tl.from("#pain-result", {
- opacity: 0, y: 40, duration: 0.5, ease: "power2.out"
- }, 4.8);
+ tl.to("#s2-line", { opacity: 1, duration: 0.3, ease: "power2.out" }, 4.0);
// Exit
- tl.to("#pain-bg", {
- opacity: 0, duration: 0.2, ease: "power2.in"
- }, 7.5);
- tl.to("#pain-badge, #pain-stats, #pain-result", {
- opacity: 0, y: -40, duration: 0.25, ease: "power2.in"
- }, 7.5);
- tl.set("#pain-badge, #pain-stats, #pain-result, #pain-bg", { opacity: 0 }, 8.0);
+ tl.to("#s2-shield, #s2-text", {
+ opacity: 0, scale: 0.9, duration: 0.2, ease: "power2.in"
+ }, 6.7);
+ tl.set("#s2-shield, #s2-text", { opacity: 0, scale: 0.9 }, 7.0);
- // ═══════════ SCENE 3: SOLUTION (8–12s) ═══════════
- tl.to("#solution-bg", {
- opacity: 1, duration: 0.6, ease: "power1.out"
- }, 8.0);
- tl.from("#solution-brand", {
- opacity: 0, scale: 0.8, duration: 0.5, ease: "back.out(1.7)"
- }, 8.2);
- tl.from("#solution-headline", {
- opacity: 0, y: 50, duration: 0.7, ease: "power3.out"
- }, 8.4);
- tl.from("#solution-features > div:nth-child(1)", {
- opacity: 0, x: -40, duration: 0.5, ease: "power2.out"
- }, 9.0);
- tl.from("#solution-features > div:nth-child(2)", {
- opacity: 0, x: -40, duration: 0.5, ease: "power2.out"
- }, 9.3);
- tl.from("#solution-features > div:nth-child(3)", {
- opacity: 0, x: -40, duration: 0.5, ease: "power2.out"
- }, 9.6);
+ // ═══════════ SCENE 3: SPECS (7–11s) ═══════════
+ tl.to("#s3-bg", { opacity: 1, duration: 0.4, ease: "power1.out" }, 7.0);
+ tl.to("#s3-grid", { opacity: 1, duration: 0.4, ease: "power1.out" }, 7.1);
+ tl.from("#s3-tag", {
+ opacity: 0, y: -30, duration: 0.4, ease: "power3.out"
+ }, 7.2);
+ tl.from("#s3-spec-1", {
+ opacity: 0, x: -40, duration: 0.4, ease: "power2.out"
+ }, 7.5);
+ tl.from("#s3-spec-2", {
+ opacity: 0, x: -40, duration: 0.4, ease: "power2.out"
+ }, 7.8);
+ tl.from("#s3-spec-3", {
+ opacity: 0, x: -40, duration: 0.4, ease: "power2.out"
+ }, 8.1);
+ tl.to("#s3-line", { opacity: 1, duration: 0.3, ease: "power2.out" }, 8.5);
// Exit
- tl.to("#solution-bg", {
- opacity: 0, duration: 0.2, ease: "power2.in"
- }, 11.7);
- tl.to("#solution-brand, #solution-headline, #solution-features > div", {
- opacity: 0, y: -30, duration: 0.2, ease: "power2.in"
- }, 11.7);
- tl.set("#solution-brand, #solution-headline, #solution-features, #solution-bg", { opacity: 0 }, 12.0);
+ tl.to("#s3-tag, #s3-spec-1, #s3-spec-2, #s3-spec-3, #s3-line", {
+ opacity: 0, x: 40, duration: 0.2, ease: "power2.in"
+ }, 10.7);
+ tl.set("#s3-tag, #s3-spec-1, #s3-spec-2, #s3-spec-3, #s3-line", { opacity: 0, x: 40 }, 11.0);
- // ═══════════ SCENE 4: CTA (12–15s) ═══════════
- tl.to("#cta-bg", {
- opacity: 1, duration: 0.5, ease: "power1.out"
- }, 12.0);
- tl.from("#cta-pre", {
- opacity: 0, y: 30, duration: 0.5, ease: "power3.out"
- }, 12.2);
- tl.from("#cta-button", {
- opacity: 0, scale: 0.85, duration: 0.6, ease: "back.out(1.7)"
- }, 12.6);
- tl.from("#cta-note", {
- opacity: 0, duration: 0.4, ease: "power2.out"
+ // ═══════════ SCENE 4: EDGE — Cloud × (11–13.5s) ═══════════
+ tl.to("#s4-bg", { opacity: 1, duration: 0.3, ease: "power1.out" }, 11.0);
+ tl.to("#s4-grid", { opacity: 1, duration: 0.3, ease: "power1.out" }, 11.1);
+ tl.from("#s4-cloud-cross", {
+ opacity: 0, scale: 0.8, duration: 0.4, ease: "power2.out"
+ }, 11.2);
+ // X mark appears
+ tl.to("#s4-cloud-cross line", {
+ opacity: 1, duration: 0.3, ease: "power2.out"
+ }, 11.5);
+ tl.from("#s4-text", {
+ opacity: 0, skewX: -10, y: 30, duration: 0.4, ease: "power3.out"
+ }, 11.8);
+ // Exit
+ tl.to("#s4-cloud-cross, #s4-text", {
+ opacity: 0, duration: 0.15, ease: "power2.in"
}, 13.2);
- // Subtle pulse on CTA button
- tl.to("#cta-button", {
- scale: 1.04, duration: 0.7, ease: "sine.inOut", yoyo: true, repeat: 1
- }, 13.4);
- // Final hold
- tl.to("#cta-bg, #cta-pre, #cta-button, #cta-note", {
- opacity: 1, duration: 0.1
- }, 14.8);
+ tl.set("#s4-cloud-cross, #s4-text", { opacity: 0 }, 13.5);
- window.__timelines["main"] = tl;
+ // ═══════════ SCENE 5: CTA (13.5–15s) ═══════════
+ tl.to("#s5-bg", { opacity: 1, duration: 0.3, ease: "power1.out" }, 13.5);
+ tl.to("#s5-grid", { opacity: 1, duration: 0.3, ease: "power1.out" }, 13.5);
+ tl.from("#s5-title", {
+ opacity: 0, skewX: -6, y: 30, duration: 0.5, ease: "power3.out"
+ }, 13.6);
+ tl.to("#s5-line", { opacity: 1, duration: 0.2, ease: "power2.out" }, 13.8);
+ tl.from("#s5-footer", {
+ opacity: 0, y: 20, duration: 0.3, ease: "power2.out"
+ }, 14.0);
+ // Hold to end
+ tl.to("#s5-title, #s5-footer", { opacity: 1, duration: 0.1 }, 14.9);
+
+ window.__timelines["sovereignty"] = tl;
diff --git a/meta.json b/meta.json
index e7e5925..5aabea4 100644
--- a/meta.json
+++ b/meta.json
@@ -1,5 +1,5 @@
{
- "id": "ads-stories",
- "name": "ads-stories",
+ "id": "sovereignty-ads",
+ "name": "Суверенитет — Персональный бренд",
"createdAt": "2026-07-05T11:18:41.723Z"
}
\ No newline at end of file