diff --git a/supply-chain.html b/supply-chain.html
index dcb5994f..58094613 100644
--- a/supply-chain.html
+++ b/supply-chain.html
@@ -717,15 +717,270 @@
::-webkit-scrollbar-thumb:hover {
background: var(--muted);
}
+
+ /* ================================================
+ Footer Section
+ ================================================ */
+.site-footer {
+ background: var(--bg-gradient);
+ color: #fff;
+ margin-top: auto;
+ padding: 2.5rem 1.5rem;
+ border-top-left-radius: 20px;
+ border-top-right-radius: 20px;
+}
+
+.footer-inner {
+ max-width: 1200px;
+ margin: 0 auto;
+ display: grid;
+ grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
+ gap: 1.5rem;
+ align-items: flex-start;
+}
+
+.footer-brand {
+ display: flex;
+ flex-direction: column;
+ gap: 0.5rem;
+}
+
+.footer-logo {
+ width: 48px;
+ height: 48px;
+ border-radius: 8px;
+ object-fit: cover;
+ background: #fff;
+ padding: 4px;
+}
+
+.site-footer h3,
+.site-footer h4 {
+ margin: 0 0 0.5rem 0;
+}
+
+.site-footer p {
+ margin: 0;
+ opacity: 0.9;
+}
+
+.site-footer ul {
+ list-style: none;
+ padding: 0;
+ margin: 0;
+ display: flex;
+ flex-direction: column;
+ gap: 0.4rem;
+}
+
+.site-footer a {
+ color: #fff;
+ text-decoration: none;
+ opacity: 0.9;
+ transition: opacity 0.2s;
+}
+
+.site-footer a:hover {
+ opacity: 1;
+ text-decoration: underline;
+}
+
+.footer-bottom {
+ max-width: 1200px;
+ margin: 1rem auto 0;
+ padding-top: 1rem;
+ border-top: 1px solid rgba(255, 255, 255, 0.25);
+ text-align: center;
+ font-size: 0.9rem;
+ opacity: 0.9;
+}
+
+.social-media {
+ display: flex;
+ gap: 1rem;
+ margin-top: 0.5rem;
+}
+
+.social-media a {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ width: 40px;
+ height: 40px;
+ background: rgba(255, 255, 255, 0.1);
+ border-radius: 50%;
+ transition: all 0.3s ease;
+ font-size: 1.2rem;
+}
+
+.social-media a:hover {
+ background: rgba(255, 255, 255, 0.2);
+ transform: translateY(-2px);
+}
+ /* --- UPDATED TOP NAV WITH LINKS --- */
+.top-nav {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ padding: 1rem 1.5rem;
+ background: rgba(30, 41, 59, 0.95);
+ backdrop-filter: blur(10px);
+ border: 1px solid var(--border-color);
+ border-radius: 15px;
+ margin-bottom: 2rem;
+ position: sticky;
+ top: 20px;
+ z-index: 100;
+ transition: transform 0.45s cubic-bezier(0.4, 0, 0.2, 1),
+ background 0.3s ease,
+ border-color 0.3s ease,
+ box-shadow 0.3s ease;
+}
+
+/* Hide on scroll effect */
+.nav-hidden {
+ transform: translateY(-150%);
+}
+
+.nav-left {
+ display: flex;
+ align-items: center;
+ gap: 2rem; /* bigger gap between Back to Home and links */
+}
+
+/* Back to Home pill */
+.nav-back {
+ background: var(--bg-tertiary);
+ color: var(--text-primary);
+ padding: 8px 14px;
+ border-radius: 999px;
+ text-decoration: none;
+ border: 1px solid var(--border-color);
+ font-weight: 600;
+ transition: all 0.3s ease;
+}
+.nav-back:hover {
+ background: var(--accent-primary);
+ color: #fff;
+}
+
+/* Extra nav links */
+.nav-left a:not(.nav-back) {
+ font-weight: 600;
+ color: #f1f5f9; /* light gray for readability on dark background */
+ text-decoration: none;
+ transition: color 0.3s ease;
+}
+.nav-left a:not(.nav-back):hover {
+ color: var(--accent-primary); /* AgriTech green accent */
+}
+
+
+ /* Animated Theme Toggle */
+ .theme-toggle {
+ background: var(--bg-secondary);
+ border: 1px solid var(--border-color, #d1d5db);
+ cursor: pointer;
+ padding: 0;
+ width: 32px;
+ height: 32px;
+ min-width: 32px;
+ border-radius: 50%;
+ color: var(--text-primary, #111827);
+ display: inline-flex;
+ align-items: center;
+ justify-content: center;
+ transition: background-color 0.3s ease, border-color 0.3s ease;
+ flex-shrink: 0;
+ align-self: center;
+ box-shadow: none !important;
+ }
+
+ .theme-toggle:hover {
+ background-color: var(--bg-secondary, #f3f4f6);
+ border-color: var(--primary-green, #16a34a) !important;
+ }
+
+ .theme-icon {
+ width: 22px;
+ height: 22px;
+ overflow: visible;
+ transition: transform 0.6s cubic-bezier(0.68, -0.6, 0.32, 1.6);
+ display: block;
+ }
+
+ .sun-core {
+ transform-origin: center;
+ transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
+ }
+
+ .sun-rays {
+ transform-origin: center;
+ transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.4s ease;
+ }
+
+ .moon-bite {
+ transform-origin: center;
+ transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
+ }
+
+ /* Light mode → Sun */
+ [data-theme="light"] .theme-icon {
+ transform: rotate(0deg);
+ }
+
+ [data-theme="light"] .sun-core {
+ transform: scale(1);
+ }
+
+ [data-theme="light"] .sun-rays {
+ transform: scale(1.1);
+ opacity: 1;
+ }
+
+ [data-theme="light"] .moon-bite {
+ transform: translate(20px, -20px);
+ }
+
+ /* Dark mode → Moon */
+ [data-theme="dark"] .theme-icon {
+ transform: rotate(-10deg);
+ }
+
+ [data-theme="dark"] .sun-core {
+ transform: scale(1.4);
+ }
+
+ [data-theme="dark"] .sun-rays {
+ transform: scale(0.1);
+ opacity: 0;
+ }
+
+ [data-theme="dark"] .moon-bite {
+ transform: translate(5px, -1.5px) scale(0.6);
+ }
+
-