/* Shared footer styles for every page tree under /pages/ (tools, features). */
.tools-footer {
    background: #1E1E2F; color: #B8B8C8;
    padding: 56px 0 32px; margin-top: 40px;
}
.tools-footer a { color: #B8B8C8; text-decoration: none; }
.tools-footer a:hover { color: #fff; }
.footer-grid { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 40px; margin-bottom: 32px; }
.footer-grid h4 { color: #fff; font-size: 0.95rem; margin-bottom: 14px; font-family: 'Rubik', sans-serif; }
.footer-grid ul { list-style: none; display: flex; flex-direction: column; gap: 8px; font-size: 0.93rem; }
.footer-bottom { border-top: 1px solid rgba(255,255,255,0.08); padding-top: 24px; font-size: 0.85rem; color: #7A7A8A; text-align: center; }

.tools-footer .brand { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; }
.tools-footer .brand-icon {
    width: 36px; height: 36px;
    background: linear-gradient(135deg, #FF6B35, #FFA044);
    border-radius: 10px;
    display: flex; align-items: center; justify-content: center;
    color: #fff; font-weight: 800; font-size: 18px;
    font-family: 'Playfair Display', 'Rubik', serif;
}
.tools-footer .brand-name { font-weight: 700; font-size: 18px; font-family: 'Rubik', sans-serif; }

@media (max-width: 768px) {
    .footer-grid { grid-template-columns: 1fr; gap: 28px; }
}