/* ============================================================================
   THE marketing footer — one definition, every public page.
   ----------------------------------------------------------------------------
   Before this file there were five footers. The homepage had a full four-column
   one; /advertising had six links and its own wording; /amazon, /support and
   the four legal pages had a six-link legal strip; /integrations and /security
   had a different six-link strip under a different class; and /reports had a
   single line with an email address and NO legal links at all — no Privacy, no
   Terms, on the page that sells a paid report. The copyright line disagreed
   with itself too ("© Synthesis Intelligence." vs "© 2026 Synthesis
   Intelligence, Inc. All rights reserved.").

   Same rules as assets/sitenav.css:
   - Literal colours, never var(). The pages define different variable sets.
   - Class prefix .mfoot, so it cannot collide with the old .footer/.sitefoot
     rules still sitting in some pages' inline CSS.
   - The markup is ONE block copied verbatim into each page;
     scripts/check_site_consistency.py fails CI if the blocks diverge.

   Page-specific wording (the Amazon SP-API disclaimer, "Cancel any time") goes
   in a .mfoot-note block ABOVE the shared footer, never inside it.
   ========================================================================== */

/* DEFENSIVE RESET — do not trim this.
   The shared block is a <footer> element, and eight pages still carry bare
   `footer { ... }` element rules in their own inline CSS. A class beats an
   element selector only for properties the class also sets, so everything
   these pages set and this file did not leaked straight through: /privacy-
   policy, /terms-of-service, /data-deletion and /security-incident-response
   rendered the footer as a 760px box with 80px margins, /amazon and /support
   as a 920px box, instead of full-bleed. Colours and columns looked right the
   whole time, which is why the first check missed it — measure WIDTH.
   text-align is here for the same reason: /reports and /integrations centre
   their body text and that centred all four columns. */
.mfoot{background:#0c0d12;color:#aeb4c2;padding:64px 0 36px;
  text-align:left;width:auto;max-width:none;margin:0;
  position:static;border:0;border-radius:0;
  font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;}
.mfoot-in{max-width:1180px;margin:0 auto;padding:0 24px;text-align:left;}

.mfoot h4{color:#fff;font-size:14px;font-weight:700;letter-spacing:0;margin:0 0 14px;}
.mfoot a{display:block;color:#9aa1b2;font-size:14.5px;padding:5px 0;
  text-decoration:none;transition:color .14s;}
.mfoot a:hover{color:#fff;}

.mfoot-top{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:32px;
  padding-bottom:40px;border-bottom:1px solid #20232e;}

/* Written as `.mfoot a.mfoot-brand`, not `.mfoot-brand`: the brand IS an <a>,
   so the `.mfoot a{display:block}` rule above outranks a bare class selector
   and was stacking the gem on top of the wordmark. */
.mfoot a.mfoot-brand{display:flex;align-items:center;gap:10px;margin-bottom:14px;padding:0;}
.mfoot-brand .word{font-size:18px;font-weight:800;letter-spacing:-.02em;color:#fff;line-height:1.2;}
.mfoot-brand .word small{display:block;font-size:9.5px;font-weight:600;letter-spacing:.12em;
  text-transform:uppercase;color:#767d8d;margin-top:-2px;}
.mfoot-blurb{color:#9aa1b2;font-size:14.5px;max-width:280px;margin:0;line-height:1.6;}
.mfoot-price{color:#c3c8d4;font-size:14px;margin:14px 0 0;font-weight:600;}
.mfoot-price span{color:#767d8d;font-weight:500;}
.mfoot-mail{display:inline-block;color:#9aa1b2;font-size:14px;margin-top:8px;}

.mfoot-bottom{display:flex;justify-content:space-between;align-items:center;
  padding-top:26px;font-size:13.5px;color:#767d8d;gap:12px;flex-wrap:wrap;}
.mfoot-bottom a{display:inline;color:#767d8d;padding:0;}
.mfoot-bottom a:hover{color:#fff;}

/* Page-specific wording that sits above the shared footer. */
.mfoot-note{background:#0c0d12;color:#767d8d;font-family:'Plus Jakarta Sans',system-ui,sans-serif;
  font-size:12.5px;line-height:1.65;padding:26px 0 0;}
.mfoot-note-in{max-width:1180px;margin:0 auto;padding:0 24px;}
.mfoot-note a{color:#9aa1b2;}

@media(max-width:900px){
  .mfoot-top{grid-template-columns:1fr 1fr;gap:28px;}
}
@media(max-width:560px){
  .mfoot{padding:48px 0 30px;}
  .mfoot-top{grid-template-columns:1fr;gap:24px;}
  .mfoot-bottom{flex-direction:column;align-items:flex-start;gap:10px;}
}
