/* mm-footer.css: the shared MadeMirror site footer (landing, pricing, legal and thanks pages).
   Colours come from the page's tokens, so it reads on ink or porcelain without its own theme.
   Unlayered on purpose: it replaces the older per-page footer layouts (.foot, .pp-foot-in). */

.mm-sitefoot { display: block; padding: 0; gap: 0; border-top: 1px solid var(--mm-hair-1); background: var(--mm-bg); color: var(--mm-fg-1); }
.mm-sitefoot__in { display: grid; grid-template-columns: 1fr 1fr; gap: 28px 24px; padding: 44px 0 28px; }
.mm-sitefoot__brand { grid-column: 1 / -1; }
@media (min-width: 900px) {
  .mm-sitefoot__in { grid-template-columns: minmax(0, 1.7fr) repeat(3, minmax(0, 1fr)); padding-top: 56px; }
  .mm-sitefoot__brand { grid-column: auto; }
}

.mm-sitefoot__mark { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; color: var(--mm-fg-1); text-decoration: none; }
.mm-sitefoot__mark b { font: 600 13px/1 var(--mm-f-display); letter-spacing: .32em; }
.mm-sitefoot__brand p { max-width: 36ch; margin: 8px 0 0; font-size: var(--mm-fs-small); line-height: 1.55; color: var(--mm-fg-2); }

.mm-sitefoot__col { display: flex; flex-direction: column; align-items: flex-start; min-width: 0; }
.mm-sitefoot__h { margin: 0 0 6px; font: 500 11px/1.2 var(--mm-f-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--mm-fg-2); }
.mm-sitefoot__col a, .mm-sitefoot__col span { display: inline-flex; align-items: center; min-height: 44px; max-width: 100%; overflow-wrap: anywhere; font: 500 var(--mm-fs-small)/1.3 var(--mm-f-display); color: var(--mm-fg-1); text-decoration: none; }
.mm-sitefoot__col span { color: var(--mm-fg-2); }
.mm-sitefoot__col a:hover { text-decoration: underline; text-decoration-color: var(--mm-accent-text); text-underline-offset: 5px; }
.mm-sitefoot a:focus-visible { outline: 2px solid var(--mm-focus); outline-offset: 2px; border-radius: 2px; }

.mm-sitefoot__base { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 24px; padding: 18px 0 calc(24px + env(safe-area-inset-bottom)); border-top: 1px solid var(--mm-hair-1); font-size: 12.5px; line-height: 1.5; color: var(--mm-fg-2); }