/* falcon.com home page: "For AI consultants and partners" (graphic H, coming next). A partner's
   library flows into each client as the same base; each client carries the partner's brand and a
   billing line. It reuses graphic G's pieces from extend.css. Same rules as the other sheets:
   classes only, the base style is the final frame, motion only when the visitor allows it. */

#partners-title .tag {
  margin-left: 0.25rem;
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: normal;
  line-height: 1.5;
  vertical-align: middle;
}
.partner-cta {
  margin: 1.75rem 0 0;
}
.p-mark {
  fill: var(--av-2);
}
.graphic .p-mark-t {
  fill: #ffffff;
  font-size: 14px;
  font-weight: 700;
}
.graphic .p-lib-t {
  fill: var(--red-900);
  font-size: 10.5px;
  font-weight: 600;
}
.p-brand-bg {
  fill: var(--surface-high);
  stroke: var(--line);
}
.graphic .p-brand-t {
  font-size: 10.5px;
  font-weight: 600;
}
.graphic .p-bill {
  fill: var(--red-900);
  font-size: 11px;
  font-weight: 600;
}
.p-tok {
  --dy: 100px;
}

@media (prefers-reduced-motion: no-preference) {
  /* H: the base flows into each client (graphic G's timing), then the brand and the bill appear.
     16s loop. */
  .p-brand,
  .p-bill {
    animation: 16s ease-in-out infinite both;
  }
  .p-brand {
    animation-name: p-brand;
  }
  .p-bill {
    animation-name: p-bill;
  }
  .p-brand.k2,
  .p-bill.k2 {
    animation-delay: 0.5s;
  }
  .p-brand.k3,
  .p-bill.k3 {
    animation-delay: 1s;
  }
}

@keyframes p-brand {
  0%,
  34% {
    opacity: 0;
  }
  39%,
  95% {
    opacity: 1;
  }
  99%,
  100% {
    opacity: 0;
  }
}
@keyframes p-bill {
  0%,
  46% {
    opacity: 0;
  }
  51%,
  95% {
    opacity: 1;
  }
  99%,
  100% {
    opacity: 0;
  }
}