/* The one footer stylesheet (2026-10-18, dad "푸터도 왜 페이지 마다 다르지?" / "글자는 가독성이 중요한데").
   Footer markup was single-source (tools/sync_nav_footer.py) but each page carried its own footer CSS, so sizes
   differed by page (disclosure 8.8px on the magazine, 11.2px elsewhere; build line 8.8px at contrast 2.5).
   Linked last in every page's <head> by sync_nav_footer.py. Readability floor: nothing under 12px, Korean >= 13px,
   WCAG AA contrast on the charcoal background. Guarded by health_checker/test_readable_text.py. */
footer.footer {
    --charcoal: #2C2C2C; --warm-gold: #C9A27E;
    --font-serif: 'Cormorant Garamond', Georgia, serif;
    --font-sans: 'Inter', 'Noto Sans KR', -apple-system, sans-serif;
    display: block; box-sizing: border-box; width: auto; margin: 0; padding: 3rem;
    background: var(--charcoal); color: rgba(255,255,255,0.78);
    font-family: var(--font-sans); line-height: 1.6;
    /* a shared component sets its own text properties instead of inheriting the page's (2026-10-18: page letter-spacing
       and font-feature settings made the same footer text 248px wide on Home and 255px on the legal pages) */
    letter-spacing: normal; word-spacing: normal; font-weight: 400; font-style: normal; font-feature-settings: normal;
    font-variant: normal; font-kerning: auto; font-synthesis: weight style; text-transform: none; text-align: left; text-rendering: auto;
    -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
}
footer.footer * { box-sizing: border-box; }
footer.footer p { margin: 0; }
footer.footer .footer-inner { max-width: 1100px; margin: 0 auto; padding: 0; }
footer.footer .footer-top {
    display: flex; justify-content: space-between; align-items: flex-start; gap: 2rem;
    padding: 0 0 2rem; margin: 0 0 2rem; border-bottom: 1px solid rgba(255,255,255,0.12);
}
footer.footer .footer-logo {
    font-family: var(--font-serif); font-size: 1.35rem; font-weight: 400; letter-spacing: 0.15em;
    text-transform: uppercase; color: rgba(255,255,255,0.85); margin: 0 0 0.5rem;
}
footer.footer .footer-tagline { font-size: 0.9rem; font-weight: 400; color: rgba(255,255,255,0.78); }
footer.footer .footer-nav { display: flex; gap: 3rem; margin: 0; padding: 0; }
footer.footer .footer-nav-heading {
    font-size: 0.8125rem; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase;
    color: rgba(255,255,255,0.85); margin: 0 0 0.75rem;
}
footer.footer .footer-nav-col a {
    display: block; margin: 0 0 0.5rem; padding: 0; font-size: 0.9rem; font-weight: 400;
    color: rgba(255,255,255,0.78); text-decoration: none; letter-spacing: normal; text-transform: none; transition: color 0.3s;
}
footer.footer .footer-nav-col a:hover { color: var(--warm-gold); }
footer.footer .footer-bottom { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem 2rem; flex-wrap: wrap; }
footer.footer .footer-copy, footer.footer .footer-universe { font-size: 0.85rem; color: rgba(255,255,255,0.78); }
footer.footer .footer-universe { font-style: italic; }
footer.footer .footer-disclosure { flex: 1 1 100%; order: 3; font-size: 0.85rem; line-height: 1.6; color: rgba(255,255,255,0.78); }
footer.footer .footer-build { flex: 1 1 100%; order: 4; font-size: 0.8125rem; letter-spacing: 0.03em; color: rgba(255,255,255,0.6); }
footer.footer .footer-bottom a { color: inherit; }
@media (max-width: 768px) {
    footer.footer { padding: 2rem 1.5rem; }
    footer.footer .footer-top { flex-direction: column; gap: 2rem; }
    footer.footer .footer-nav { flex-wrap: wrap; gap: 1.5rem 2rem; }
    footer.footer .footer-nav-col a { display: flex; align-items: center; min-height: 44px; margin: 0; }
    footer.footer .footer-bottom { flex-direction: column; align-items: center; text-align: center; gap: 0.75rem; }
}
/* Both languages are in the shared footer; the <head> boot script's html[data-lang] picks one before first paint,
   so every page (with or without a translation script) shows the same words, without a flash (2026-10-18). */
footer.footer .nl-kr { display: none; }
html[data-lang="kr"] footer.footer .nl-kr { display: inline; }
html[data-lang="kr"] footer.footer .nl-en { display: none; }
