@layer components{.footer{margin-block-start:var(--space-2xl);padding-block:var(--space-xl)var(--space-m);background:var(--color-surface-alt);border-top:1px solid var(--color-border);& .footer__inner{display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--space-l)}& .footer__about{--stack-space:var(--space-2xs);max-width:34ch}& .footer__name{font-weight:600;font-size:var(--size-step-1)}& .footer__legal{font-size:var(--size-step--1)}& .footer__links{--stack-space:var(--space-2xs);margin:0;padding:0;list-style:none;& a{color:var(--color-text);text-decoration:none;&:hover{color:var(--color-accent-strong);text-decoration:underline}}}& .footer__bottom{display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--space-2xs)var(--space-m);margin-block-start:var(--space-l);padding-block-start:var(--space-s);border-top:1px solid var(--color-border);color:var(--color-text-muted);font-size:var(--size-step--1)}& .footer__legal-links{display:flex;flex-wrap:wrap;gap:var(--space-m);margin:0;padding:0;list-style:none;& a{color:inherit;&:hover{color:var(--color-accent-strong)}}}}}