From 4335f53d502aa6366a24d2cd319cbd2026e80aa3 Mon Sep 17 00:00:00 2001 From: Vaishnavi Khatri Date: Wed, 27 May 2026 10:18:33 +0530 Subject: [PATCH] enhance: improve footer layout and compact spacing --- public/css/home.css | 151 ++++++++++++++++++++++++++++++++++++-------- public/home.html | 110 +++++++++++++++++++++----------- 2 files changed, 199 insertions(+), 62 deletions(-) diff --git a/public/css/home.css b/public/css/home.css index 66dc348..ca437b4 100644 --- a/public/css/home.css +++ b/public/css/home.css @@ -1415,60 +1415,161 @@ } /* ─── Footer ─── */ +.footer-brand-section { + display: flex; + align-items: center; + justify-content: space-between; +} + +.footer-description { + margin-top: 0; +} .site-footer { - border-top: 1px solid var(--border); - padding: 48px 24px 32px; position: relative; - z-index: 1; + overflow: hidden; + margin-top: 120px; + padding: 80px 20px 30px; + background: linear-gradient( + to bottom, + rgba(15,15,20,0.95), + rgba(5,5,10,1) + ); + border-top: 1px solid rgba(255,255,255,0.08); +} + +.footer-glow { + position: absolute; + top: -100px; + left: 50%; + transform: translateX(-50%); + width: 500px; + height: 300px; + background: radial-gradient(circle, rgba(99,102,241,0.25), transparent 70%); + filter: blur(80px); + z-index: 0; } .footer-inner { + position: relative; + z-index: 2; max-width: 1200px; - margin: 0 auto; + margin: auto; } .footer-brand-section { - margin-bottom: 32px; + margin-bottom: 50px; } -.footer-brand-section p { - color: var(--text-muted); - font-size: 0.85rem; - margin-top: 10px; +.brand-text { + display: flex; + flex-direction: column; + justify-content: center; } -.footer-links-grid { +.brand-powered { + font-size: 0.6rem; + color: var(--text-secondary); + text-transform: uppercase; + letter-spacing: 1px; + opacity: 0.8; +} + +.footer-description { + margin-top: 18px; + max-width: 420px; + color: var(--text-secondary); + line-height: 1.7; +} + +.footer-socials { display: flex; - gap: 60px; - margin-bottom: 32px; + gap: 16px; + margin-top: 24px; +} + +.footer-socials a { + width: 42px; + height: 42px; + border-radius: 12px; + display: flex; + align-items: center; + justify-content: center; + background: rgba(255,255,255,0.05); + border: 1px solid rgba(255,255,255,0.08); + color: white; + transition: all 0.3s ease; + text-decoration: none; +} + +.footer-socials a:hover { + transform: translateY(-4px); + background: rgba(99,102,241,0.2); + border-color: rgba(99,102,241,0.4); +} + +.footer-links-grid { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); + gap: 40px; + margin-bottom: 50px; } .footer-links-grid h4 { - font-family: var(--font-heading); - font-weight: 600; - font-size: 0.85rem; - margin-bottom: 12px; - color: var(--text-secondary); + margin-bottom: 18px; + font-size: 1rem; + color: white; } .footer-links-grid a { display: block; - color: var(--text-muted); - font-size: 0.85rem; - padding: 4px 0; - transition: color var(--duration-fast) var(--ease-out); + margin-bottom: 12px; + color: var(--text-secondary); text-decoration: none; + transition: 0.3s ease; } .footer-links-grid a:hover { - color: var(--text-primary); + color: white; + transform: translateX(4px); } .footer-bottom { padding-top: 24px; - border-top: 1px solid var(--border); - font-size: 0.78rem; - color: var(--text-muted); + border-top: 1px solid rgba(255,255,255,0.08); + display: flex; + justify-content: space-between; + flex-wrap: wrap; + gap: 16px; + color: var(--text-secondary); + font-size: 0.95rem; +} + +.footer-bottom-links { + display: flex; + gap: 18px; +} + +.footer-bottom-links a { + color: var(--text-secondary); + text-decoration: none; + transition: 0.3s; +} + +.footer-bottom-links a:hover { + color: white; +} + +/* Responsive */ + +@media (max-width: 768px) { + .footer-bottom { + flex-direction: column; + align-items: flex-start; + } + + .footer-links-grid { + grid-template-columns: 1fr 1fr; + } } /* ─── Scroll Animations ─── */ diff --git a/public/home.html b/public/home.html index de7bdd5..0d7eccd 100644 --- a/public/home.html +++ b/public/home.html @@ -2,6 +2,8 @@ + @@ -1106,48 +1108,82 @@

-