/* Reusable Footer Styles */
@import url('main.css');

.footer {
    background-color: var(--primary-bg);
    border-top: 2px solid var(--border-color);
    padding: 3rem 2rem 2rem;
    margin-top: 4rem;
}
.footer-container {max-width: 1200px;margin:0 auto;}
.footer-content {text-align:center;margin-bottom:2rem;}
.footer-logo {display:flex;align-items:center;justify-content:center;gap:1rem;margin-bottom:1rem;}
.footer-logo .logo-placeholder {width:40px;height:40px;}
.footer-brand {font-size:1.5rem;font-weight:bold;letter-spacing:2px;}
.footer-text {color:var(--text-secondary);font-size:1rem;}
.footer-links {display:flex;justify-content:center;gap:1.5rem;flex-wrap:wrap;margin-bottom:1.5rem;}
.footer-links a {color:var(--text-secondary);text-decoration:none;font-size:0.9rem;transition:color var(--transition-speed) ease;}
.footer-links a:hover {color:var(--accent-color);}
.footer-bottom {text-align:center;padding-top:1rem;border-top:1px solid var(--border-color);}
.footer-bottom p {color:var(--text-secondary);font-size:0.8rem;letter-spacing:1px;}

@media (max-width:480px){
  .footer {padding:2.5rem 1.2rem 1.5rem;}
  .footer-links {gap:1rem;}
  .footer-logo .logo-placeholder {width:32px;height:32px;}
  .footer-brand {font-size:1.3rem;}
}