/* footer — стили вариантов подвала (общее — в site/site.css). Классы .f-…; цвета — --s-* подвала. */

/* columns */
.f-columns .f-grid { display: grid; grid-template-columns: 1.4fr 1.2fr 1fr 1fr; gap: 40px; }
.f-columns .f-col { min-width: 0; font-size: 14px; }
.f-columns .f-name { font-family: var(--font-head); font-size: 20px; font-weight: 700; text-decoration: none; display: inline-block; margin-bottom: 10px; }
.f-columns .f-about p { color: var(--s-muted); line-height: 1.6; max-width: 340px; }
.f-columns h4 { font-size: 12px; letter-spacing: .12em; text-transform: uppercase; margin-bottom: 14px; opacity: .75; font-family: var(--font-body); }
.f-columns ul { list-style: none; }
.f-columns li { margin-bottom: 9px; overflow-wrap: anywhere; }
.f-columns li a { text-decoration: none; }
.f-columns li a:hover { text-decoration: underline; }
.f-columns .f-copy { margin-top: 36px; padding-top: 20px; border-top: 1px solid var(--s-line); font-size: 12.5px; opacity: .85; }

/* minimal */
.f-minimal .wrap { text-align: center; }
.f-minimal .f-line { margin-bottom: 8px; }
.f-minimal .f-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 22px; }
.f-minimal .f-links a { text-decoration: none; opacity: .85; }
.f-minimal .f-links a:hover { text-decoration: underline; opacity: 1; }

@media (max-width: 900px) {
  .f-columns .f-grid { grid-template-columns: 1fr 1fr; gap: 32px 24px; }
  .f-columns .f-about { grid-column: 1 / -1; }
}
@media (max-width: 480px) {
  .f-columns .f-grid { grid-template-columns: 1fr; }
}