diff --git a/.gitignore b/.gitignore
index 9a60f87..f2d6d26 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,3 +1,8 @@
 .DS_Store
 
-public/
\ No newline at end of file
+# Hugo build output
+public/
+
+# Hugo auto-generated files
+resources/_gen/
+assets/jsconfig.json
\ No newline at end of file
diff --git a/assets/images/banner.png b/assets/images/banner.png
index f30b9d8..860c4d8 100644
Binary files a/assets/images/banner.png and b/assets/images/banner.png differ
diff --git a/assets/images/social/email.svg b/assets/images/social/email.svg
index dbc2499..0ed6fba 100644
--- a/assets/images/social/email.svg
+++ b/assets/images/social/email.svg
@@ -1,4 +1,14 @@
-<?xml version="1.0" encoding="utf-8"?><!-- Source: SVG Repo, www.svgrepo.com -->
-<svg width="800px" height="800px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M4 7L10.94 11.3375C11.5885 11.7428 12.4115 11.7428 13.06 11.3375L20 7M5 18H19C20.1046 18 21 17.1046 21 16V8C21 6.89543 20.1046 6 19 6H5C3.89543 6 3 6.89543 3 8V16C3 17.1046 3.89543 18 5 18Z" stroke="#000000" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
-</svg>
+<?xml version="1.0" encoding="iso-8859-1"?>
+<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg fill="#000000" height="800px" width="800px" version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" 
+	 viewBox="0 0 512 512" xml:space="preserve">
+<g>
+	<g>
+		<path d="M454.4,90.667H54.613C20.907,90.667,0,110.293,0,141.76v228.373c0,30.613,21.333,51.2,53.12,51.2H454.4
+			c32.853,0,57.6-21.973,57.6-51.2V141.76C512,110.72,489.387,90.667,454.4,90.667z M54.72,112H454.4
+			c5.973,0,16.427,1.067,24.533,6.4l-214.08,172.16L32.427,117.653C37.867,114.027,45.227,112,54.72,112z M490.667,370.133
+			c0,19.627-18.24,29.867-36.267,29.867H53.12c-19.947,0-31.787-11.2-31.787-29.867V141.76c0-1.813,0.213-3.733,0.427-5.547
+			l237.013,176.32c3.947,2.88,9.28,2.773,13.013-0.213l218.24-175.467c0.32,1.6,0.533,3.307,0.64,5.013L490.667,370.133z"/>
+	</g>
+</g>
+</svg>
\ No newline at end of file
diff --git a/assets/scss/custom/_custom.scss b/assets/scss/custom/_custom.scss
new file mode 100644
index 0000000..519b64d
--- /dev/null
+++ b/assets/scss/custom/_custom.scss
@@ -0,0 +1,15 @@
+/* Custom styles for Kagenti website */
+
+/* Make the hero banner image smaller by constraining height */
+.classic-hero-image img {
+  max-height: 425px !important;
+  width: auto !important;
+  height: auto !important;
+}
+
+/* Adjust for mobile */
+@media (max-width: 768px) {
+  .classic-hero-image img {
+    max-height: 250px !important;
+  }
+}
diff --git a/assets/scss/custom/pages/_hero.scss b/assets/scss/custom/pages/_hero.scss
new file mode 100644
index 0000000..76f0942
--- /dev/null
+++ b/assets/scss/custom/pages/_hero.scss
@@ -0,0 +1,22 @@
+//
+// hero.scss
+//
+
+.classic-hero-image img {
+    max-height: 100px !important;
+    width: auto !important;
+    height: auto !important;
+}
+
+@media (max-width:767px) {
+    .classic-hero-image img {
+        max-height: 250px !important;
+        width: auto !important;
+        height: auto !important;
+    }
+}
+
+.hero {
+    background-size: cover;
+    padding-top: 70px;
+}
diff --git a/assets/scss/style.scss b/assets/scss/style.scss
new file mode 100644
index 0000000..98598b2
--- /dev/null
+++ b/assets/scss/style.scss
@@ -0,0 +1,54 @@
+/* Template Name: LotusLabs Docs
+   Author: Colin Wilson
+   E-mail: colin.wilson@proton.me
+   Created: October 2022
+   Version: 1.0.0
+   File Description: Main CSS file of the Landing Page template
+*/
+
+//Custom Font Variables
+$font-family-secondary:  {{ .Site.Params.secondary_font | default "-apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Helvetica Neue', 'Ubuntu'" }};
+$font-family-sans-serif: {{ .Site.Params.sans_serif_font | default "-apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Helvetica Neue', 'Ubuntu'" }};
+$font-family-monospace:  {{ .Site.Params.mono_font | default "SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace" }};
+
+//Fonts
+// @import "custom/fonts/fonts";
+
+//Core files
+@import "bootstrap/functions";
+@import "bootstrap/variables";
+@import "variables";
+@import "bootstrap/mixins";
+@import "bootstrap/bootstrap";
+
+// Plugins
+@import "custom/plugins/icons/google-material";
+
+// Structure
+@import "custom/structure/general";
+@import "custom/structure/topbar";
+// @import "custom/structure/content";
+// @import "custom/structure/sidebar-layouts";
+// @import "custom/structure/doc-nav";
+// @import "custom/structure/toc-layouts";
+@import "custom/structure/footer";
+
+// // Components
+@import "custom/components/buttons";
+@import "custom/components/badge";
+@import "custom/components/backgrounds";
+// @import "custom/components/alerts";
+// @import "custom/components/card";
+
+// // Pages
+// @import "custom/pages/blog";
+
+@import "custom/pages/features";
+@import "custom/pages/helper";
+@import "custom/pages/hero";
+{{ if ($.Scratch.Get "image_compare_enabled") }}@import "custom/pages/image-compare-viewer";{{ end }}
+
+// @import "custom/pages/simplebar";
+
+// Custom Kagenti styles
+@import "custom/custom";
diff --git a/content/docs/components/agent-identity.md b/content/docs/components/agent-identity.md
new file mode 100644
index 0000000..e7cdcc9
--- /dev/null
+++ b/content/docs/components/agent-identity.md
@@ -0,0 +1,8 @@
+---
+title: "Agent Identity & Discoverability"
+description: "SPIFFE/SPIRE workload identity and agent discovery"
+date: 2026-03-16
+weight: 6
+---
+
+{{< remote-markdown url="https://raw.githubusercontent.com/kagenti/kagenti/main/docs/identity-guide.md" >}}
diff --git a/content/docs/components/agent-sandbox.md b/content/docs/components/agent-sandbox.md
new file mode 100644
index 0000000..d3bcd68
--- /dev/null
+++ b/content/docs/components/agent-sandbox.md
@@ -0,0 +1,8 @@
+---
+title: "Agent Sandbox"
+description: "Skills-Driven Coding Agents in Kubernetes Isolation"
+date: 2026-02-23
+weight: 1
+---
+
+{{< remote-markdown url="https://raw.githubusercontent.com/kagenti/kagenti/main/docs/architecture/agent-sandbox.md" >}}
diff --git a/content/docs/components/benchmarking.md b/content/docs/components/benchmarking.md
new file mode 100644
index 0000000..fd74016
--- /dev/null
+++ b/content/docs/components/benchmarking.md
@@ -0,0 +1,30 @@
+---
+title: "Benchmarking"
+description: "Performance benchmarking and testing for AI agents"
+date: 2026-03-16
+weight: 2
+---
+
+> Performance benchmarking and testing capabilities for Kagenti agents
+
+**Status**: Coming Soon
+
+---
+
+## Overview
+
+The Kagenti benchmarking component will provide comprehensive performance testing and evaluation capabilities for AI agents deployed on the platform.
+
+## Planned Features
+
+- **Performance Metrics**: Measure response times, throughput, and resource utilization
+- **Load Testing**: Simulate concurrent users and workloads
+- **Agent Comparison**: Compare different agent implementations and configurations
+- **Quality Metrics**: Evaluate agent output quality and accuracy
+- **Cost Analysis**: Track token usage and operational costs
+
+## Coming Soon
+
+Detailed documentation and implementation for the benchmarking component will be available in a future release.
+
+For questions or to contribute to benchmarking capabilities, please join our [Discord community](https://discord.gg/aJ92dNDzqB).
diff --git a/content/docs/components/lifecycle-operators.md b/content/docs/components/lifecycle-operators.md
new file mode 100644
index 0000000..29fe65a
--- /dev/null
+++ b/content/docs/components/lifecycle-operators.md
@@ -0,0 +1,8 @@
+---
+title: "Kagenti Lifecycle Operators"
+description: "Kubernetes operators for AI agent and MCP tool deployment"
+date: 2026-03-16
+weight: 4
+---
+
+{{< remote-markdown url="https://raw.githubusercontent.com/kagenti/kagenti/main/docs/components.md" >}}
diff --git a/content/docs/components/mcp-gateway.md b/content/docs/components/mcp-gateway.md
new file mode 100644
index 0000000..0556ee9
--- /dev/null
+++ b/content/docs/components/mcp-gateway.md
@@ -0,0 +1,8 @@
+---
+title: "MCP Gateway"
+description: "Envoy-based gateway for Model Context Protocol servers"
+date: 2026-03-16
+weight: 5
+---
+
+{{< remote-markdown url="https://raw.githubusercontent.com/kagenti/mcp-gateway/main/README.md" >}}
diff --git a/content/docs/components/observability.md b/content/docs/components/observability.md
new file mode 100644
index 0000000..4f19947
--- /dev/null
+++ b/content/docs/components/observability.md
@@ -0,0 +1,8 @@
+---
+title: "Observability"
+description: "OpenTelemetry instrumentation and tracing for AI agents"
+date: 2026-03-16
+weight: 3
+---
+
+{{< remote-markdown url="https://raw.githubusercontent.com/kagenti/kagenti/main/docs/agents/otel-instrumentation.md" >}}
diff --git a/content/docs/components/security-access-control.md b/content/docs/components/security-access-control.md
new file mode 100644
index 0000000..a23b509
--- /dev/null
+++ b/content/docs/components/security-access-control.md
@@ -0,0 +1,8 @@
+---
+title: "Security & Access Control"
+description: "Identity-based access control with SPIFFE/SPIRE and OAuth2"
+date: 2026-03-16
+weight: 7
+---
+
+{{< remote-markdown url="https://raw.githubusercontent.com/kagenti/kagenti/main/docs/components.md" >}}
diff --git a/data/landing.yaml b/data/landing.yaml
index 42e156b..642b38d 100644
--- a/data/landing.yaml
+++ b/data/landing.yaml
@@ -56,6 +56,34 @@ components:
   # subtitle: Lotus Docs is a highly configurable Hugo documentation theme. Yet, with the default configuration you can deploy and publish your documentation site in a matter of minutes. Check out some core features below.
 
   items:
+    - title: Agent Sandbox
+      icon: security
+      description: Agent Sandbox enables skills-driven coding agents to run in Kubernetes with defense-in-depth isolation. It combines kernel-level sandboxing (Landlock LSM + seccomp-BPF), network filtering, credential isolation via AuthBridge, and SPIFFE/SPIRE identity to provide secure execution for autonomous and interactive agent workflows. Supporting any LLM via litellm, it reuses the same CLAUDE.md and skills from local development while ensuring untrusted code cannot compromise the system.
+      ctaLink:
+        text: Learn more
+        url: /docs/components/agent-sandbox
+
+    - title: Benchmarking
+      icon: speed
+      description: Performance benchmarking and testing capabilities for AI agents deployed on Kagenti. Provides comprehensive metrics for response times, throughput, resource utilization, load testing, and agent comparison. Enables teams to evaluate agent output quality, track token usage, and optimize operational costs across different implementations and configurations.
+      ctaLink:
+        text: Learn more
+        url: /docs/components/benchmarking
+
+    - title: Observability
+      icon: visibility
+      description: OpenTelemetry instrumentation following GenAI semantic conventions for comprehensive agent observability. Integrates with MLflow for experiment tracking and Phoenix for LLM debugging, providing detailed traces of agent invocations, LLM calls, tool executions, and token usage. Enables teams to monitor, debug, and optimize agent performance in production with distributed tracing and semantic attributes.
+      ctaLink:
+        text: Learn more
+        url: /docs/components/observability
+
+    - title: Kagenti Lifecycle Operators
+      icon: smart_toy
+      description: Kagenti Lifecycle Operators automate the deployment and management of AI agents and MCP tools on Kubernetes. The Agent Operator handles agents from container images or source code, while the MCP Tool Operator manages tools via Tool Hive. This streamlines the path from development to production with fast, flexible, and reliable automation.
+      ctaLink:
+        text: Learn more
+        url: /docs/components/lifecycle-operators
+
     - title: MCP Gateway
       icon: build
       description: |
@@ -64,21 +92,21 @@ components:
         **Security & Safety Plugins**: The [plugins-adapter](https://github.com/kagenti/plugins-adapter) works with MCP Gateway to provide request/response filtering, content moderation, and policy enforcement for secure AI agent interactions.
       ctaLink:
         text: Learn more
-        url: https://github.com/kagenti/mcp-gateway
+        url: /docs/components/mcp-gateway
 
-    - title: Identity and Authorization Bridge
-      icon: key
-      description: Identity and Authorization Bridge includes sidecars that provide identity-based, delegated access control for agents to tools, transparent to agent code. They implement agent identity using SPIFFE/SPIRE, dynamic OAuth client registration, token exchange with fine-grained scoping, and secret retrieval from vault for external tool integration. Together they ensure zero-trust security for agents and allow users to precisely control what agents can do on their behalf.
+    - title: Agent Identity & Discoverability
+      icon: fingerprint
+      description: Zero-trust identity architecture combining SPIFFE/SPIRE workload identity, OAuth2 token exchange, and Keycloak identity management. Provides secure, scalable, and dynamic authentication for cloud-native AI agents with machine identity management, secure delegation through token exchange, and continuous verification. Replaces static credentials with SPIRE-issued JWTs and ensures least-privilege access across the platform.
       ctaLink:
         text: Learn more
-        url: https://github.com/kagenti/kagenti/blob/main/docs/components.md#identity--auth-bridge
+        url: /docs/components/agent-identity
 
-    - title: Kagenti Lifecycle Operators
-      icon: smart_toy
-      description: Kagenti Lifecycle Operators automate the deployment and management of AI agents and MCP tools on Kubernetes. The Agent Operator handles agents from container images or source code, while the MCP Tool Operator manages tools via Tool Hive. This streamlines the path from development to production with fast, flexible, and reliable automation.
+    - title: Security & Access Control
+      icon: shield
+      description: Identity and Authorization Bridge includes sidecars that provide identity-based, delegated access control for agents to tools, transparent to agent code. They implement agent identity using SPIFFE/SPIRE, dynamic OAuth client registration, token exchange with fine-grained scoping, and secret retrieval from vault for external tool integration. Together they ensure zero-trust security for agents and allow users to precisely control what agents can do on their behalf.
       ctaLink:
         text: Learn more
-        url: https://github.com/kagenti/kagenti/blob/main/docs/components.md#agent-lifecycle-operator
+        url: /docs/components/security-access-control
 
 blogs:
   enable: true
diff --git a/hugo.toml b/hugo.toml
index c4ebbfb..6236aa2 100644
--- a/hugo.toml
+++ b/hugo.toml
@@ -36,6 +36,12 @@ tags = ['Kubernetes', 'agent', 'workload', 'platform', 'AI', 'LLM']
     email = "mailto:kagenti-maintainers@googlegroups.com"
 
 [menu]
+  [[menu.primary]]
+    name  = "Docs"
+    url = "/docs/components/agent-sandbox"
+    identifier = "docs"
+    weight = 5
+
   [[menu.primary]]
     name  = "Blogs"
     url = "https://medium.com/kagenti-the-agentic-platform"
diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html
index 9c8fd96..98e10a2 100644
--- a/layouts/_default/baseof.html
+++ b/layouts/_default/baseof.html
@@ -1,7 +1,7 @@
 <!DOCTYPE html>
 {{ $.Scratch.Delete "social_list" }}
 <!-- social_list -->
-{{ $social_params := slice "github" "discord" "youtube" "twitter" "bluesky" "instagram" "rss" "email" }}
+{{ $social_params := slice "github" "discord" "youtube" "email" "twitter" "bluesky" "instagram" "rss" }}
 {{ range $social_params }}
     {{ if isset site.Params.social . }}
         {{ $.Scratch.Add "social_list" (slice .) }}
diff --git a/layouts/docs/baseof.html b/layouts/docs/baseof.html
new file mode 100644
index 0000000..24b6b63
--- /dev/null
+++ b/layouts/docs/baseof.html
@@ -0,0 +1,104 @@
+<!DOCTYPE html>
+{{ $.Scratch.Delete "social_list" }}
+{{ $.Scratch.Set "pathName" (printf "%s" (.Site.Params.docs.pathName | default "docs")) }}
+<!-- social_list -->
+{{ $social_params := slice "github" "discord" "youtube" "email" "twitter" "bluesky" "instagram" "rss" }}
+{{ range $social_params }}
+    {{ if isset site.Params.social . }}
+        {{ $.Scratch.Add "social_list" (slice .) }}
+    {{ end }}
+{{ end }}
+<html lang="{{ site.LanguageCode }}">
+    {{- partial (printf "%s/%s" ($.Scratch.Get "pathName") "head.html") . -}}
+    <body>
+        <div class="content">
+            <div class="page-wrapper toggled">
+                {{- partial (printf "%s/%s" ($.Scratch.Get "pathName") "sidebar.html") . -}}
+                    <!-- Start Page Content -->
+                    <main class="page-content bg-transparent">
+                        {{ if hugo.IsMultilingual }}
+                            {{- partial (printf "%s/%s" ($.Scratch.Get "pathName") "top-header.html") . -}}
+                        {{ else }}
+                            {{- partialCached (printf "%s/%s" ($.Scratch.Get "pathName") "top-header.html") . -}}
+                        {{ end }}
+                            <div class="container-fluid">
+                                <div class="layout-spacing">
+                                    {{ $currentPage := . -}}
+                                    {{ if site.Params.docs.breadcrumbs | default true }}
+                                        <div class="d-md-flex justify-content-between align-items-center">
+                                            {{- partial (printf "%s/%s" ($.Scratch.Get "pathName") "breadcrumbs.html") . -}}
+                                        </div>
+                                    {{ end }}
+                                    <div class="row flex-xl-nowrap">
+                                        {{ if site.Params.docs.toc | default true }}
+                                        <div class="docs-toc col-xl-3 {{ if .IsNode }}visually-hidden{{ else }}{{end}} {{ if and (ne .Params.toc false) (ne .TableOfContents "<nav id=\"TableOfContents\"></nav>") }}{{ else }}visually-hidden{{ end }} {{ if site.Params.docs.toc | default true }}{{ else }}visually-hidden{{ end }} d-xl-block">
+                                            {{- partial (printf "%s/%s" ($.Scratch.Get "pathName") "toc.html") . -}}
+                                        </div>
+                                        {{ end }}
+                                        {{ if site.Params.docs.tocMobile | default true }}
+                                        <div class="docs-toc-mobile {{ if .IsNode }}visually-hidden{{ else }}{{end}} {{ if and (ne .Params.toc false) (ne .TableOfContents "<nav id=\"TableOfContents\"></nav>") }}{{ else }}visually-hidden{{ end }} {{ if site.Params.docs.tocMobile | default true }}{{ else }}visually-hidden{{ end }} d-print-none d-xl-none">
+                                            <button id="toc-dropdown-btn" class="btn-secondary dropdown-toggle" type="button" data-bs-toggle="dropdown" data-bs-offset="0,0" aria-expanded="false">
+                                                Table of Contents
+                                            </button>
+                                            {{- partial (printf "%s/%s" ($.Scratch.Get "pathName") "toc-mobile.html") . -}}
+                                        </div>
+                                        {{ end -}}
+                                        <div class="docs-content col-12 {{ if .IsNode }}{{ else }}{{ if site.Params.docs.toc | default true }}{{ if and (ne .Params.toc false) (ne .TableOfContents "<nav id=\"TableOfContents\"></nav>") }}col-xl-9{{else}}{{end}}{{ else }}{{ end }}{{ end }} mt-0">
+                                            <div class="mb-0 d-flex">
+                                                {{ if site.Params.docs.titleIcon | default false }}
+                                                <i class="material-icons title-icon me-2">{{- .Params.icon | default "article" }}</i>
+                                                {{ end }}
+                                                <h1 class="content-title mb-0">
+                                                    {{ $currentPage.Title }}
+                                                    {{ if .Draft }}
+                                                        <span class="badge bg-default fs-6 mb-1 align-middle">DRAFT</span>
+                                                    {{ end }}
+                                                </h1>
+                                            </div>
+                                            {{ if site.Params.docs.descriptions | default false }}
+                                                <p class="lead mb-3">{{ $currentPage.Description | markdownify }}</p>
+                                            {{ end }}
+                                            <div id="content" class="main-content" {{ if eq .Site.Params.docs.toc true -}}data-bs-spy="scroll" data-bs-root-margin="0px 0px -65%" data-bs-target="#toc-mobile"{{ end }}>
+                                                {{ block "main" . }}{{ end }}
+                                            </div>
+                                            <div>
+                                                {{- partial (printf "%s/%s" ($.Scratch.Get "pathName") "doc-nav.html") . -}}
+                                            </div>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                            {{- partialCached (printf "%s/%s" ($.Scratch.Get "pathName") "footer.html") . -}}
+
+                    </main>
+            </div>
+        </div>
+
+        {{ if site.Params.docs.backToTop | default true }}
+        <!-- Back to top -->
+        <button onclick="topFunction()" id="back-to-top" aria-label="Back to Top Button" class="back-to-top fs-5"><svg width="24" height="24"><path d="M12,10.224l-6.3,6.3L4.32,15.152,12,7.472l7.68,7.68L18.3,16.528Z" style="fill:#fff"/></svg></button>
+        <!-- Back to top -->
+        {{ end }}
+
+        <!-- Dark Mode Switch JS -->
+        {{ if eq .Site.Params.docs.darkMode true -}}
+            {{ $darkModeSwitch := resources.Get (printf "/%s/%s" ($.Scratch.Get "pathName") "js/darkmode-switch.js") | js.Build | minify }}
+            <script>{{ $darkModeSwitch.Content | safeJS }}</script>
+        {{ end -}}
+
+        {{- partialCached (printf "%s/%s" ($.Scratch.Get "pathName") "footer/footer-scripts.html") . -}}
+
+        <!-- DocSearch Config -->
+        {{ if and (.Site.Params.docsearch.appID) (.Site.Params.docsearch.apiKey) -}}
+            {{- partialCached (printf "%s/%s" ($.Scratch.Get "pathName") "footer/docsearch.html") . -}}
+        {{ end }}
+
+        <!-- FlexSearch Config -->
+        {{ if or (not (isset .Site.Params.flexsearch "enabled")) (eq .Site.Params.flexsearch.enabled true) -}}
+            {{ if and (.Site.Params.docsearch.appID) (.Site.Params.docsearch.apiKey) -}}
+            {{ else }}
+                {{- partialCached (printf "%s/%s" ($.Scratch.Get "pathName") "footer/flexsearch.html") . -}}
+            {{ end }}
+        {{ end }}
+    </body>
+</html>
diff --git a/layouts/partials/docs/top-header.html b/layouts/partials/docs/top-header.html
new file mode 100644
index 0000000..ead69f8
--- /dev/null
+++ b/layouts/partials/docs/top-header.html
@@ -0,0 +1,135 @@
+<!-- Top Header -->
+<div id="top-header" class="top-header d-print-none">
+    <div class="header-bar d-flex justify-content-between">
+        <div class="d-flex align-items-center">
+            <a href='{{ with .Site.Params.docs.logoLinkURL }}{{ . }}{{ else }}{{ relLangURL "" }}{{ end }}' class="logo-icon me-3" aria-label="HomePage" alt="HomePage">
+                <div class="small">
+                    {{ with resources.Get "images/logos/mark.svg" }}
+                            {{ .Content | safeHTML }}
+                    {{ end }}
+                </div>
+                <div class="big">
+                    {{ with resources.Get "images/logos/logo.svg" }}
+                            {{ .Content | safeHTML }}
+                    {{ end }}
+                </div>
+            </a>
+            <button id="close-sidebar" class="btn btn-icon btn-soft">
+                <span class="material-icons size-20 menu-icon align-middle">menu</span>
+            </button>
+            {{ if and (.Site.Params.docsearch.appID) (.Site.Params.docsearch.apiKey) -}}
+            <span><div id="docsearch"></div></span>
+            {{ end }}
+            {{ if or (not (isset .Site.Params.flexsearch "enabled")) (eq .Site.Params.flexsearch.enabled true) -}}
+                {{ if and (.Site.Params.docsearch.appID) (.Site.Params.docsearch.apiKey) -}}
+                {{ else }}
+                    <button id="flexsearch-button" class="ms-3 btn btn-soft" data-bs-toggle="collapse" data-bs-target="#FlexSearchCollapse" aria-expanded="false" aria-controls="FlexSearchCollapse">
+                        <span class="material-icons size-20 menu-icon align-middle">search</span>
+                        <span class="flexsearch-button-placeholder ms-1 me-2 d-none d-sm-block">{{ i18n "search_title" }}</span>
+                        <div class="d-none d-sm-block">
+                            <span class="flexsearch-button-keys">
+                                <kbd class="flexsearch-button-cmd-key">
+                                    <svg width="44" height="15"><path d="M2.118,11.5A1.519,1.519,0,0,1,1,11.042,1.583,1.583,0,0,1,1,8.815a1.519,1.519,0,0,1,1.113-.458h.715V6.643H2.118A1.519,1.519,0,0,1,1,6.185,1.519,1.519,0,0,1,.547,5.071,1.519,1.519,0,0,1,1,3.958,1.519,1.519,0,0,1,2.118,3.5a1.519,1.519,0,0,1,1.114.458A1.519,1.519,0,0,1,3.69,5.071v.715H5.4V5.071A1.564,1.564,0,0,1,6.976,3.5,1.564,1.564,0,0,1,8.547,5.071,1.564,1.564,0,0,1,6.976,6.643H6.261V8.357h.715a1.575,1.575,0,0,1,1.113,2.685,1.583,1.583,0,0,1-2.227,0A1.519,1.519,0,0,1,5.4,9.929V9.214H3.69v.715a1.519,1.519,0,0,1-.458,1.113A1.519,1.519,0,0,1,2.118,11.5Zm0-.857a.714.714,0,0,0,.715-.714V9.214H2.118a.715.715,0,1,0,0,1.429Zm4.858,0a.715.715,0,1,0,0-1.429H6.261v.715a.714.714,0,0,0,.715.714ZM3.69,8.357H5.4V6.643H3.69ZM2.118,5.786h.715V5.071a.714.714,0,0,0-.715-.714.715.715,0,0,0-.5,1.22A.686.686,0,0,0,2.118,5.786Zm4.143,0h.715a.715.715,0,0,0,.5-1.22.715.715,0,0,0-1.22.5Z" fill="currentColor"></path><path d="M12.4,11.475H11.344l3.879-7.95h1.056Z" fill="currentColor"></path><path d="M25.073,5.384l-.864.576a2.121,2.121,0,0,0-1.786-.923a2.207,2.207,0,0,0-2.266,2.326,2.206,2.206,0,0,0,2.266,2.325,2.1,2.1,0,0,0,1.782-.918l.84.617a3.108,3.108,0,0,1-2.622,1.293,3.217,3.217,0,0,1-3.349-3.317,3.217,3.217,0,0,1,3.349-3.317A3.046,3.046,0,0,1,25.073,5.384Z" fill="currentColor"></path><path d="M30.993,5.142h-2.07v5.419H27.891V5.142h-2.07V4.164h5.172Z" fill="currentColor"></path><path d="M34.67,4.164c1.471,0,2.266.658,2.266,1.851,0,1.087-.832,1.809-2.134,1.855l2.107,2.691h-1.28L33.591,7.87H33.07v2.691H32.038v-6.4Zm-1.6.969v1.8h1.572c.832,0,1.22-.3,1.22-.918s-.411-.882-1.22-.882Z" fill="currentColor"></path><path d="M42.883,10.561H38.31v-6.4h1.033V9.583h3.54Z" fill="currentColor"></path></svg>
+                                </kbd>
+                                <kbd class="flexsearch-button-key">
+                                    <svg width="15" height="15"><path d="M5.926,12.279H4.41L9.073,2.721H10.59Z" fill="currentColor"/></svg>
+                                </kbd>
+                            </span>
+                        </div>
+                    </button>
+                {{ end }}
+            {{ end -}}
+        </div>
+
+        <div class="d-flex align-items-center">
+            <!-- Primary Menu Links -->
+            <ul class="list-unstyled mb-0 me-3 d-none d-md-flex">
+                {{- range .Site.Menus.primary }}
+                <li class="list-inline-item mb-0 me-2">
+                    <a href="{{ relLangURL .URL }}" class="btn btn-link text-decoration-none">{{ .Name }}</a>
+                </li>
+                {{ end }}
+            </ul>
+
+            <!-- Social Links -->
+            <ul class="list-unstyled mb-0">
+                {{ with $.Scratch.Get "social_list" }}
+                {{ range . }}
+                    {{ $path := printf "images/social/%s.%s" . "svg" }}
+                    <li class="list-inline-item mb-0">
+                        <a href="{{ if eq . `rss` }} {{ `index.xml` | absURL }} {{ else if eq . `bluesky` }} https://bsky.app/profile/{{ index site.Params.social . }} {{ else }} https://{{ . }}.com/{{ index site.Params.social . }} {{ end }}" alt="{{ . }}" rel="noopener noreferrer" target="_blank">
+                            <div class="btn btn-icon btn-default border-0">
+                                {{ with resources.Get $path }}
+                                    {{ .Content | safeHTML }}
+                                {{ end }}
+                            </div>
+                        </a>
+                    </li>
+                    {{ end }}
+                {{ end }}
+            </ul>
+            {{ if eq .Site.Params.docs.darkMode true -}}
+            <button id="mode" class="btn btn-icon btn-default ms-2" type="button" aria-label="Toggle user interface mode">
+                <span class="toggle-dark">
+                    <svg xmlns="http://www.w3.org/2000/svg" height="30" width="30" viewBox="0 0 48 48" fill="currentColor">
+                        <title>{{ i18n "enable_dark_mode" | default "Enable dark mode" }}</title>
+                        <path d="M24 42q-7.5 0-12.75-5.25T6 24q0-7.5 5.25-12.75T24 6q.4 0 .85.025.45.025 1.15.075-1.8 1.6-2.8 3.95-1 2.35-1 4.95 0 4.5 3.15 7.65Q28.5 25.8 33 25.8q2.6 0 4.95-.925T41.9 22.3q.05.6.075.975Q42 23.65 42 24q0 7.5-5.25 12.75T24 42Zm0-3q5.45 0 9.5-3.375t5.05-7.925q-1.25.55-2.675.825Q34.45 28.8 33 28.8q-5.75 0-9.775-4.025T19.2 15q0-1.2.25-2.575.25-1.375.9-3.125-4.9 1.35-8.125 5.475Q9 18.9 9 24q0 6.25 4.375 10.625T24 39Zm-.2-14.85Z"/>
+                    </svg>
+                </span>
+                <span class="toggle-light">
+                    <svg xmlns="http://www.w3.org/2000/svg" height="30" width="30" viewBox="0 0 48 48" fill="currentColor">
+                        <title>{{ i18n "enable_light_mode" | default "Enable light mode" }}</title>
+                        <path d="M24 31q2.9 0 4.95-2.05Q31 26.9 31 24q0-2.9-2.05-4.95Q26.9 17 24 17q-2.9 0-4.95 2.05Q17 21.1 17 24q0 2.9 2.05 4.95Q21.1 31 24 31Zm0 3q-4.15 0-7.075-2.925T14 24q0-4.15 2.925-7.075T24 14q4.15 0 7.075 2.925T34 24q0 4.15-2.925 7.075T24 34ZM3.5 25.5q-.65 0-1.075-.425Q2 24.65 2 24q0-.65.425-1.075Q2.85 22.5 3.5 22.5h5q.65 0 1.075.425Q10 23.35 10 24q0 .65-.425 1.075-.425.425-1.075.425Zm36 0q-.65 0-1.075-.425Q38 24.65 38 24q0-.65.425-1.075.425-.425 1.075-.425h5q.65 0 1.075.425Q46 23.35 46 24q0 .65-.425 1.075-.425.425-1.075.425ZM24 10q-.65 0-1.075-.425Q22.5 9.15 22.5 8.5v-5q0-.65.425-1.075Q23.35 2 24 2q.65 0 1.075.425.425.425.425 1.075v5q0 .65-.425 1.075Q24.65 10 24 10Zm0 36q-.65 0-1.075-.425-.425-.425-.425-1.075v-5q0-.65.425-1.075Q23.35 38 24 38q.65 0 1.075.425.425.425.425 1.075v5q0 .65-.425 1.075Q24.65 46 24 46ZM12 14.1l-2.85-2.8q-.45-.45-.425-1.075.025-.625.425-1.075.45-.45 1.075-.45t1.075.45L14.1 12q.4.45.4 1.05 0 .6-.4 1-.4.45-1.025.45-.625 0-1.075-.4Zm24.7 24.75L33.9 36q-.4-.45-.4-1.075t.45-1.025q.4-.45 1-.45t1.05.45l2.85 2.8q.45.45.425 1.075-.025.625-.425 1.075-.45.45-1.075.45t-1.075-.45ZM33.9 14.1q-.45-.45-.45-1.05 0-.6.45-1.05l2.8-2.85q.45-.45 1.075-.425.625.025 1.075.425.45.45.45 1.075t-.45 1.075L36 14.1q-.4.4-1.025.4-.625 0-1.075-.4ZM9.15 38.85q-.45-.45-.45-1.075t.45-1.075L12 33.9q.45-.45 1.05-.45.6 0 1.05.45.45.45.45 1.05 0 .6-.45 1.05l-2.8 2.85q-.45.45-1.075.425-.625-.025-1.075-.425ZM24 24Z"/>
+                    </svg>
+                </span>
+            </button>
+            {{ end -}}
+            {{ if hugo.IsMultilingual }}
+                <div class="dropdown">
+                    <button class="btn btn-link btn-default dropdown-toggle ps-2" type="button" data-bs-toggle="dropdown" aria-expanded="false">
+                        {{ site.Language.Lang | upper }}
+                    </button>
+                    <ul class="dropdown-menu text-end">
+                        {{ partial (printf "%s/%s" ($.Scratch.Get "pathName") "i18nlist") . }}
+                    </ul>
+                </div>
+            {{ end }}
+        </div>
+    </div>
+    <!-- FlexSearch Input Start -->
+    {{ if or (not (isset .Site.Params.flexsearch "enabled")) (eq .Site.Params.flexsearch.enabled true) -}}
+        {{ if and (.Site.Params.docsearch.appID) (.Site.Params.docsearch.apiKey) -}}
+        {{ else }}
+            <div class="collapse" id="FlexSearchCollapse">
+                <div class="flexsearch-container">
+                    <div class="flexsearch-keymap">
+                        <li>
+                            <kbd class="flexsearch-button-cmd-key"><svg width="15" height="15" aria-label="Arrow down" role="img"><g fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.2"><path d="M7.5 3.5v8M10.5 8.5l-3 3-3-3"></path></g></svg></kbd>
+                            <kbd class="flexsearch-button-cmd-key"><svg width="15" height="15" aria-label="Arrow up" role="img"><g fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.2"><path d="M7.5 11.5v-8M10.5 6.5l-3-3-3 3"></path></g></svg></kbd>
+                            <span class="flexsearch-key-label">{{ i18n "search_navigate" | default "to navigate" }}</span>
+                        </li>
+                        <li>
+                            <kbd class="flexsearch-button-cmd-key"><svg width="15" height="15" aria-label="Enter key" role="img"><g fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.2"><path d="M12 3.53088v3c0 1-1 2-2 2H4M7 11.53088l-3-3 3-3"></path></g></svg></kbd>
+                            <span class="flexsearch-key-label">{{ i18n "search_select" | default "to select" }}</span>
+                        </li>
+                        <li>
+                            <kbd class="flexsearch-button-cmd-key"><svg width="15" height="15" aria-label="Escape key" role="img"><g fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.2"><path d="M13.6167 8.936c-.1065.3583-.6883.962-1.4875.962-.7993 0-1.653-.9165-1.653-2.1258v-.5678c0-1.2548.7896-2.1016 1.653-2.1016.8634 0 1.3601.4778 1.4875 1.0724M9 6c-.1352-.4735-.7506-.9219-1.46-.8972-.7092.0246-1.344.57-1.344 1.2166s.4198.8812 1.3445.9805C8.465 7.3992 8.968 7.9337 9 8.5c.032.5663-.454 1.398-1.4595 1.398C6.6593 9.898 6 9 5.963 8.4851m-1.4748.5368c-.2635.5941-.8099.876-1.5443.876s-1.7073-.6248-1.7073-2.204v-.4603c0-1.0416.721-2.131 1.7073-2.131.9864 0 1.6425 1.031 1.5443 2.2492h-2.956"></path></g></svg></kbd>
+                            <span class="flexsearch-key-label">{{ i18n "search_close" | default "to close" }}</span>
+                        </li>
+                    </div>
+                    <form class="flexsearch position-relative flex-grow-1 ms-2 me-2">
+                        <div class="d-flex flex-row">
+                            <input id="flexsearch" class="form-control" type="search" placeholder="{{ i18n "search_title" }}" aria-label="{{ i18n "search_title" }}" autocomplete="off">
+                            <button id="hideFlexsearch" type="button" class="ms-2 btn btn-soft">
+                                {{ i18n "search_cancel" | default "cancel" }}
+                            </button>
+                        </div>
+                        <div id="suggestions" class="shadow rounded-1 d-none"></div>
+                    </form>
+                </div>
+            </div>
+        {{ end }}
+    {{ end }}
+    <!-- FlexSearch Input End -->
+</div>
+<!-- Top Header -->
diff --git a/layouts/shortcodes/remote-markdown.html b/layouts/shortcodes/remote-markdown.html
new file mode 100644
index 0000000..d45b02d
--- /dev/null
+++ b/layouts/shortcodes/remote-markdown.html
@@ -0,0 +1,10 @@
+{{ $url := .Get "url" }}
+{{ $resource := resources.GetRemote $url }}
+{{ with $resource }}
+  {{ $content := .Content }}
+  {{/* Remove the first H1 heading (# Title) from the markdown */}}
+  {{ $content = replaceRE `(?m)^# .+\n` "" $content 1 }}
+  {{ $content | markdownify }}
+{{ else }}
+  <p>Error: Unable to fetch content from {{ $url }}</p>
+{{ end }}