/* Growthr — the one site footer. Spliced into every page by scripts/footer/apply.py
   between the GFOOT fences; edit scripts/footer/partial.html, not a page.

   Colours are self-contained (only --accent is borrowed) so the footer renders
   identically on all three token systems in this repo: the service shell
   (--fg/--sep), the landing pages (--text/--border) and the homepage
   (--white/--gray-*). Background stays transparent so it inherits the page. */
.gfoot {
  margin-top: 96px;   /* the service shell's old .ft spacing; pages that already
                         end in a padded CTA still read fine with it */
  border-top: 1px solid rgba(255, 255, 255, .08);
  padding: 72px 24px 36px;
  font-family: 'acumin-pro', Helvetica, 'Helvetica Neue', Arial, sans-serif;
}
.gfoot-inner { max-width: 1120px; margin: 0 auto; }
.gfoot-grid {
  display: grid;
  grid-template-columns: 1.6fr 1fr 1fr;
  gap: 44px;
  padding-bottom: 44px;
  border-bottom: 1px solid rgba(255, 255, 255, .08);
}
.gfoot-brand img { height: 22px; width: auto; display: block; }
.gfoot-brand p {
  margin: 16px 0 0; font-size: 13.5px; line-height: 1.65;
  color: rgba(255, 255, 255, .55); max-width: 290px;
}
.gfoot-col h3 {
  font-size: 13.5px; font-weight: 700; letter-spacing: 0;
  color: rgba(255, 255, 255, .55); margin: 0 0 12px;
}
.gfoot-col a {
  display: block; font-size: 14px; line-height: 1.4;
  color: rgba(255, 255, 255, .78); text-decoration: none;
  padding: 5px 0; transition: color 160ms cubic-bezier(.23, 1, .32, 1);
}
.gfoot-col a:hover { color: var(--accent, #2EC4FF); }
.gfoot-bottom {
  display: flex; align-items: center; justify-content: space-between;
  flex-wrap: wrap; gap: 16px; padding-top: 26px;
  font-size: 13px; color: rgba(255, 255, 255, .45);
}
.gfoot-bottom a { color: inherit; text-decoration: none; }
.gfoot-bottom a:hover { color: var(--accent, #2EC4FF); }
.gfoot-cta {
  color: #000; background: var(--accent, #2EC4FF); font-weight: 700;
  font-size: 14px; text-decoration: none;
  padding: 10px 20px; border-radius: 8px;
  transition: filter 160ms cubic-bezier(.23, 1, .32, 1);
}
.gfoot-cta:hover { color: #000; filter: brightness(1.08); }
@media (max-width: 860px) {
  .gfoot { margin-top: 72px; padding: 56px 20px 32px; }
  .gfoot-grid { grid-template-columns: 1fr 1fr; gap: 36px; }
  .gfoot-brand { grid-column: 1 / -1; }
  .gfoot-brand p { max-width: none; }
}
@media (max-width: 520px) {
  /* Stay two-up on phones. One column stacks 21 links into more than a full
     screen of footer; two columns keep it to roughly two thirds of one. */
  .gfoot-grid { gap: 24px 20px; padding-bottom: 32px; }
  .gfoot-brand { grid-column: 1 / -1; }
  .gfoot-brand p { max-width: none; }
  .gfoot-bottom { justify-content: flex-start; }
}
@media (prefers-reduced-motion: reduce) {
  .gfoot-col a, .gfoot-bottom a, .gfoot-cta { transition: none; }
}