/*!
 * it-track-band-v1.css
 * The band above the footer: what the site is free for, and what needs an
 * account.
 *
 * It was two cards carrying about 1,300 characters of the same copy on 212
 * pages. Repetition at that scale is thin content, so the detail moved to
 * /invoice-tracking/ and what is left here is a heading, a sentence and two
 * links. The markup is static, not injected, because copy a crawler cannot
 * read cannot rank.
 */

.tb {
  border-top: 1px solid var(--border, #E9E4D8);
  background: #FBF8F0;
}
.tb-in {
  max-width: 1100px;
  margin: 0 auto;
  padding: 38px 24px 42px;
}
.tb h2 {
  margin: 0 0 9px;
  font-size: 23px;
  line-height: 1.25;
  letter-spacing: -.02em;
  color: #15151A;
}
.tb-lead {
  margin: 0 0 20px;
  font-size: 15px;
  line-height: 1.65;
  color: #54525E;
  max-width: 68ch;
}

.tb-links {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin: 0;
}

.tb-go {
  display: inline-block;
  min-height: 46px;
  line-height: 46px;
  padding: 0 20px;
  border-radius: 12px;
  border: 1px solid #121214;
  background: #121214;
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
}
.tb-go:hover { background: #000; color: #fff; }
.tb-go.ghost {
  background: #fff;
  color: #121214;
  border-color: #E9E4D8;
}
.tb-go.ghost:hover { background: #fff; border-color: #121214; color: #121214; }

.tb-fine {
  margin: 18px 0 0;
  font-size: 12.5px;
  line-height: 1.6;
  color: #8A8375;
  max-width: 74ch;
}

@media (max-width: 620px) {
  .tb-in { padding: 30px 18px 34px; }
  .tb h2 { font-size: 20px; }
  .tb-links { flex-direction: column; }
  .tb-go { display: block; text-align: center; }
}

@media print { .tb { display: none !important; } }