import { cn } from '@/lib/utils';

/**
 * Two words, two faces: "PIG" is a name and is set in the sans; "demo" is a
 * qualifier that reads like a tag, so it takes the mono the site uses for
 * every label. One tone shift — the brand carries the accent, the qualifier
 * does not — and a single sr-only string so a screen reader announces
 * "PIG demo" rather than two unrelated fragments.
 *
 * This is the site's only mark. Prime Intellect's logo is never rendered here.
 */
export function Wordmark({ className }: { className?: string }) {
  return (
    <span className={cn('inline-flex items-baseline gap-1.5 text-base', className)}>
      <span aria-hidden="true" className="font-sans font-semibold tracking-tight text-accent-fg">
        PIG
      </span>
      <span aria-hidden="true" className="font-mono text-[0.8125rem] font-normal lowercase text-muted">
        demo
      </span>
      <span className="sr-only">PIG demo</span>
    </span>
  );
}
