import type { ReactNode } from "react";

import { cn } from "@/lib/ui/variants";

interface EyebrowProps {
  children: ReactNode;
  className?: string;
}

// 眉题/小标签：无衬线、eyebrow 字号（含正字距 0.08em）、说明色、大写。
// 统一各页此前 mono/uppercase 互不一致的小标签写法。
export function Eyebrow({ children, className }: EyebrowProps) {
  return (
    <p
      className={cn(
        "font-sans text-eyebrow uppercase text-muted-soft",
        className,
      )}
    >
      {children}
    </p>
  );
}