.site-footer {
    --ink: var(--on-panel);
    --halo: var(--panel);
    padding-block-start: clamp(48px, 7vw, 80px);
    color: var(--muted-on-panel);
    background: var(--panel);
}
html[data-theme="dark"] .site-footer { background: #050918; --halo: #050918; }

.footer-grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr; gap: clamp(28px, 5vw, 64px); padding-block-end: clamp(36px, 5vw, 56px); }
.footer-about p { max-width: 36ch; margin: 16px 0 20px; }

.footer-col { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }
.footer-col h3 { margin: 0 0 6px; font-family: var(--font-body); font-size: .95rem; font-weight: 650; letter-spacing: 0; color: #fff; }
body.rtl .footer-col h3 { font-family: "Cairo", sans-serif; }
.footer-col a { color: var(--muted-on-panel); transition: color .18s var(--ease); overflow-wrap: anywhere; }
.footer-col a:hover { color: #fff; }

.social-row { display: flex; gap: 8px; }
.social-row a {
    display: grid; place-items: center; width: 40px; height: 40px;
    color: var(--on-panel); border: 1px solid rgba(255, 255, 255, .16); border-radius: 10px;
    transition: background-color .18s var(--ease), border-color .18s var(--ease);
}
.social-row a:hover { background: rgba(255, 255, 255, .08); border-color: rgba(255, 255, 255, .4); }
.social-row svg { width: 18px; height: 18px; }

.footer-bottom {
    display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px;
    padding-block: 22px; font-size: .88rem;
    border-block-start: 1px solid rgba(255, 255, 255, .1);
}
.footer-bottom a:hover { color: #fff; }

@media (max-width: 760px) { .footer-grid { grid-template-columns: 1fr 1fr; } .footer-about { grid-column: 1 / -1; } }
@media (max-width: 420px) { .footer-grid { grid-template-columns: 1fr; } }