diff --git a/src/app/blog/page.tsx b/src/app/blog/page.tsx
index 189655a..76d0704 100644
--- a/src/app/blog/page.tsx
+++ b/src/app/blog/page.tsx
@@ -3,22 +3,29 @@
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
 import FooterBase from '@/components/sections/footer/FooterBase';
-import BlogCardTwo from '@/components/sections/blog/BlogCardTwo';
+import BlogCardOne from '@/components/sections/blog/BlogCardOne';
 
 export default function BlogPage() {
   return (
-    <ThemeProvider>
-      <NavbarStyleApple navItems={[{ name: "Bosh Sahifa", id: "/" }, { name: "Galereya", id: "/gallery" }, { name: "Blog", id: "/blog" }, { name: "Aloqa", id: "/contact" }]} brandName="OSHTONCHA" />
+    <ThemeProvider defaultButtonVariant="text-stagger" defaultTextAnimation="entrance-slide" borderRadius="rounded" contentWidth="medium" sizing="medium" background="circleGradient" cardStyle="glass-elevated" primaryButtonStyle="gradient" secondaryButtonStyle="glass" headingFontWeight="normal">
+      <div id="nav" data-section="nav">
+        <NavbarStyleApple navItems={[{ name: "Bosh Sahifa", id: "/" }, { name: "Galereya", id: "/gallery" }, { name: "Blog", id: "/blog" }, { name: "Aloqa", id: "/contact" }]} />
+      </div>
       <main className="container mx-auto py-20">
-        <BlogCardTwo 
-          title="Blog va Yangiliklar"
-          description="Restoranimizdagi eng so'nggi yangiliklar va maqolalar."
-          animationType="slide-up"
-          textboxLayout="default"
-          blogs={[]}
-        />
+        <div id="blog" data-section="blog">
+          <BlogCardOne 
+            title="Blog va Yangiliklar"
+            description="Restoranimizdagi eng so'nggi yangiliklar va maqolalar."
+            animationType="slide-up"
+            textboxLayout="default"
+            useInvertedBackground={false}
+            blogs={[]}
+          />
+        </div>
       </main>
-      <FooterBase columns={[{ title: "Sahifalar", items: [{ label: "Galereya", href: "/gallery" }, { label: "Blog", href: "/blog" }] }, { title: "Biz haqimizda", items: [{ label: "Haqimizda", href: "/about" }, { label: "Aloqa", href: "/contact" }] }]} logoText="OSHTONCHA" />
+      <div id="footer" data-section="footer">
+        <FooterBase columns={[{ title: "Sahifalar", items: [{ label: "Galereya", href: "/gallery" }, { label: "Blog", href: "/blog" }] }, { title: "Biz haqimizda", items: [{ label: "Haqimizda", href: "/about" }, { label: "Aloqa", href: "/contact" }] }]} logoText="OSHTONCHA" />
+      </div>
     </ThemeProvider>
   );
 }
\ No newline at end of file