feat(Page): move breadcrumb header to the layout and add a logo section

src/routes/Page.svelte

@@ -3,12 +3,13 @@
     Description: The main page component of the application.
 -->
 <script lang="ts">
-import { BreadcrumbHeader } from '$entities/Breadcrumb';
 import { scrollBreadcrumbsStore } from '$entities/Breadcrumb';
+import { cn } from '$shared/shadcn/utils/shadcn-utils';
 import { Section } from '$shared/ui';
 import ComparisonSlider from '$widgets/ComparisonSlider/ui/ComparisonSlider/ComparisonSlider.svelte';
 import { FontSearch } from '$widgets/FontSearch';
 import { SampleList } from '$widgets/SampleList';
+import CodeIcon from '@lucide/svelte/icons/code';
 import LineSquiggleIcon from '@lucide/svelte/icons/line-squiggle';
 import ScanEyeIcon from '@lucide/svelte/icons/scan-eye';
 import ScanSearchIcon from '@lucide/svelte/icons/search';
@@ -40,11 +41,23 @@ function handleTitleStatusChanged(index: number, isPast: boolean, title?: Snippe
 // });
 </script>
 
-<BreadcrumbHeader />
-
 <!-- Font List -->
 <div class="p-2 h-full flex flex-col gap-3">
-    <Section class="my-12 gap-8" index={0} onTitleStatusChange={handleTitleStatusChanged}>
+    <Section class="my-12 gap-8" onTitleStatusChange={handleTitleStatusChanged}>
+        {#snippet icon({ className })}
+            <CodeIcon class={className} />
+        {/snippet}
+        {#snippet description({ className })}
+            <span class={className}>
+                Project_Codename
+            </span>
+        {/snippet}
+        <h2 class={cn('font-[Barlow] font-thin text-7xl md:text-8xl text-justify [text-align-last:justify] [text-justify:inter-character]')}>
+            GLYPHDIFF
+        </h2>
+    </Section>
+
+    <Section class="my-12 gap-8" index={1} onTitleStatusChange={handleTitleStatusChanged}>
         {#snippet icon({ className })}
             <ScanEyeIcon class={className} />
         {/snippet}
@@ -56,7 +69,7 @@ function handleTitleStatusChanged(index: number, isPast: boolean, title?: Snippe
         <ComparisonSlider />
     </Section>
 
-    <Section class="my-12 gap-8" index={1} onTitleStatusChange={handleTitleStatusChanged}>
+    <Section class="my-12 gap-8" index={2} onTitleStatusChange={handleTitleStatusChanged}>
         {#snippet icon({ className })}
             <ScanSearchIcon class={className} />
         {/snippet}
@@ -68,7 +81,7 @@ function handleTitleStatusChanged(index: number, isPast: boolean, title?: Snippe
         <FontSearch bind:showFilters={isExpanded} />
     </Section>
 
-    <Section class="my-12 gap-8" index={2} onTitleStatusChange={handleTitleStatusChanged}>
+    <Section class="my-12 gap-8" index={3} onTitleStatusChange={handleTitleStatusChanged}>
         {#snippet icon({ className })}
             <LineSquiggleIcon class={className} />
         {/snippet}