diff --git a/sustainable-farming.html b/sustainable-farming.html index 1d9916e2..f1641a6e 100644 --- a/sustainable-farming.html +++ b/sustainable-farming.html @@ -145,48 +145,64 @@ } /* --- UPDATED TOP NAV WITH HIDE ON SCROLL --- */ - .top-nav { - display: flex; - justify-content: space-between; - align-items: center; - padding: 1rem; - 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; - /* Premium transition timing */ - 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; - } + /* --- 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; +} - /* Class to trigger the hide effect */ - .nav-hidden { - transform: translateY(-150%); - } +/* Hide on scroll effect */ +.nav-hidden { + transform: translateY(-150%); +} - .nav-left { - display: flex; - align-items: center; - gap: 1rem; - } +.nav-left { + display: flex; + align-items: center; + gap: 2rem; /* bigger gap between Back to Home and links */ +} - .nav-back { - background: var(--bg-tertiary); - color: var(--text-primary); - padding: 10px 15px; - border-radius: 10px; - text-decoration: none; - border: 1px solid var(--border-color); - transition: all 0.3s ease; - } +/* 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 */ +} - .nav-back:hover { - background: var(--accent-primary); - color: white; - } /* Animated Theme Toggle */ .theme-toggle { @@ -960,6 +976,9 @@ ::-webkit-scrollbar-thumb:hover { background: var(--text-muted); } + + + @@ -974,6 +993,10 @@ Back to Home + Home + Components + Pricing + Contact
diff --git a/terms-and-service.css b/terms-and-service.css index 74b53eb1..9ebd7dd7 100644 --- a/terms-and-service.css +++ b/terms-and-service.css @@ -94,11 +94,9 @@ body { /* Back to Home button */ .back-bar-inner { max-width: 1200px; - margin: 0 auto 1rem auto; + margin: 0 auto 0.5rem auto; /* reduced bottom margin */ display: flex; justify-content: flex-start; - position: relative; - z-index: 10; } /* base styling stays the same */ @@ -188,12 +186,12 @@ body { /* Page Header */ .page-header { - background: linear-gradient(135deg, var(--primary-green), var(--secondary-green)); - color: white; - padding: 3rem 0; + background: linear-gradient(135deg, #22c55e, #16a34a); + padding: 6px 10px; /* reduced from 60px+ */ + border-radius: 8px; + color: #fff; text-align: center; - position: relative; - overflow: hidden; + box-shadow: 0 4px 12px rgba(0,0,0,.12); } .page-header::before { @@ -207,12 +205,9 @@ body { opacity: 0.3; } -.header-content { - max-width: 800px; - margin: 0 auto; - padding: 0 2rem; - position: relative; - z-index: 1; +.header-content h1 { + font-size: clamp(22px, 5vw, 32px); /* smaller heading */ + margin-bottom: 8px; } .page-header h1 { @@ -222,20 +217,14 @@ body { } .subtitle { - font-size: 1.125rem; - margin-bottom: 1.5rem; - opacity: 0.9; + font-size: 16px; + margin-bottom: 4px; + color: rgba(255,255,255,.85); } .last-updated { - display: inline-flex; - align-items: center; - gap: 0.5rem; - background: rgba(255, 255, 255, 0.2); - padding: 0.5rem 1rem; - border-radius: 20px; - font-size: 0.875rem; - backdrop-filter: blur(10px); + font-size: 13px; + color: rgba(255,255,255,.7); } /* Main Content Layout */ @@ -809,10 +798,13 @@ body { ================================ */ .navbar { - width: 100%; + background-color: var(--bg-primary); + border-bottom: 1px solid var(--border-color); + padding: 0.6rem 0; /* reduced from 1rem */ position: sticky; top: 0; - z-index: 999; + z-index: 100; + backdrop-filter: blur(12px); } .navbar-content { @@ -973,3 +965,7 @@ body { font-size: 1.4rem; letter-spacing: 0.5px; } + +.brand .logo { + font-size: 1.3rem; /* instead of 1.5rem */ +}