:root { --quokka-surface-soft: var(--q-surface, #fff); --quokka-line: var(--q-border, #d8dee5); --quokka-text: var(--q-ink, #172334); --quokka-muted: var(--q-muted, #526174); --quokka-accent: var(--q-action, #0b625f); }
.quokka-footer, .quokka-footer * { box-sizing: border-box; }
.quokka-footer { position: relative; z-index: 2; width: 100%; margin-top: 3rem; border-top: 1px solid var(--quokka-line); background: var(--quokka-surface-soft); color: var(--quokka-text); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
.quokka-footer__inner { width: min(1180px, 100%); margin: 0 auto; padding: 2.5rem 1.25rem 1.5rem; }
.quokka-footer__brand { max-width: 34rem; margin-bottom: 2rem; }
.quokka-footer__brand > a { color: #fff; font-size: 1.15rem; font-weight: 800; text-decoration: none; }
.quokka-footer__brand > a span { color: var(--quokka-accent); }
.quokka-footer__brand p, .quokka-footer__meta p { margin: .65rem 0 0; color: var(--quokka-muted); font-size: .82rem; line-height: 1.6; }
.quokka-footer__links { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.5rem; }
.quokka-footer__group h2 { margin: 0 0 .7rem; color: #f8fafc; font-size: .82rem; font-weight: 700; }
.quokka-footer__group ul { display: grid; gap: .25rem; margin: 0; padding: 0; list-style: none; }
.quokka-footer__group li { margin: 0; padding: 0; list-style: none; }
.quokka-footer__group a, .quokka-footer__meta a { display: inline-flex; min-height: 2rem; align-items: center; color: var(--quokka-muted); font-size: .78rem; line-height: 1.4; text-decoration: none; }
.quokka-footer__group a:hover, .quokka-footer__group a:focus-visible, .quokka-footer__meta a:hover, .quokka-footer__meta a:focus-visible { color: #fff; text-decoration: underline; text-underline-offset: .2rem; }
.quokka-footer__meta { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem 1.25rem; margin-top: 2rem; padding-top: 1.25rem; border-top: 1px solid var(--quokka-line); }
.quokka-footer__meta p { margin: 0; }
.quokka-footer__meta a { margin-left: auto; }
.quokka-ad { box-sizing: border-box; color: var(--quokka-muted); text-align: center; }
.quokka-ad__label { display: block; margin-bottom: .25rem; font: 500 .62rem/1.2 ui-sans-serif, system-ui, sans-serif; letter-spacing: .08em; text-transform: uppercase; }
.quokka-ad--bottom { width: min(970px, calc(100% - 2rem)); min-height: 1px; margin: 2rem auto 0; }
.quokka-side-ads { display: none; }
.quokka-ad[data-ad-state="unfilled"], .quokka-ad[data-ad-state="error"], .quokka-ad[data-ad-state="disabled"] { display: none !important; }
@media (min-width: 1280px) { body[data-quokka-page-type="tool"] { box-sizing: border-box; padding-inline: 148px; } .quokka-side-ads { display: block; } .quokka-ad--side-left, .quokka-ad--side-right { position: fixed; z-index: 1; top: 96px; width: 120px; max-height: calc(100vh - 120px); } .quokka-ad--side-left { left: 14px; } .quokka-ad--side-right { right: 14px; } .quokka-ad--side-left .adsbygoogle, .quokka-ad--side-right .adsbygoogle { min-height: 250px; } }
@media (max-width: 760px) { .quokka-footer__inner { padding: 2rem 1rem 1.25rem; } .quokka-footer__links { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.4rem 1rem; } .quokka-footer__meta { align-items: flex-start; flex-direction: column; } .quokka-footer__meta a { margin-left: 0; } }
@media (max-width: 380px) { .quokka-footer__links { grid-template-columns: 1fr; } }