/*
  OneRouter — Site Footer Styles
  Loaded on every page via <link> in the layout.
*/

.site-footer {
    position: relative; z-index: 10;
    border-top: 1px solid color-mix(in oklab,#e8e8e8 40%,transparent);
    background: #fdfcfd;
}
.site-footer__inner { margin-inline: auto; max-width: 72rem; padding: 4rem 1.5rem 2rem; }
.site-footer__grid { display: grid; grid-template-columns: 1fr; gap: 2.5rem; }

.site-footer__brand { display: flex; align-items: center; gap: .625rem; }
.site-footer__brand img { width: 1.75rem; height: 1.75rem; border-radius: 1rem; object-fit: contain; }
.site-footer__brand span { font-size: .875rem; font-weight: 500; letter-spacing: -.025em; color: #0a0a0a; }
.site-footer__tagline { color: color-mix(in oklab,#606060 60%,transparent); margin-top: .75rem; max-width: 240px; font-size: .75rem; line-height: 1.625; }

.site-footer__socials { display: flex; align-items: center; gap: .5rem; margin-top: 1rem; }
.site-footer__social-link {
    display: inline-flex; align-items: center; justify-content: center;
    width: 2rem; height: 2rem; border-radius: calc(1rem - 2px);
    color: color-mix(in oklab,#606060 50%,transparent);
    transition: color .15s, background .15s;
}
.site-footer__social-link:hover { color: #0a0a0a; background: #f5f5f5; }
.site-footer__social-link svg { width: 1rem; height: 1rem; }

.site-footer__nav-group { display: flex; flex-direction: column; gap: .75rem; }
.site-footer__nav-title { margin: 0; font-size: .75rem; font-weight: 500; letter-spacing: .025em; color: color-mix(in oklab,#0a0a0a 60%,transparent); text-transform: uppercase; }
.site-footer__nav-links { display: flex; flex-direction: column; gap: .5rem; list-style: none; margin: 0; padding: 0; }
.site-footer__nav-link { font-size: .8125rem; color: color-mix(in oklab,#606060 75%,transparent); text-decoration: none; transition: color .15s; white-space: nowrap; }
.site-footer__nav-link:hover { color: #0a0a0a; }

.site-footer__bottom {
    display: flex; flex-direction: column; align-items: center; justify-content: space-between;
    gap: .75rem 1.5rem; border-top: 1px solid color-mix(in oklab,#e8e8e8 30%,transparent);
    margin-top: 3rem; padding-top: 1.5rem;
}
.site-footer__copyright { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: .25rem 1rem; color: color-mix(in oklab,#606060 40%,transparent); font-size: .75rem; }
.site-footer__copyright a { color: color-mix(in oklab,#606060 40%,transparent); text-decoration: none; transition: color .15s; }
.site-footer__copyright a:hover { color: #0a0a0a; }

/* ===== DARK MODE ===== */
.dark .site-footer { background: #1e1e1e; border-color: rgba(255,255,255,.08); }
.dark .site-footer__brand span { color: #f3f3f3; }
.dark .site-footer__tagline { color: #7a7a72; }
.dark .site-footer__social-link { color: #7a7a72; }
.dark .site-footer__social-link:hover { color: #f3f3f3; background: rgba(255,255,255,.06); }
.dark .site-footer__nav-title { color: #7a7a72; }
.dark .site-footer__nav-link { color: #9b9b94; }
.dark .site-footer__nav-link:hover { color: #f3f3f3; }
.dark .site-footer__bottom { border-color: rgba(255,255,255,.08); }
.dark .site-footer__copyright { color: #7a7a72; }
.dark .site-footer__copyright a { color: #7a7a72; }
.dark .site-footer__copyright a:hover { color: #f3f3f3; }

@media (min-width: 640px) {
    .site-footer__grid { grid-template-columns: 1fr 1fr; gap: 3rem; }
    .site-footer__bottom { flex-direction: row; }
    .site-footer__copyright { justify-content: flex-start; }
}
@media (min-width: 768px) {
    .site-footer__inner { padding: 5rem 1.5rem 2.5rem; }
    .site-footer__grid { grid-template-columns: 1.6fr 1fr 1fr 1fr; gap: 2rem; }
}