import { type HTMLAttributes, type ReactNode } from 'react';
declare const ACCENT_WHEEL: readonly ["violet", "purple", "magenta", "blue", "green", "red"];
type WheelAccent = (typeof ACCENT_WHEEL)[number];
type SemanticAccent = 'primary' | 'accent' | 'info' | 'success' | 'warning';
type AccentProp = SemanticAccent | WheelAccent | 'auto';
export interface BenefitCardProps extends Omit<HTMLAttributes<HTMLElement>, 'title'> {
    /** Step number; rendered as a zero-padded chip ("01", "02", …). Omit to hide. */
    step?: number;
    /** Icon node — usually an `<svg>` 24-32px. Rendered inside a tinted square chip. */
    icon?: ReactNode;
    /** Card heading, rendered as a heading element. Pass only inline / phrasing content. */
    title: ReactNode;
    /**
     * Level of the title heading, `3` by default. Set it to one below the
     * section heading the cards sit under: `2` when the page's `h1` is the
     * only heading above them.
     */
    headingLevel?: 2 | 3 | 4 | 5 | 6;
    /** Optional CTA — usually a `<Button intent="link">` or kit `<Link>`. Rendered at the block-end. */
    cta?: ReactNode;
    /** Surface treatment. */
    variant?: 'elevated' | 'outlined';
    /**
     * Accent colour. `auto` (default inside a `<BenefitCard.Row>`) rotates through the brand
     * palette by row index: violet → purple → magenta → blue → green → red, then wraps.
     * Outside a Row, `auto` falls back to `primary`.
     */
    accent?: AccentProp;
    /** Body content (description / list / inline copy). */
    children?: ReactNode;
}
export interface BenefitCardRowProps extends Omit<HTMLAttributes<HTMLDivElement>, 'children'> {
    /** Number of columns at md+; defaults to 3. Collapses to 1 at < md. */
    columns?: 1 | 2 | 3 | 4;
    children?: ReactNode;
}
export declare const BenefitCard: import("react").ForwardRefExoticComponent<BenefitCardProps & import("react").RefAttributes<HTMLElement>> & {
    Row: import("react").ForwardRefExoticComponent<BenefitCardRowProps & import("react").RefAttributes<HTMLDivElement>>;
};
export {};
//# sourceMappingURL=benefit-card.d.ts.map