fix: вернуть блок дохода, добавить дисклеймер, * к заголовку

2026-06-19 18:52:54 +05:00
1 parent 1e0fb461d1
commit bb0800a51d
@@ -0,0 +1,118 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!-- calls24 Logo #04 — Animated Wordmark: Icon + "Calls24" -->
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 340 56" width="340" height="56">
+  <defs>
+    <linearGradient id="hexGrad" x1="0%" y1="0%" x2="100%" y2="100%">
+      <stop offset="0%" stop-color="#22c55e">
+        <animate attributeName="stop-color" values="#22c55e;#4ade80;#22c55e" dur="3s" repeatCount="indefinite"/>
+      </stop>
+      <stop offset="100%" stop-color="#15803d"/>
+    </linearGradient>
+    <style>
+      /* Wave bars */
+      .bar {
+        transform-origin: bottom center;
+        animation: barGrow 1.2s ease-out forwards;
+        opacity: 0;
+      }
+      .bar1 { animation-delay: 0.1s; }
+      .bar2 { animation-delay: 0.2s; }
+      .bar3 { animation-delay: 0.3s; }
+      .bar4 { animation-delay: 0.4s; }
+      .bar5 { animation-delay: 0.5s; }
+      @keyframes barGrow {
+        0% { transform: scaleY(0); opacity: 0; }
+        100% { transform: scaleY(1); opacity: 1; }
+      }
+      /* Pulse on center bar */
+      .bar3 { animation: barGrow 1.2s ease-out forwards, pulseBar 3s ease-in-out infinite 1.5s; }
+      @keyframes pulseBar {
+        0%, 100% { opacity: 1; }
+        50% { opacity: 0.7; }
+      }
+      /* Data points */
+      .dot {
+        opacity: 0;
+        animation: dotIn 0.6s ease-out forwards;
+      }
+      .dot1 { animation-delay: 0.5s; }
+      .dot2 { animation-delay: 0.6s; }
+      .dot3 { animation-delay: 0.7s; }
+      .dot4 { animation-delay: 0.8s; }
+      .dot5 { animation-delay: 0.9s; }
+      @keyframes dotIn {
+        0% { opacity: 0; transform: scale(0); }
+        60% { transform: scale(1.3); }
+        100% { opacity: var(--o, 0.5); transform: scale(1); }
+      }
+      /* Text */
+      .wordmark {
+        opacity: 0;
+        transform: translateX(-10px);
+        animation: textIn 0.8s ease-out forwards;
+        animation-delay: 0.6s;
+      }
+      @keyframes textIn {
+        0% { opacity: 0; transform: translateX(-10px); }
+        100% { opacity: 1; transform: translateX(0); }
+      }
+      /* Tech line */
+      .tech-line {
+        stroke-dasharray: 30;
+        stroke-dashoffset: 30;
+        animation: lineDraw 0.6s ease-out forwards;
+        animation-delay: 1.2s;
+      }
+      @keyframes lineDraw {
+        0% { stroke-dashoffset: 30; }
+        100% { stroke-dashoffset: 0; }
+      }
+      /* Floating particles */
+      .particle {
+        opacity: 0;
+        animation: float 4s ease-in-out infinite;
+      }
+      .particle:nth-child(1) { animation-delay: 2s; }
+      .particle:nth-child(2) { animation-delay: 2.5s; }
+      @keyframes float {
+        0%, 100% { opacity: 0; transform: translateY(0); }
+        50% { opacity: 0.6; transform: translateY(-3px); }
+      }
+    </style>
+  </defs>
+
+  <!-- ===== ICON: Animated Sound Wave ===== -->
+  <g transform="translate(2, 2)">
+    <rect class="bar bar1" x="4" y="26" width="6" height="14" rx="3" fill="#22c55e" opacity="0.4"/>
+    <rect class="bar bar2" x="12" y="20" width="6" height="26" rx="3" fill="#22c55e" opacity="0.6"/>
+    <rect class="bar bar3" x="20" y="8" width="6" height="50" rx="3" fill="url(#hexGrad)"/>
+    <rect class="bar bar4" x="28" y="20" width="6" height="26" rx="3" fill="#22c55e" opacity="0.6"/>
+    <rect class="bar bar5" x="36" y="26" width="6" height="14" rx="3" fill="#22c55e" opacity="0.4"/>
+    
+    <!-- Data points -->
+    <circle class="dot dot1" cx="7" cy="24" r="2" fill="#22c55e" style="--o: 0.3" opacity="0.3"/>
+    <circle class="dot dot2" cx="15" cy="18" r="2" fill="#22c55e" style="--o: 0.5" opacity="0.5"/>
+    <circle class="dot dot3" cx="23" cy="6" r="2" fill="#22c55e" style="--o: 1" opacity="1"/>
+    <circle class="dot dot4" cx="31" cy="18" r="2" fill="#22c55e" style="--o: 0.5" opacity="0.5"/>
+    <circle class="dot dot5" cx="39" cy="24" r="2" fill="#22c55e" style="--o: 0.3" opacity="0.3"/>
+    
+    <!-- Floating particles -->
+    <circle class="particle" cx="23" cy="2" r="1" fill="#22c55e" opacity="0.4"/>
+    <circle class="particle" cx="15" cy="10" r="1.5" fill="#22c55e" opacity="0.3"/>
+  </g>
+
+  <!-- ===== WORDMARK ===== -->
+  <g class="wordmark">
+    <text x="56" y="40" 
+          font-family="Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif" 
+          font-weight="300" 
+          font-size="30" 
+          fill="#ffffff" 
+          letter-spacing="-0.5">
+      Calls<tspan font-weight="700" fill="#22c55e">24</tspan>
+    </text>
+    
+    <!-- Tech underline -->
+    <line class="tech-line" x1="200" y1="40" x2="230" y2="40" stroke="#22c55e" stroke-width="2" stroke-linecap="round"/>
+  </g>
+</svg>