diff --git a/src/css/custom.css b/src/css/custom.css
index 66504500..4d8e204b 100644
--- a/src/css/custom.css
+++ b/src/css/custom.css
@@ -232,22 +232,8 @@ html[data-theme="dark"] .menu__link--active::after {
 }
 
 .navbar__logo {
-  width: 2.2rem;
   height: 2.2rem;
   margin-right: 0.5rem;
-  transition: all 300ms ease-in-out;
-}
-
-[data-theme="light"] .navbar__logo img {
-  display: block !important;
-  filter: none;
-  transition: filter 300ms ease-in-out;
-}
-
-[data-theme="dark"] .navbar__logo img {
-  display: block !important;
-  filter: invert(1);
-  transition: filter 300ms ease-in-out;
 }
 
 .navbar__title {
@@ -384,67 +370,21 @@ html[data-theme="dark"] .menu__link--active::after {
 }
 
 /* ======= SECTION 9 :Smooth theme transitions ========== */
-
-/* Global smooth theme transitions for all color-related properties */
 html,
-body,
+body {
+  transition:
+    background-color 150ms ease,
+    color 150ms ease;
+}
+
 .navbar,
-.navbar__inner,
-.navbar__brand,
-.navbar__link,
-.navbar__item,
 .footer,
-.footer__link,
 .sidebar,
-.sidebar__link,
-.main-wrapper,
-.theme-doc-sidebar-container,
-.theme-doc-toc-desktop,
-.theme-doc-sidebar-item,
-.article-card,
-.blog-card,
-.card,
-.menu__link,
-.menu__caret,
-.pagination,
-.pagination__item,
-.breadcrumbs,
-[class*="breadcrumb"],
-[class*="button"],
-[class*="btn"],
-.badge,
-.pill,
-.tag,
-.button-group,
-.admonition,
-.alert,
-.docusaurus-highlight-code-line,
-pre,
-code,
-input,
-textarea,
-select,
-[role="button"] {
-  transition:
-    background-color 300ms ease-in-out,
-    color 300ms ease-in-out,
-    border-color 300ms ease-in-out,
-    box-shadow 300ms ease-in-out,
-    fill 300ms ease-in-out,
-    stroke 300ms ease-in-out,
-    opacity 300ms ease-in-out !important;
-}
-
-/* SVG and icon transitions */
-svg,
-i,
-[class*="icon"] {
+.main-wrapper {
   transition:
-    fill 300ms ease-in-out,
-    stroke 300ms ease-in-out,
-    color 300ms ease-in-out,
-    filter 300ms ease-in-out,
-    opacity 300ms ease-in-out !important;
+    background-color 150ms ease,
+    color 150ms ease,
+    border-color 150ms ease;
 }
 
 /* Navbar icon styling */
@@ -455,7 +395,6 @@ i,
   margin-right: 4px;
   min-width: 18px;
   min-height: 18px;
-  transition: all 250ms cubic-bezier(0.4, 0, 0.2, 1);
 }
 
 /* Navbar social icon styles */
@@ -467,45 +406,8 @@ i,
   border-radius: 6px;
   color: var(--ifm-navbar-link-color);
   transition:
-    color 250ms cubic-bezier(0.4, 0, 0.2, 1),
-    background-color 250ms cubic-bezier(0.4, 0, 0.2, 1),
-    filter 250ms cubic-bezier(0.4, 0, 0.2, 1);
-}
-
-/* Form elements smooth transitions */
-input,
-textarea,
-select,
-button,
-[role="button"] {
-  transition:
-    background-color 250ms cubic-bezier(0.4, 0, 0.2, 1),
-    color 250ms cubic-bezier(0.4, 0, 0.2, 1),
-    border-color 250ms cubic-bezier(0.4, 0, 0.2, 1),
-    box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1);
-}
-
-/* Code block transitions */
-code,
-pre,
-.code-block,
-.highlight,
-[class*="hljs"] {
-  transition:
-    background-color 250ms cubic-bezier(0.4, 0, 0.2, 1),
-    color 250ms cubic-bezier(0.4, 0, 0.2, 1),
-    border-color 250ms cubic-bezier(0.4, 0, 0.2, 1);
-}
-
-/* Icon transitions */
-svg,
-i,
-[class*="icon"] {
-  transition:
-    fill 250ms cubic-bezier(0.4, 0, 0.2, 1),
-    stroke 250ms cubic-bezier(0.4, 0, 0.2, 1),
-    color 250ms cubic-bezier(0.4, 0, 0.2, 1),
-    filter 250ms cubic-bezier(0.4, 0, 0.2, 1);
+    color 0.2s ease,
+    background-color 0.2s ease;
 }
 
 .navbar-social-icon:hover {
@@ -613,7 +515,6 @@ i,
   }
 
   .navbar__logo {
-    width: 32px !important;
     height: 32px !important;
   }
 
@@ -2069,16 +1970,79 @@ main>div:not(.m-0) {
     margin-top: 1.5rem;
     margin-bottom: 1.5rem;
   }
+
+  .blog-carousel-section {
+    padding: 1.5rem 0 !important;
+    margin: 1.5rem 0 !important;
+  }
+
+  /* Reduce section padding on mobile */
+  section,
+  [role="region"] {
+    padding: 1.5rem 0;
+    margin: 1.5rem 0;
+  }
 }
 
-/* =====================================================
-   SECTION 15: BLOG POST PAGE — CENTER + TOC FIX
-   
-   SAFE: Only targets .blog-wrapper (individual post page)
-   Remove any previous SECTION 15 block before adding this.
-   ===================================================== */
+/* Typography spacing for consistency */
+h1:not(:first-child),
+h2:not(:first-child),
+h3:not(:first-child) {
+  margin-top: 2rem;
+  margin-bottom: 1rem;
+}
+
+h1:first-child,
+h2:first-child,
+h3:first-child {
+  margin-top: 0;
+  margin-bottom: 1rem;
+}
+
+/* --- CUSTOM MODERN SCROLLBAR --- */
 
-/* Full width container — no artificial max-width cutting space */
+::-webkit-scrollbar {
+  width: 6px !important;
+  height: 6px !important;
+}
+
+::-webkit-scrollbar-track {
+  background: transparent !important;
+}
+
+/* --- LIGHT THEME --- */
+html[data-theme="light"] ::-webkit-scrollbar-thumb {
+  background-color: rgba(203, 213, 225, 1) !important;
+  border-radius: 10px !important;
+}
+
+html[data-theme="light"] ::-webkit-scrollbar-thumb:hover {
+  background-color: rgba(148, 163, 184, 1) !important;
+}
+
+/* --- DARK THEME --- */
+html[data-theme="dark"] ::-webkit-scrollbar-thumb {
+  background-color: rgba(51, 65, 85, 0.8) !important;
+  border-radius: 10px !important;
+}
+
+html[data-theme="dark"] ::-webkit-scrollbar-thumb:hover {
+  background-color: #06b6d4 !important;
+}
+
+/* --- FIREFOX CORRECTIONS --- */
+html[data-theme="light"] {
+  scrollbar-width: thin !important;
+  scrollbar-color: #cbd5e1 transparent !important;
+}
+
+html[data-theme="dark"] {
+  scrollbar-width: thin !important;
+  scrollbar-color: #334155 transparent !important;
+}
+
+/* ===== Section 15 : blog layout ===== */
+/* Full width container */
 .blog-wrapper .container {
   max-width: 100% !important;
   width: 100% !important;
@@ -2086,7 +2050,7 @@ main>div:not(.m-0) {
   padding-right: 1rem !important;
 }
 
-/* Row: full width flex, no gaps, sidebars hug the edges */
+/* Row: full width flex */
 .blog-wrapper .container>.row {
   display: flex !important;
   flex-wrap: nowrap !important;
@@ -2096,7 +2060,7 @@ main>div:not(.m-0) {
   padding: 0 !important;
 }
 
-/* LEFT sidebar — Recent Posts, fixed width, left edge */
+/* LEFT sidebar */
 .blog-wrapper .container>.row>.col.col--3 {
   flex: 0 0 240px !important;
   width: 240px !important;
@@ -2105,27 +2069,34 @@ main>div:not(.m-0) {
   padding-right: 1.5rem !important;
 }
 
-/* CENTER content — takes all remaining space between sidebars */
+/* CENTER column — flex, children centered */
 .blog-wrapper .container>.row>.col:not(.col--2):not(.col--3) {
   flex: 1 1 auto !important;
   min-width: 0 !important;
   max-width: 100% !important;
-  /* Center the text content within this column */
-  padding-left: 3rem !important;
-  padding-right: 3rem !important;
+  padding-left: 1rem !important;
+  padding-right: 1rem !important;
+  display: flex !important;
+  flex-direction: column !important;
+  align-items: center !important;
+}
+
+/* Article + all direct children — centered with max readable width */
+.blog-wrapper .container>.row>.col:not(.col--2):not(.col--3)>* {
+  width: 100% !important;
+  max-width: 860px !important;
 }
 
-/* RIGHT sidebar — TOC, wider so text is readable, right edge */
+/* RIGHT sidebar — TOC */
 .blog-wrapper .container>.row>.col.col--2 {
   flex: 0 0 280px !important;
-  /* ← expanded from ~220px to 280px */
   width: 280px !important;
   max-width: 280px !important;
   padding-left: 1rem !important;
   padding-right: 0.5rem !important;
 }
 
-/* TOC links: allow text to wrap properly instead of squishing */
+/* TOC links */
 .blog-wrapper .table-of-contents__link {
   white-space: normal !important;
   word-break: break-word !important;
@@ -2135,18 +2106,16 @@ main>div:not(.m-0) {
   font-size: 0.85rem !important;
 }
 
-/* TOC heading items — slightly bolder for hierarchy */
 .blog-wrapper .table-of-contents li>.table-of-contents__link {
   font-size: 0.875rem !important;
 }
 
-/* Comfortable reading styles */
 .blog-post-page .markdown {
   max-width: 100% !important;
   line-height: 1.8 !important;
 }
 
-/* ── Large desktop (≥1400px) ── */
+/* ── Large desktop (≥1400px) — wider content ── */
 @media (min-width: 1400px) {
   .blog-wrapper .container>.row>.col.col--3 {
     flex: 0 0 260px !important;
@@ -2160,9 +2129,15 @@ main>div:not(.m-0) {
     max-width: 300px !important;
   }
 
-  .blog-wrapper .container>.row>.col:not(.col--2):not(.col--3) {
-    padding-left: 4rem !important;
-    padding-right: 4rem !important;
+  .blog-wrapper .container>.row>.col:not(.col--2):not(.col--3)>* {
+    max-width: 960px !important;
+  }
+}
+
+/* ── Very large (≥1800px) — even wider ── */
+@media (min-width: 1800px) {
+  .blog-wrapper .container>.row>.col:not(.col--2):not(.col--3)>* {
+    max-width: 1100px !important;
   }
 }
 
@@ -2180,13 +2155,12 @@ main>div:not(.m-0) {
     max-width: 220px !important;
   }
 
-  .blog-wrapper .container>.row>.col:not(.col--2):not(.col--3) {
-    padding-left: 2rem !important;
-    padding-right: 2rem !important;
+  .blog-wrapper .container>.row>.col:not(.col--2):not(.col--3)>* {
+    max-width: 100% !important;
   }
 }
 
-/* ── Mobile (≤996px): stack columns naturally ── */
+/* ── Mobile (≤996px) ── */
 @media (max-width: 996px) {
   .blog-wrapper .container {
     padding-left: 1rem !important;
@@ -2205,28 +2179,14 @@ main>div:not(.m-0) {
     max-width: 100% !important;
     padding-left: 0 !important;
     padding-right: 0 !important;
+    align-items: flex-start !important;
   }
-}
 
-/* ===== HOVER ZOOM FOR BLOG IMAGES ===== */
-.img-zoom {
-  overflow: hidden;
-  display: inline-block;
-  width: 100%;
-  border-radius: 8px;
-}
-
-.img-zoom img {
-  transition: transform 0.35s ease, box-shadow 0.35s ease;
-  cursor: zoom-in;
-  display: block;
-  width: 100%;
+  .blog-wrapper .container>.row>.col:not(.col--2):not(.col--3)>* {
+    max-width: 100% !important;
+  }
 }
 
-.img-zoom img:hover {
-  transform: scale(1.08);
-  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.25);
-}
 /* =====================================================
    END SECTION 15
-   ===================================================== */
+   ===================================================== */
\ No newline at end of file