/* Footer */
.site-footer{padding-bottom:calc(env(safe-area-inset-bottom,0px) + 24px)}
.site-footer__top{display:grid;grid-template-columns:1fr auto;gap:2rem;align-items:end;padding-top:2rem}
.site-footer__mail{font-size:clamp(1.4rem,3.4vw,3rem);font-weight:400;letter-spacing:-.03em}
/* Logo and the three offices share one row, offices immediately to the right of the logo.
   The logo is set to the width of the word "PROBLEM" in the heading above: in Anton that word
   measures 3.435x the display font size, and --fs-display drives both, so they stay matched at
   every viewport. The row never wraps - on narrow screens the logo shrinks so the addresses
   always fit beside it. */
.site-footer__mid{display:flex;flex-wrap:nowrap;align-items:flex-end;justify-content:flex-start;gap:clamp(.9rem,2.5vw,2.5rem);margin-top:clamp(3rem,8vw,6rem)}
.site-footer__logo{flex:0 1 calc(var(--fs-display) * 3.435);min-width:0;height:auto}
.site-footer__logo img{width:100%;height:auto}
.site-footer__offices{flex:0 0 auto;font:inherit;font-style:normal;font-weight:400;display:flex;flex-direction:column;gap:.5rem;font-size:clamp(.62rem,2.6vw,1.05rem);line-height:1.25;text-align:left}
.site-footer__offices div,.site-footer__offices p{font:inherit;font-style:normal;white-space:nowrap}
.site-footer__social{display:flex;gap:8px;margin-top:1.5rem}
.site-footer__bottom{display:flex;flex-wrap:wrap;justify-content:space-between;gap:1rem;margin-top:2rem;font-size:.85rem;font-weight:400;border-top:1px solid var(--line);padding-top:1.2rem}
.site-footer__bottom nav{display:flex;gap:1.5rem;flex-wrap:wrap}
@media (max-width:980px){.site-footer__top{grid-template-columns:1fr}}