.savvy-footer {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    color: #596174;
    background: #faf9fb;
    font-size: 14px;
    line-height: 1.65;
}

.savvy-footer::before {
    content: "";
    position: absolute;
    z-index: -1;
    inset: 0;
    background: radial-gradient(ellipse at 20% 85%, #e8e4f280, transparent 58%), radial-gradient(ellipse at 90% 100%, #eeebf7, transparent 55%);
    pointer-events: none;
}

.savvy-footer *, .savvy-footer *::before, .savvy-footer *::after { box-sizing: border-box; }
.savvy-footer a { color: inherit; text-decoration: none; transition: color .15s; }
.savvy-footer a:hover { color: #4f46e5; }
.savvy-footer a:focus-visible { outline: 2px solid #6366f1; outline-offset: 5px; border-radius: 3px; }
.savvy-footer__inner { padding: 64px 48px 0; }
.savvy-footer__columns { display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.15fr); gap: 40px; }
.savvy-footer__brand { min-width: 0; }
.savvy-footer__logo { display: block; width: 270px; height: auto; max-width: 100%; }
.savvy-footer__navigation { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 44px 32px; align-content: start; padding-top: 52px; grid-template-areas: "workforce products products" "resources compare contact"; }
.savvy-footer__heading { margin: 0 0 22px; color: #1e1b4b; font-size: 15px; font-weight: 650; line-height: 1.6; }
.savvy-footer__links { margin: 0; padding: 0; list-style: none; display: grid; gap: 14px; }
.savvy-footer__group--ai-workforce { grid-area: workforce; }
.savvy-footer__group--products { grid-area: products; }
.savvy-footer__group--products .savvy-footer__links { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 32px; }
.savvy-footer__group--resources { grid-area: resources; }
.savvy-footer__group--compare { grid-area: compare; }
.savvy-footer__contact { grid-area: contact; min-width: 0; overflow-wrap: anywhere; }
.savvy-footer__contact .savvy-footer__heading { margin-bottom: 16px; }
.savvy-footer__socials { display: flex; gap: 20px; margin-top: 24px; color: #827e8d; }
.savvy-footer__socials a { display: inline-flex; padding: 4px 0; }
.savvy-footer__social-icon { width: 18px; height: 18px; }
/* A square stage gives the mascot room; the renderer fits the image at its original aspect ratio. */
.savvy-footer__bird { position: relative; width: calc(100% + 96px); max-width: 680px; aspect-ratio: 1; margin: 12px -48px -60px; pointer-events: none; mix-blend-mode: multiply; }
.savvy-footer__canvas { position: absolute; inset: 0; width: 100%; height: 100%; }
.savvy-footer__bird-image { position: absolute; width: 100%; height: 100%; left: 0; top: 0; object-fit: contain; }
.savvy-footer [hidden] { display: none; }
.savvy-footer__bottom { position: relative; padding: 24px 0 28px; border-top: 1px solid #e2e0e6; color: #777281; font-size: 12px; }
.savvy-footer__bottom-content { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.savvy-footer__bottom p { margin: 0; }
.savvy-footer__legal { display: flex; align-items: center; flex-wrap: wrap; gap: 24px; }

@media (max-width: 1150px) {
    .savvy-footer__inner { padding: 48px 32px 0; }
    .savvy-footer__columns { gap: 32px; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); padding-bottom: 32px; }
    .savvy-footer__navigation { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-areas: "workforce resources" "products products" "compare contact"; gap: 32px 24px; padding-top: 32px; }
    .savvy-footer__links { font-size: 13px; }
    .savvy-footer__bird { width: calc(100% + 64px); margin: 28px -32px -32px; }
    .savvy-footer__bottom-content { align-items: flex-start; flex-direction: column; gap: 12px; }
}

@media (max-width: 700px) {
    .savvy-footer__inner { padding: 36px 24px 0; }
    .savvy-footer__columns { grid-template-columns: 1fr; gap: 16px; }
    .savvy-footer__logo { width: 225px; }
    .savvy-footer__bird { width: calc(100% + 48px); max-width: 520px; margin: 8px -24px -30px; }
    .savvy-footer__navigation { gap: 32px 24px; padding-top: 0; }
    .savvy-footer__heading { margin-bottom: 18px; }
    .savvy-footer__legal { gap: 18px; font-size: 11px; }
}

@media (prefers-reduced-motion: reduce) {
    .savvy-footer a { transition: none; }
}
