diff --git a/docs.json b/docs.json
index c1ab0aec..3f285218 100644
--- a/docs.json
+++ b/docs.json
@@ -4,8 +4,8 @@
   "description": "Build the future of the internet of blockchains with Cosmos.",
   "theme": "mint",
   "colors": {
-    "primary": "#40eff2",
-    "light": "#FAFAFA",
+    "primary": "#000",
+    "light": "#cccccc",
     "dark": "#0E0E0E"
   },
   "icons": {
@@ -14,7 +14,10 @@
   "styling": {
     "codeblocks": "system"
   },
-  "favicon": "/assets/brand/cosmos.svg",
+  "favicon": {
+    "light": "/assets/brand/cosmos.svg",
+    "dark": "/assets/brand/cosmos-dark.svg"
+  },
   "logo": {
     "light": "/assets/brand/cosmos-wordmark-dark.svg",
     "dark": "/assets/brand/cosmos-wordmark.svg"
diff --git a/styles/globals.css b/styles/globals.css
deleted file mode 100644
index 1d65a6d6..00000000
--- a/styles/globals.css
+++ /dev/null
@@ -1,543 +0,0 @@
-@tailwind base;
-@tailwind components;
-@tailwind utilities;
-
-/* === COSMOS BRAND COLORS === */
-:root {
-  --cosmos-primary: #40eff2;
-  --cosmos-secondary: #FAFAFA;
-  --cosmos-accent: #ec668e;
-}
-
-/* === MINIMAL BRAND-SPECIFIC OVERRIDES === */
-/* Only override what's absolutely necessary for brand consistency */
-
-/* Custom gradient utility for brand elements */
-.cosmos-gradient {
-  background: linear-gradient(135deg, var(--cosmos-primary), var(--cosmos-secondary));
-}
-
-.cosmos-gradient-text {
-  background: linear-gradient(135deg, var(--cosmos-primary), var(--cosmos-secondary));
-  -webkit-background-clip: text;
-  -webkit-text-fill-color: transparent;
-  background-clip: text;
-}
-
-/* Enhanced card hover effects for better UX */
-.card:hover,
-[data-testid="card"]:hover {
-  transform: translateY(-2px);
-  transition: transform 0.2s ease;
-}
-
-/* Ensure proper spacing for content */
-.prose {
-  line-height: 1.7;
-}
-
-/* === LANDING PAGE STYLES === */
-/* Single viewport, no-scroll landing page with smooth theme transitions */
-/* Only used for the main /docs/index.mdx page in custom mode */
-
-.landing-page {
-  height: 100vh;
-  background: linear-gradient(135deg, #f8fafc 0%, #e0e0ff 100%);
-  padding: 0;
-  margin: 0;
-  overflow: hidden;
-  transition: background 0.3s ease;
-}
-
-/* System theme detection - automatically switches based on user's system preference */
-@media (prefers-color-scheme: dark) {
-  .landing-page {
-    background: linear-gradient(135deg, #0f172a 0%, #1a194d 100%);
-  }
-}
-
-[data-theme="dark"] .landing-page {
-  background: linear-gradient(135deg, #0f172a 0%, #1a194d 100%);
-}
-
-/* Ensure smooth color transitions for all theme-dependent elements */
-[data-theme="light"] .landing-page {
-  background: linear-gradient(135deg, #f8fafc 0%, #e0e0ff 100%);
-}
-
-.landing-container {
-  max-width: 1200px;
-  margin: 0 auto;
-  padding: 2rem;
-  height: 100vh;
-  display: flex;
-  flex-direction: column;
-  justify-content: space-between;
-}
-
-/* Condensed Hero Section */
-.hero-section {
-  text-align: center;
-  flex-shrink: 0;
-}
-
-.hero-icon {
-  margin-bottom: 1rem;
-  display: flex;
-  justify-content: center;
-}
-
-.hero-title {
-  font-size: 2.5rem;
-  font-weight: 700;
-  margin-bottom: 0.75rem;
-  background: linear-gradient(135deg, var(--cosmos-primary), var(--cosmos-secondary));
-  -webkit-background-clip: text;
-  -webkit-text-fill-color: transparent;
-  background-clip: text;
-  line-height: 1.2;
-}
-
-.hero-description {
-  font-size: 1.1rem;
-  color: #64748b;
-  max-width: 600px;
-  margin: 0 auto 1.5rem;
-  line-height: 1.5;
-  transition: color 0.3s ease;
-}
-
-/* System theme detection for hero description */
-@media (prefers-color-scheme: dark) {
-  .hero-description {
-    color: #cbd5e1;
-  }
-}
-
-[data-theme="dark"] .hero-description {
-  color: #cbd5e1;
-}
-
-.hero-actions {
-  display: flex;
-  gap: 1rem;
-  justify-content: center;
-  flex-wrap: wrap;
-  margin-bottom: 2rem;
-}
-
-.btn-primary {
-  display: inline-flex;
-  align-items: center;
-  gap: 0.5rem;
-  background: linear-gradient(135deg, var(--cosmos-primary), var(--cosmos-secondary));
-  color: white;
-  padding: 0.75rem 1.5rem;
-  border-radius: 0.75rem;
-  font-weight: 600;
-  text-decoration: none;
-  transition: all 0.2s ease;
-  box-shadow: 0 4px 12px rgba(75, 71, 202, 0.3);
-  font-size: 0.95rem;
-}
-
-.btn-primary:hover {
-  transform: translateY(-2px);
-  box-shadow: 0 8px 20px rgba(75, 71, 202, 0.4);
-  color: white;
-}
-
-.btn-secondary {
-  display: inline-flex;
-  align-items: center;
-  gap: 0.5rem;
-  border: 2px solid var(--cosmos-primary);
-  color: var(--cosmos-primary);
-  padding: 0.75rem 1.5rem;
-  border-radius: 0.75rem;
-  font-weight: 600;
-  text-decoration: none;
-  transition: all 0.2s ease;
-  background: transparent;
-  font-size: 0.95rem;
-}
-
-.btn-secondary:hover {
-  background: var(--cosmos-primary);
-  color: white;
-  transform: translateY(-2px);
-}
-
-[data-theme="dark"] .btn-secondary {
-  color: var(--cosmos-secondary);
-  border-color: var(--cosmos-secondary);
-}
-
-/* System theme detection for secondary button */
-@media (prefers-color-scheme: dark) {
-  .btn-secondary {
-    color: var(--cosmos-secondary);
-    border-color: var(--cosmos-secondary);
-  }
-}
-
-[data-theme="dark"] .btn-secondary:hover {
-  background: var(--cosmos-secondary);
-  color: #0f172a;
-}
-
-/* System theme detection for secondary button hover */
-@media (prefers-color-scheme: dark) {
-  .btn-secondary:hover {
-    background: var(--cosmos-secondary);
-    color: #0f172a;
-  }
-}
-
-.btn-arrow {
-  transition: transform 0.2s ease;
-}
-
-.btn-primary:hover .btn-arrow {
-  transform: translateX(2px);
-}
-
-/* Main Navigation Section */
-.main-nav-section {
-  flex: 1;
-  display: flex;
-  align-items: center;
-  padding: 1rem 0;
-}
-
-.nav-grid {
-  display: grid;
-  grid-template-columns: repeat(4, 1fr);
-  gap: 1.5rem;
-  width: 100%;
-}
-
-.nav-card {
-  background: white;
-  border-radius: 1rem;
-  padding: 1.5rem;
-  text-align: center;
-  transition: all 0.3s ease;
-  border: 1px solid #e2e8f0;
-  min-height: 180px;
-  display: flex;
-  flex-direction: column;
-  justify-content: space-between;
-}
-
-/* System theme detection for nav cards */
-@media (prefers-color-scheme: dark) {
-  .nav-card {
-    background: #1e293b;
-    border-color: #334155;
-  }
-}
-
-[data-theme="dark"] .nav-card {
-  background: #1e293b;
-  border-color: #334155;
-}
-
-.nav-card:hover {
-  transform: translateY(-8px);
-  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
-}
-
-[data-theme="dark"] .nav-card:hover {
-  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.4);
-}
-
-.nav-card.primary {
-  background: linear-gradient(135deg, #3b82f6, #1d4ed8);
-  border: none;
-  color: white;
-}
-
-.nav-card.secondary {
-  background: linear-gradient(135deg, #8b5cf6, #7c3aed);
-  border: none;
-  color: white;
-}
-
-.nav-card.tertiary {
-  background: linear-gradient(135deg, #10b981, #059669);
-  border: none;
-  color: white;
-}
-
-.nav-card.accent {
-  background: linear-gradient(135deg, var(--cosmos-primary), var(--cosmos-secondary));
-  border: none;
-  color: white;
-}
-
-.nav-icon {
-  width: 64px;
-  height: 64px;
-  border-radius: 1rem;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  margin: 0 auto 1rem;
-  background: rgba(255, 255, 255, 0.2);
-  backdrop-filter: blur(10px);
-}
-
-.nav-card h3 {
-  font-size: 1.1rem;
-  font-weight: 600;
-  margin-bottom: 0.5rem;
-  color: inherit;
-}
-
-.nav-card p {
-  font-size: 0.85rem;
-  line-height: 1.4;
-  margin-bottom: 1rem;
-  color: inherit;
-  opacity: 0.9;
-}
-
-.nav-link {
-  color: inherit;
-  font-weight: 600;
-  text-decoration: none;
-  font-size: 0.9rem;
-  transition: opacity 0.2s ease;
-}
-
-.nav-link:hover {
-  opacity: 0.8;
-  color: inherit;
-}
-
-/* Quick Actions */
-.quick-actions {
-  flex-shrink: 0;
-  padding-top: 1rem;
-}
-
-.action-grid {
-  display: grid;
-  grid-template-columns: repeat(6, 1fr);
-  gap: 1rem;
-}
-
-.action-card {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  gap: 0.5rem;
-  padding: 1rem;
-  background: rgba(255, 255, 255, 0.7);
-  border: 1px solid rgba(75, 71, 202, 0.2);
-  border-radius: 0.75rem;
-  text-decoration: none;
-  color: var(--cosmos-primary);
-  transition: all 0.2s ease;
-  backdrop-filter: blur(10px);
-}
-
-/* System theme detection for action cards */
-@media (prefers-color-scheme: dark) {
-  .action-card {
-    background: rgba(30, 41, 59, 0.7);
-    border-color: rgba(34, 226, 168, 0.2);
-    color: var(--cosmos-secondary);
-  }
-}
-
-[data-theme="dark"] .action-card {
-  background: rgba(30, 41, 59, 0.7);
-  border-color: rgba(34, 226, 168, 0.2);
-  color: var(--cosmos-secondary);
-}
-
-.action-card:hover {
-  transform: translateY(-3px);
-  background: rgba(75, 71, 202, 0.1);
-  border-color: var(--cosmos-primary);
-  color: var(--cosmos-primary);
-}
-
-/* System theme detection for action card hover */
-@media (prefers-color-scheme: dark) {
-  .action-card:hover {
-    background: rgba(34, 226, 168, 0.1);
-    border-color: var(--cosmos-secondary);
-    color: var(--cosmos-secondary);
-  }
-}
-
-[data-theme="dark"] .action-card:hover {
-  background: rgba(34, 226, 168, 0.1);
-  border-color: var(--cosmos-secondary);
-  color: var(--cosmos-secondary);
-}
-
-.action-icon {
-  flex-shrink: 0;
-}
-
-.action-card span {
-  font-size: 0.8rem;
-  font-weight: 500;
-  text-align: center;
-}
-
-/* Responsive Design */
-@media (max-width: 1024px) {
-  .nav-grid {
-    grid-template-columns: repeat(2, 1fr);
-  }
-
-  .action-grid {
-    grid-template-columns: repeat(3, 1fr);
-  }
-
-  .hero-title {
-    font-size: 2rem;
-  }
-}
-
-@media (max-width: 768px) {
-  .landing-container {
-    padding: 1rem;
-  }
-
-  .nav-grid {
-    grid-template-columns: 1fr;
-    gap: 1rem;
-  }
-
-  .nav-card {
-    min-height: 140px;
-    padding: 1rem;
-  }
-
-  .action-grid {
-    grid-template-columns: repeat(2, 1fr);
-  }
-
-  .hero-title {
-    font-size: 1.8rem;
-  }
-
-  .hero-actions {
-    flex-direction: column;
-    align-items: center;
-  }
-
-  .btn-primary,
-  .btn-secondary {
-    width: 100%;
-    max-width: 200px;
-    justify-content: center;
-  }
-}
-
-@media (max-width: 640px) {
-  .action-grid {
-    grid-template-columns: 1fr;
-  }
-
-  .nav-card {
-    min-height: 120px;
-  }
-}
-
-/* === CUSTOM INTERACTIVE PAGES === */
-/* Only for special pages like opcode sandbox and contract wizard that need full custom layouts */
-
-.custom-page {
-  max-width: 100%;
-  padding: 0;
-}
-
-/* Full-width interactive components */
-.interactive-container {
-  max-width: 100%;
-  padding: 0;
-  margin: 0;
-}
-
-/* Custom iframe styling for embedded tools */
-.custom-iframe-container {
-  border: 2px solid #d1d5db;
-  border-radius: 0.75rem;
-  overflow: hidden;
-  margin: 2rem 0;
-  background: #ffffff;
-  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
-}
-
-[data-theme="dark"] .custom-iframe-container {
-  border-color: #374151;
-  background: #1f2937;
-}
-
-/* System theme detection for iframe container */
-@media (prefers-color-scheme: dark) {
-  .custom-iframe-container {
-    border-color: #374151;
-    background: #1f2937;
-  }
-}
-
-.custom-iframe-header {
-  padding: 0.75rem 1.25rem;
-  background: linear-gradient(90deg, var(--cosmos-primary) 0%, #6366f1 100%);
-  color: white;
-  font-size: 0.875rem;
-  font-weight: 500;
-  display: flex;
-  align-items: center;
-  gap: 0.75rem;
-  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
-}
-
-.custom-iframe {
-  width: 100%;
-  height: calc(100vh - 240px);
-  border: none;
-  display: block;
-  min-height: 600px;
-  border-radius: 0 0 0.5rem 0.5rem;
-  background: #ffffff;
-}
-
-[data-theme="dark"] .custom-iframe {
-  background: #1f2937;
-}
-
-/* System theme detection for iframe */
-@media (prefers-color-scheme: dark) {
-  .custom-iframe {
-    background: #1f2937;
-  }
-}
-
-/* Interactive sandbox styling */
-.sandbox-container {
-  padding: 0 1.5rem;
-  max-width: 100%;
-  margin: 0 auto;
-  background: #f5f5f7;
-  min-height: 100vh;
-}
-
-[data-theme="dark"] .sandbox-container {
-  background: #111827;
-}
-
-/* System theme detection for sandbox */
-@media (prefers-color-scheme: dark) {
-  .sandbox-container {
-    background: #111827;
-  }
-}
\ No newline at end of file
diff --git a/tailwind.config.js b/tailwind.config.js
index 4389bbc0..cfccc0aa 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -14,9 +14,8 @@ module.exports = {
     },
   },
   plugins: [],
-  // Work with Mintlify's styling
   important: false,
   corePlugins: {
-    preflight: false // Let Mintlify handle base styles
+    preflight: false
   }
 }
\ No newline at end of file