Update src/app/styles/base.css

src/app/about/page.tsx

@@ -2,24 +2,23 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import Link from "next/link";
-import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline/NavbarLayoutFloatingInline";
-import TextAbout from "@/components/sections/about/TextAbout/TextAbout";
-import FeatureCardTen from "@/components/sections/feature/FeatureCardTen/FeatureCardTen";
-import MetricCardOne from "@/components/sections/metrics/MetricCardOne/MetricCardOne";
-import FooterCard from "@/components/sections/footer/FooterCard/FooterCard";
-import { CheckCircle, Mail, Send, Phone, FolderOpen, Users, Clock, Calendar, Check, Cloud } from "lucide-react";
+import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
+import TextAbout from "@/components/sections/about/TextAbout";
+import FeatureCardTen from "@/components/sections/feature/FeatureCardTen";
+import MetricCardOne from "@/components/sections/metrics/MetricCardOne";
+import FooterCard from "@/components/sections/footer/FooterCard";
+import { CheckCircle, Mail, Send, Phone, FolderOpen, Users, Clock, Calendar, Check } from "lucide-react";
 
 export default function AboutPage() {
   const navItems = [
-    { label: "Услуги", href: "#services" },
-    { label: "О компании", href: "#about" },
-    { label: "Процесс", href: "#process" },
-    { label: "Отзывы", href: "#testimonials" },
+    { name: "Услуги", id: "services" },
+    { name: "О компании", id: "about" },
+    { name: "Процесс", id: "process" },
+    { name: "Отзывы", id: "testimonials" },
   ];
 
   const navButton = {
-    text: "Связаться с нами",    href: "/contact"
-  };
+    text: "Связаться с нами",    href: "/contact"};
 
   return (
     <ThemeProvider
@@ -37,11 +36,9 @@ export default function AboutPage() {
       <div id="nav" data-section="nav">
         <NavbarLayoutFloatingInline
           brandName="Mond Design"
-          links={navItems}
+          navItems={navItems}
           button={navButton}
           animateOnLoad={true}
-          eyebrowText="Mond Design"
-          eyebrowIcon={Cloud}
         />
       </div>
 
@@ -51,7 +48,7 @@ export default function AboutPage() {
           tagIcon={CheckCircle}
           tagAnimation="slide-up"
           title="Mond Design — это команда квалифицированных разработчиков и дизайнеров, которые создают цифровые решения для растущих бизнесов. За 1+ лет мы помогли более чем 150 компаниям перевести свой бизнес в интернет и достичь устойчивого роста."
-          buttons={[{ text: "Начать проект", href: "#contact" }]}
+          buttons={[{ text: "Начать проект", href: "/contact" }]}
           buttonAnimation="slide-up"
           useInvertedBackground={false}
         />

src/app/globals.css

@@ -1,5 +1,31 @@
-@import "tailwindcss";
-@import "./styles/variables.css";
-@import "./styles/theme.css";
-@import "./styles/utilities.css";
-@import "./styles/base.css";
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+@layer base {
+  * {
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+  }
+
+  html {
+    scroll-behavior: smooth;
+    height: 100%;
+  }
+
+  body {
+    height: 100%;
+    background-color: var(--background);
+    color: var(--foreground);
+  }
+
+  h1,
+  h2,
+  h3,
+  h4,
+  h5,
+  h6 {
+    text-wrap: balance;
+  }
+}

src/app/layout.tsx

@@ -1,9 +1,15 @@
 import type { Metadata } from "next";
+import { Inter } from "next/font/google";
 import "./globals.css";
+import "./styles/variables.css";
+import "./styles/base.css";
+
+const inter = Inter({
+  variable: "--font-inter",  subsets: ["latin"],
+});
 
 export const metadata: Metadata = {
-  title: "Mond Design",  description: "Профессиональная веб-разработка для вашего бизнеса"
-};
+  title: "Mond Design - Профессиональная веб-разработка",  description: "Mond Design — агентство веб-разработки, специализирующееся на создании красивых, функциональных и высокопроизводительных веб-сайтов для малого и среднего бизнеса."};
 
 export default function RootLayout({
   children,
@@ -11,8 +17,10 @@ export default function RootLayout({
   children: React.ReactNode;
 }) {
   return (
-    <html lang="ru">
-      <body>{children}
+    <html lang="en">
+      <body className={inter.variable}>
+        {children}
+      
         <script
           dangerouslySetInnerHTML={{
             __html: `

src/app/page.tsx

@@ -2,28 +2,27 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import Link from "next/link";
-import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline/NavbarLayoutFloatingInline";
-import HeroSplitKpi from "@/components/sections/hero/HeroSplitKpi/HeroSplitKpi";
-import TextAbout from "@/components/sections/about/TextAbout/TextAbout";
-import FeatureCardNineteen from "@/components/sections/feature/FeatureCardNineteen/FeatureCardNineteen";
-import MetricCardOne from "@/components/sections/metrics/MetricCardOne/MetricCardOne";
-import TestimonialCardFive from "@/components/sections/testimonial/TestimonialCardFive/TestimonialCardFive";
-import FeatureCardTen from "@/components/sections/feature/FeatureCardTen/FeatureCardTen";
-import ContactText from "@/components/sections/contact/ContactText/ContactText";
-import FooterCard from "@/components/sections/footer/FooterCard/FooterCard";
+import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
+import HeroSplitKpi from '@/components/sections/hero/HeroSplitKpi';
+import TextAbout from '@/components/sections/about/TextAbout';
+import FeatureCardNineteen from '@/components/sections/feature/FeatureCardNineteen';
+import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
+import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
+import FeatureCardTen from '@/components/sections/feature/FeatureCardTen';
+import ContactText from '@/components/sections/contact/ContactText';
+import FooterCard from '@/components/sections/footer/FooterCard';
 import { Sparkles, CheckCircle, Zap, TrendingUp, Star, Mail, Send, Phone, FolderOpen, Users, Clock, Calendar, Palette, Smartphone, RotateCcw, MessageCircle, Link as LinkIcon, Globe, Server, Database, FormInput, Cloud } from "lucide-react";
 
 export default function HomePage() {
   const navItems = [
-    { label: "Услуги", href: "#services" },
-    { label: "О компании", href: "#about" },
-    { label: "Процесс", href: "#process" },
-    { label: "Отзывы", href: "#testimonials" },
+    { name: "Услуги", id: "services" },
+    { name: "О компании", id: "about" },
+    { name: "Процесс", id: "process" },
+    { name: "Отзывы", id: "testimonials" },
   ];
 
   const navButton = {
-    text: "Связаться с нами",    href: "/contact"
-  };
+    text: "Связаться с нами",    href: "/contact"};
 
   return (
     <ThemeProvider
@@ -41,11 +40,9 @@ export default function HomePage() {
       <div id="nav" data-section="nav">
         <NavbarLayoutFloatingInline
           brandName="Mond Design"
-          links={navItems}
+          navItems={navItems}
           button={navButton}
           animateOnLoad={true}
-          eyebrowText="Mond Design"
-          eyebrowIcon={Cloud}
         />
       </div>
 
@@ -64,10 +61,13 @@ export default function HomePage() {
           tagIcon={Sparkles}
           tagAnimation="slide-up"
           buttons={[
-            { text: "Начать проект", href: "#contact" },
-            { text: "Посмотреть портфолио", href: "#about" },
+            { text: "Начать проект", href: "/contact" },
+            { text: "Посмотреть портфолио", href: "/about" },
           ]}
           buttonAnimation="slide-up"
+          marqueeItems={[
+            { type: "text-icon", text: "Mond Design", icon: Cloud },
+          ]}
           imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQxJRmTnamx9ofjvEZzdJdepY5/a-modern-sophisticated-web-development-w-1772553706424-80bb3524.png"
           imageAlt="Web development dashboard"
           mediaAnimation="slide-up"
@@ -81,7 +81,7 @@ export default function HomePage() {
           tagIcon={CheckCircle}
           tagAnimation="slide-up"
           title="Мы создаём цифровые решения, которые превосходят ожидания клиентов. Каждый проект разрабатывается с учётом уникальных потребностей вашего бизнеса, современных трендов дизайна и лучших практик веб-разработки."
-          buttons={[{ text: "Узнать больше", href: "#about" }]}
+          buttons={[{ text: "Узнать больше", href: "/about" }]}
           buttonAnimation="slide-up"
           useInvertedBackground={false}
         />
@@ -148,23 +148,17 @@ export default function HomePage() {
           useInvertedBackground={false}
           testimonials={[
             {
-              id: "1",              name: "Александр Петров, Генеральный директор, СеноПро",              date: "Дата: 15 Декабря 2024",              title: "Абсолютно профессиональный подход!",              quote: "Mond Design создали нам сайт, который не только красивый, но и работает как часы. Клиенты начали быстрее находить нас в Интернете, и конверсия заявок выросла на 45%. Команда была внимательна к каждой детали и всегда готова помочь.",              tag: "Тариф Бизнес",              avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQxJRmTnamx9ofjvEZzdJdepY5/professional-headshot-of-a-confident-bus-1772553704736-4eb26811.png",              avatarAlt: "Александр Петров",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQxJRmTnamx9ofjvEZzdJdepY5/professional-headshot-of-a-confident-bus-1772553704736-4eb26811.png"
-            },
+              id: "1",              name: "Александр Петров, Генеральный директор, СеноПро",              date: "Дата: 15 Декабря 2024",              title: "Абсолютно профессиональный подход!",              quote: "Mond Design создали нам сайт, который не только красивый, но и работает как часы. Клиенты начали быстрее находить нас в Интернете, и конверсия заявок выросла на 45%. Команда была внимательна к каждой детали и всегда готова помочь.",              tag: "Тариф Бизнес",              avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQxJRmTnamx9ofjvEZzdJdepY5/professional-headshot-of-a-confident-bus-1772553704736-4eb26811.png",              avatarAlt: "Александр Петров",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQxJRmTnamx9ofjvEZzdJdepY5/professional-headshot-of-a-confident-bus-1772553704736-4eb26811.png"},
             {
-              id: "2",              name: "Мария Сорокина, Владелица, МастерДизайн",              date: "Дата: 10 Ноября 2024",              title: "Превосходили все ожидания",              quote: "Когда мы впервые обратились к Mond Design, я была скептична. Но результат поразил меня. Сайт не только красиво выглядит, но и очень удобен для моих клиентов. Поддержка была безупречной на протяжении всего проекта.",              tag: "Тариф Бизнес",              avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQxJRmTnamx9ofjvEZzdJdepY5/professional-headshot-of-a-female-ceo-or-1772553704964-df90711e.png",              avatarAlt: "Мария Сорокина",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQxJRmTnamx9ofjvEZzdJdepY5/professional-headshot-of-a-female-ceo-or-1772553704964-df90711e.png"
-            },
+              id: "2",              name: "Мария Сорокина, Владелица, МастерДизайн",              date: "Дата: 10 Ноября 2024",              title: "Превосходили все ожидания",              quote: "Когда мы впервые обратились к Mond Design, я была скептична. Но результат поразил меня. Сайт не только красиво выглядит, но и очень удобен для моих клиентов. Поддержка была безупречной на протяжении всего проекта.",              tag: "Тариф Бизнес",              avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQxJRmTnamx9ofjvEZzdJdepY5/professional-headshot-of-a-female-ceo-or-1772553704964-df90711e.png",              avatarAlt: "Мария Сорокина",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQxJRmTnamx9ofjvEZzdJdepY5/professional-headshot-of-a-female-ceo-or-1772553704964-df90711e.png"},
             {
-              id: "3",              name: "Дмитрий Викторов, Директор, ТехНовация",              date: "Дата: 5 Октября 2024",              title: "Лучшее инвестирование в мой бизнес",              quote: "За 5 лет работы с Mond Design они создали для нас 3 сайта. Каждый раз качество было на высшем уровне, сроки соблюдались, цены справедливые. Это партнёры, а не просто подрядчики.",              tag: "Тариф Бизнес",              avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQxJRmTnamx9ofjvEZzdJdepY5/professional-headshot-of-a-male-founder--1772553705028-fcb9c285.png",              avatarAlt: "Дмитрий Викторов",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQxJRmTnamx9ofjvEZzdJdepY5/professional-headshot-of-a-male-founder--1772553705028-fcb9c285.png"
-            },
+              id: "3",              name: "Дмитрий Викторов, Директор, ТехНовация",              date: "Дата: 5 Октября 2024",              title: "Лучшее инвестирование в мой бизнес",              quote: "За 5 лет работы с Mond Design они создали для нас 3 сайта. Каждый раз качество было на высшем уровне, сроки соблюдались, цены справедливые. Это партнёры, а не просто подрядчики.",              tag: "Тариф Бизнес",              avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQxJRmTnamx9ofjvEZzdJdepY5/professional-headshot-of-a-male-founder--1772553705028-fcb9c285.png",              avatarAlt: "Дмитрий Викторов",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQxJRmTnamx9ofjvEZzdJdepY5/professional-headshot-of-a-male-founder--1772553705028-fcb9c285.png"},
             {
-              id: "4",              name: "Елена Козлова, Менеджер маркетинга, РазвитиеПро",              date: "Дата: 20 Сентября 2024",              title: "Десять из десяти, рекомендую!",              quote: "Нам нужно было срочно обновить сайт, и Mond Design справились за рекордные сроки без ущерба качеству. SEO-оптимизация, мобильная адаптация, аналитика — всё есть. И техническая поддержка работает как швейцарские часы.",              tag: "Тариф Бизнес",              avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQxJRmTnamx9ofjvEZzdJdepY5/professional-headshot-of-a-business-prof-1772553704570-11e9363f.png",              avatarAlt: "Елена Козлова",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQxJRmTnamx9ofjvEZzdJdepY5/professional-headshot-of-a-business-prof-1772553704570-11e9363f.png"
-            },
+              id: "4",              name: "Елена Козлова, Менеджер маркетинга, РазвитиеПро",              date: "Дата: 20 Сентября 2024",              title: "Десять из десяти, рекомендую!",              quote: "Нам нужно было срочно обновить сайт, и Mond Design справились за рекордные сроки без ущерба качеству. SEO-оптимизация, мобильная адаптация, аналитика — всё есть. И техническая поддержка работает как швейцарские часы.",              tag: "Тариф Бизнес",              avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQxJRmTnamx9ofjvEZzdJdepY5/professional-headshot-of-a-business-prof-1772553704570-11e9363f.png",              avatarAlt: "Елена Козлова",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQxJRmTnamx9ofjvEZzdJdepY5/professional-headshot-of-a-business-prof-1772553704570-11e9363f.png"},
             {
-              id: "5",              name: "Виктор Лазарев, Сооснователь, ИТ-Синергия",              date: "Дата: 12 Августа 2024",              title: "Настоящие профессионалы своего дела",              quote: "От консультации до запуска — всё было чётко, ясно и результативно. Сайт получился минималистичным, но очень мощным. Интеграция с CRM прошла гладко. Спасибо за отличную работу!",              tag: "Тариф Бизнес",              avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQxJRmTnamx9ofjvEZzdJdepY5/professional-headshot-of-a-woman-entrepr-1772553704478-b4907faa.png",              avatarAlt: "Виктор Лазарев",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQxJRmTnamx9ofjvEZzdJdepY5/professional-headshot-of-a-woman-entrepr-1772553704478-b4907faa.png"
-            },
+              id: "5",              name: "Виктор Лазарев, Сооснователь, ИТ-Синергия",              date: "Дата: 12 Августа 2024",              title: "Настоящие профессионалы своего дела",              quote: "От консультации до запуска — всё было чётко, ясно и результативно. Сайт получился минималистичным, но очень мощным. Интеграция с CRM прошла гладко. Спасибо за отличную работу!",              tag: "Тариф Бизнес",              avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQxJRmTnamx9ofjvEZzdJdepY5/professional-headshot-of-a-woman-entrepr-1772553704478-b4907faa.png",              avatarAlt: "Виктор Лазарев",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQxJRmTnamx9ofjvEZzdJdepY5/professional-headshot-of-a-woman-entrepr-1772553704478-b4907faa.png"},
             {
-              id: "6",              name: "Анна Белова, Руководитель проекта, Эко-Логистика",              date: "Дата: 28 Июля 2024",              title: "Сайт, который продаёт",              quote: "Никогда не думала, что хороший дизайн так влияет на продажи. Mond Design создали сайт, который не только красивый, но работающий. За полгода после запуска выручка выросла на 60%. Спасибо большое!",              tag: "Тариф Бизнес",              avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQxJRmTnamx9ofjvEZzdJdepY5/professional-headshot-of-a-man-in-busine-1772553705127-d23f2dba.png",              avatarAlt: "Анна Белова",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQxJRmTnamx9ofjvEZzdJdepY5/professional-headshot-of-a-man-in-busine-1772553705127-d23f2dba.png"
-            },
+              id: "6",              name: "Анна Белова, Руководитель проекта, Эко-Логистика",              date: "Дата: 28 Июля 2024",              title: "Сайт, который продаёт",              quote: "Никогда не думала, что хороший дизайн так влияет на продажи. Mond Design создали сайт, который не только красивый, но работающий. За полгода после запуска выручка выросла на 60%. Спасибо большое!",              tag: "Тариф Бизнес",              avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQxJRmTnamx9ofjvEZzdJdepY5/professional-headshot-of-a-man-in-busine-1772553705127-d23f2dba.png",              avatarAlt: "Анна Белова",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQxJRmTnamx9ofjvEZzdJdepY5/professional-headshot-of-a-man-in-busine-1772553705127-d23f2dba.png"},
           ]}
         />
       </div>
@@ -225,8 +219,8 @@ export default function HomePage() {
           text="Готовы начать ваш проект? Свяжитесь с нами уже сегодня и получите консультацию от наших специалистов. Мы ответим на все ваши вопросы и поможем выбрать оптимальное решение для вашего бизнеса."
           animationType="entrance-slide"
           buttons={[
-            { text: "Отправить запрос", href: "#contact" },
-            { text: "Узнать цены", href: "#services" },
+            { text: "Отправить запрос", href: "/contact" },
+            { text: "Узнать цены", href: "/services" },
           ]}
           background={{ variant: "plain" }}
           useInvertedBackground={false}

src/app/styles/base.css

@@ -1,28 +1,14 @@
-* {
-  scrollbar-width: thin;
-  scrollbar-color: rgba(255, 255, 255, 1) rgba(255, 255, 255, 0);
-}
+@layer base {
+  body {
+    font-family: var(--font-inter), sans-serif;
+  }
 
-html {
-  overscroll-behavior: none;
-  overscroll-behavior-y: none;
-}
-
-body {
-  background-color: var(--background);
-  color: var(--foreground);
-  font-family: var(--font-inter), sans-serif;
-  position: relative;
-  min-height: 100vh;
-  overscroll-behavior: none;
-  overscroll-behavior-y: none;
-}
-
-h1,
-h2,
-h3,
-h4,
-h5,
-h6 {
-  font-family: var(--font-mulish), sans-serif;
+  h1,
+  h2,
+  h3,
+  h4,
+  h5,
+  h6 {
+    font-family: var(--font-inter), sans-serif;
+  }
 }