.footer { background: var(--color-bg); border-top: 1px solid var(--color-border); padding-top: 4rem; }
.footer-grid { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr 1fr; gap: 3rem; padding-bottom: 3rem; }
.footer-brand { max-width: 400px; }
.footer-logo { font-size: 1.5rem; font-weight: 800; background: var(--gradient-text); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; margin-bottom: 1.5rem; display: inline-block; }
.footer-description { color: var(--color-text-muted); margin-bottom: 1.5rem; line-height: 1.6; }
.footer-social { display: flex; gap: 1rem; }
.footer-social a { width: 40px; height: 40px; background: var(--color-bg-alt); border: 1px solid var(--color-border); border-radius: var(--radius-sm); display: flex; align-items: center; justify-content: center; color: var(--color-text-muted); font-weight: bold; transition: var(--transition); }
.footer-social a:hover { background: var(--color-primary); border-color: var(--color-primary); color: white; }
.footer-column h3 { color: white; font-size: 1rem; font-weight: 600; margin-bottom: 1.25rem; }
.footer-column ul { display: flex; flex-direction: column; gap: 0.75rem; }
.footer-column a { color: var(--color-text-muted); font-size: 0.875rem; transition: var(--transition); }
.footer-column a:hover { color: var(--color-primary); }
.footer-newsletter { padding: 2rem 0; border-top: 1px solid var(--color-border); border-bottom: 1px solid var(--color-border); display: flex; justify-content: space-between; align-items: center; gap: 2rem; flex-wrap: wrap; }
.footer-newsletter h3 { color: white; font-size: 1.125rem; margin-bottom: 0.5rem; }
.footer-newsletter p { color: var(--color-text-muted); font-size: 0.875rem; }
.newsletter-form { display: flex; gap: 0.75rem; flex: 1; max-width: 400px; }
.newsletter-form input { flex: 1; padding: 0.5rem 1rem; background: var(--color-bg-alt); border: 1px solid var(--color-border); border-radius: var(--radius-sm); color: white; }
.newsletter-form input:focus { outline: none; border-color: var(--color-primary); }
.footer-bottom { padding: 1.5rem 0; display: flex; justify-content: space-between; align-items: center; color: var(--color-text-dim); font-size: 0.875rem; flex-wrap: wrap; gap: 1rem; }
.footer-status { display: flex; align-items: center; gap: 0.5rem; }
.status-dot { width: 8px; height: 8px; background: var(--color-success); border-radius: 50%; animation: pulse 2s infinite; }