/* ═══════════════════════════════════════════════════════════════ HVM REALTORS — FOOTER STYLES assets/css/footer.css Link in : ═══════════════════════════════════════════════════════════════ */ /* ─── FOOTER BASE ────────────────────────────────────────────── */ .site-footer { background: var(--clr-navy-dk, #111d3e); border-top: none; padding: 3rem 0 2rem; color: rgba(255,255,255,0.8); } .site-footer .container { width: 100%; max-width: 1200px; margin: 0 auto; padding: 0 clamp(1rem, 4vw, 3rem); } /* ─── FOOTER INNER GRID ──────────────────────────────────────── */ .footer-inner { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 2rem; margin-bottom: 2rem; } /* ─── FOOTER BRAND / LOGO COLUMN ────────────────────────────── */ .footer-brand { display: flex; flex-direction: column; gap: 0.6rem; max-width: 280px; } /* Logo image — no blue shadow, clean white card */ .footer-logo { margin-bottom: 0.4rem; } .footer-logo img { width: 140px; height: auto; display: block; background: #ffffff; padding: 10px 14px; border-radius: 8px; /* Clean dark shadow only — NO blue/navy shadow */ box-shadow: 0 4px 14px rgba(0, 0, 0, 0.30); transition: transform 0.3s ease, box-shadow 0.3s ease; } .footer-logo img:hover { transform: translateY(-2px); box-shadow: 0 6px 20px rgba(0, 0, 0, 0.40); } /* Tagline under logo */ .footer-brand .logo-sub { font-family: var(--ff-body, 'DM Sans', sans-serif); font-size: 0.68rem; letter-spacing: 0.18em; text-transform: uppercase; color: rgba(255,255,255,0.50); line-height: 1.6; margin: 0; } /* Hide old text logo if present */ .footer-brand .logo-main { display: none !important; } /* Description text */ .footer-desc { font-size: 0.82rem; color: rgba(255,255,255,0.55); line-height: 1.75; max-width: 280px; margin: 0; } /* ─── FOOTER LINK COLUMNS ────────────────────────────────────── */ .footer-links-title { font-family: var(--ff-heading, 'Cinzel', serif); font-size: 0.7rem; letter-spacing: 0.15em; text-transform: uppercase; color: var(--clr-red-lt, #d93a4c); margin-bottom: 1rem; } .footer-links { list-style: none; padding: 0; margin: 0; } .footer-links li { margin-bottom: 0.5rem; } .footer-links a { font-size: 0.85rem; color: rgba(255,255,255,0.60); text-decoration: none; transition: color 0.3s ease; } .footer-links a:hover { color: #ffffff; } /* ─── FOOTER BOTTOM BAR ──────────────────────────────────────── */ .footer-bottom { border-top: 1px solid rgba(255,255,255,0.10); padding-top: 1.5rem; } .footer-disclaimer { font-size: 0.72rem; color: rgba(255,255,255,0.40); line-height: 1.8; max-width: 900px; } .footer-disclaimer strong { color: rgba(255,255,255,0.70); } .footer-copyright { color: rgba(255,255,255,0.35); font-size: 0.72rem; margin-top: 1rem; } /* ─── RESPONSIVE ─────────────────────────────────────────────── */ @media (max-width: 1024px) { .footer-inner { gap: 2rem; } } @media (max-width: 768px) { .footer-inner { flex-direction: column; gap: 2rem; } .footer-brand { max-width: 100%; } .footer-logo img { width: 120px; padding: 8px 12px; } .footer-desc { max-width: 100%; } } @media (max-width: 480px) { .footer-logo img { width: 110px; } .site-footer { padding: 2.5rem 0 1.5rem; } }