/* footer.css — Footer. */

.footer{ max-width: 1800px; margin: auto; padding: 23px var(--gutter); display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.footer > .wordmark{ font-size: 21px; }
.footer > span{ font-size: 8px; color: var(--muted); }
.footer > div{ display: flex; gap: 10px; }
.footer > div > a{ height: 44px; width: 44px; display: flex; justify-content: center; align-items: center; }
.footer > div > a:hover{ color: var(--red); }

@media (max-width: 800px){
.footer > span{ font-size: 7px; }
.footer > div{ gap: 2px; }
.footer > div > a{ width: 38px; }
}

@media (max-width: 600px){
.footer{ padding: 17px 20px calc(17px + env(safe-area-inset-bottom,0px)); flex-wrap: wrap; gap: 3px 15px; }
.footer > .wordmark{ font-size: 21px; }
.footer > div{ margin-left: auto; }
.footer > span{ order: 3; flex-basis: 100%; font-size: 7px; line-height: 1.8; color: rgb(159, 151, 153); }
.footer > div > a{ width: 36px; height: 44px; }
.footer > div > a{ width: 44px; }
}

.footer > span{ font-size: 9px; }

@media (max-width: 600px){
.footer > span{ font-size: 8px; }
}

.footer{flex-wrap:wrap;row-gap:14px}
.footer>span{order:3;flex:0 0 100%;text-align:left}
