/* Site footer (js/components/site-footer.js), on every page: logo with the social dock under it, then two columns of links. */
site-footer{display:contents}
.s-foot{background:var(--ink);color:var(--on-ink-2);padding:48px var(--gutter) 28px;display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:28px;font-size:var(--fs-15);position:relative;z-index:1}
.s-foot .logo{display:block;height:40px;width:auto}
.s-foot h2{color:var(--on-ink);font-size:var(--fs-15);margin-bottom:10px}
.s-foot ul:not(.dock){list-style:none;margin:0;padding:0;display:grid;gap:8px}
.s-foot a{text-decoration:none}
@media (hover:hover) and (pointer:fine){.s-foot ul:not(.dock) a:hover{color:var(--on-ink)}}
.s-foot .legal{grid-column:1/-1;border-top:1px solid var(--ink-line);padding-top:18px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;font-size:var(--fs-14)}
@media (max-width:760px){.s-foot{grid-template-columns:1fr 1fr;padding-inline:var(--gutter-m)}.s-foot>div:first-child{grid-column:1/-1}}
.s-foot .dock{--dock-a:36px;--dock-ic:17px;--dock-gap:10px;--dock-pad:7px;margin-top:18px;width:max-content;border-radius:var(--r-14)}   /* as wide as the logo above it; room above for an icon that grows on hover */
.s-foot li.ltr{text-align:end}
