import * as React$1 from 'react';
import { HTMLAttributes, ReactNode } from 'react';
import * as react_jsx_runtime from 'react/jsx-runtime';
import { A as ActionConfig, O as OptixFlowConfig } from './blocks-XLPGq8A5.js';

declare const patternSvgs: {
    squareAltGrid: string;
    grid1: string;
    noise: string;
    dots: string;
    dotPattern: string;
    dotPattern2: string;
    circles: string;
    waves: string;
    crossPattern: string;
    architect: string;
    tinyCheckers: string;
    p6: string;
};

declare const patternOverlays: {
    circuitBoardBasic: () => react_jsx_runtime.JSX.Element;
    circuitBoardFadeTop: () => react_jsx_runtime.JSX.Element;
    circuitBoardFadeBottom: () => react_jsx_runtime.JSX.Element;
    circuitBoardFadeCenter: () => react_jsx_runtime.JSX.Element;
    circuitBoardFadeTopLeft: () => react_jsx_runtime.JSX.Element;
    circuitBoardFadeTopRight: () => react_jsx_runtime.JSX.Element;
    circuitBoardFadeBottomLeft: () => react_jsx_runtime.JSX.Element;
    circuitBoardFadeBottomRight: () => react_jsx_runtime.JSX.Element;
    dashedGridBasic: () => react_jsx_runtime.JSX.Element;
    dashedGridFadeTop: () => react_jsx_runtime.JSX.Element;
    dashedGridFadeBottom: () => react_jsx_runtime.JSX.Element;
    dashedGridFadeCenter: () => react_jsx_runtime.JSX.Element;
    dashedGridFadeTopLeft: () => react_jsx_runtime.JSX.Element;
    dashedGridFadeTopRight: () => react_jsx_runtime.JSX.Element;
    dashedGridFadeBottomLeft: () => react_jsx_runtime.JSX.Element;
    dashedGridFadeBottomRight: () => react_jsx_runtime.JSX.Element;
    diagonalCrossBasic: () => react_jsx_runtime.JSX.Element;
    diagonalCrossFadeTop: () => react_jsx_runtime.JSX.Element;
    diagonalCrossFadeBottom: () => react_jsx_runtime.JSX.Element;
    diagonalCrossFadeCenter: () => react_jsx_runtime.JSX.Element;
    diagonalCrossFadeTopLeft: () => react_jsx_runtime.JSX.Element;
    diagonalCrossFadeTopRight: () => react_jsx_runtime.JSX.Element;
    diagonalCrossFadeBottomLeft: () => react_jsx_runtime.JSX.Element;
    diagonalCrossFadeBottomRight: () => react_jsx_runtime.JSX.Element;
    gridBasic: () => react_jsx_runtime.JSX.Element;
    gridFadeTop: () => react_jsx_runtime.JSX.Element;
    gridFadeBottom: () => react_jsx_runtime.JSX.Element;
    gridFadeCenter: () => react_jsx_runtime.JSX.Element;
    gridFadeTopLeft: () => react_jsx_runtime.JSX.Element;
    gridFadeTopRight: () => react_jsx_runtime.JSX.Element;
    gridFadeBottomLeft: () => react_jsx_runtime.JSX.Element;
    gridFadeBottomRight: () => react_jsx_runtime.JSX.Element;
    gridDotsBasic: () => react_jsx_runtime.JSX.Element;
    gridDotsFadeCenter: () => react_jsx_runtime.JSX.Element;
    gradientGlowTop: () => react_jsx_runtime.JSX.Element;
    gradientGlowBottom: () => react_jsx_runtime.JSX.Element;
    spotlightLeft: () => react_jsx_runtime.JSX.Element;
    spotlightRight: () => react_jsx_runtime.JSX.Element;
};
declare const inlinePatternStyles: {
    radialGradientTop: {
        background: string;
    };
    radialGradientBottom: {
        background: string;
    };
};
/**
 * General pattern name type that includes all pattern types
 * Includes pattern overlays, SVG patterns, and inline pattern styles
 */
type PatternName = keyof typeof patternSvgs | keyof typeof patternOverlays | keyof typeof inlinePatternStyles;

interface DirectionConfig {
    desktop: "mediaRight" | "mediaLeft";
    mobile: "mediaTop" | "mediaBottom";
}
interface AboutSplitHeroProps {
    /**
     * Brand/logo text
     */
    brandText?: React$1.ReactNode;
    /**
     * Additional CSS classes for the brand text
     */
    brandTextClassName?: string;
    /**
     * Highlighted brand text (e.g., "PRO")
     */
    brandHighlight?: React$1.ReactNode;
    /**
     * Additional CSS classes for the brand highlight
     */
    brandHighlightClassName?: string;
    /**
     * Main heading text
     */
    heading?: React$1.ReactNode;
    /**
     * Additional CSS classes for the heading
     */
    headingClassName?: string;
    /**
     * Supporting description text
     */
    description?: React$1.ReactNode;
    /**
     * Additional CSS classes for the description
     */
    descriptionClassName?: string;
    /**
     * CTA action configuration
     */
    ctaAction?: ActionConfig;
    /**
     * Custom slot for rendering CTA (overrides ctaAction)
     */
    ctaSlot?: React$1.ReactNode;
    /**
     * Additional CSS classes for the CTA
     */
    ctaClassName?: string;
    /**
     * Image source URL
     */
    imageSrc?: string;
    /**
     * Image alt text
     */
    imageAlt?: string;
    /**
     * Additional CSS classes for the image
     */
    imageClassName?: string;
    /**
     * Additional CSS classes for the content area
     */
    contentClassName?: string;
    /**
     * Additional CSS classes for the section
     */
    className?: string;
    /**
     * Optional Optix Flow configuration for image optimization
     */
    optixFlowConfig?: OptixFlowConfig;
    /**
     * Section background variant
     */
    background?: SectionBackground;
    /**
     * Pattern background key or URL
     */
    pattern?: PatternName | undefined;
    /**
     * Pattern opacity (0-1)
     */
    patternOpacity?: number;
    /**
     * Direction configuration for desktop and mobile layouts
     * @default { desktop: 'mediaRight', mobile: 'mediaTop' }
     */
    directionConfig?: DirectionConfig;
}
/**
 * About Split Hero - A full-width split-screen hero section with edge-to-edge design,
 * featuring text content on one side and a large full-height image on the other.
 *
 * Layout: 50/50 split layout with content and image sections. Fully responsive with
 * configurable media placement for desktop and mobile.
 * Key features: Pattern background support, gradient text highlight, edge-to-edge design.
 * Best for: Premium/pro tier landing pages, product launches, upgrade prompts.
 *
 * @example
 * ```tsx
 * <AboutSplitHero
 *   brandText="Business"
 *   brandHighlight="PRO"
 *   heading="Achieve More with Elite Access Pro"
 *   description="Enhance your career hunt with increased visibility."
 *   ctaAction={{ label: "Upgrade to premium", href: "/upgrade" }}
 *   imageSrc="/hero-image.jpg"
 *   pattern="dots"
 *   background="dark"
 * />
 * ```
 */
declare function AboutSplitHero({ brandText, brandTextClassName, brandHighlight, brandHighlightClassName, heading, headingClassName, description, descriptionClassName, ctaAction, ctaSlot, ctaClassName, imageSrc, imageAlt, imageClassName, contentClassName, className, optixFlowConfig, background, pattern, patternOpacity, directionConfig, }: AboutSplitHeroProps): React$1.JSX.Element;

interface AboutMissionPrincipleItem {
    /**
     * Principle number (e.g., "01", "02")
     */
    number?: React$1.ReactNode;
    /**
     * Principle title
     */
    title?: React$1.ReactNode;
    /**
     * Principle description
     */
    description?: React$1.ReactNode;
}
interface AboutMissionPrinciplesProps {
    /**
     * Badge/label text
     */
    badgeText?: React$1.ReactNode;
    /**
     * Additional CSS classes for the badge
     */
    badgeClassName?: string;
    /**
     * Main mission statement heading
     */
    missionHeading?: React$1.ReactNode;
    /**
     * Additional CSS classes for the mission heading
     */
    missionHeadingClassName?: string;
    /**
     * Mission description text
     */
    missionDescription?: React$1.ReactNode;
    /**
     * Additional CSS classes for the mission description
     */
    missionDescriptionClassName?: string;
    /**
     * Mission CTA action configuration
     */
    missionAction?: ActionConfig;
    /**
     * Custom slot for rendering mission CTA (overrides missionAction)
     */
    missionActionSlot?: React$1.ReactNode;
    /**
     * Additional CSS classes for the mission action
     */
    missionActionClassName?: string;
    /**
     * Array of principle items
     */
    principles?: AboutMissionPrincipleItem[];
    /**
     * Custom slot for rendering principles (overrides principles array)
     */
    principlesSlot?: React$1.ReactNode;
    /**
     * Additional CSS classes for the principles container
     */
    principlesClassName?: string;
    /**
     * Vision section heading
     */
    visionHeading?: React$1.ReactNode;
    /**
     * Additional CSS classes for the vision heading
     */
    visionHeadingClassName?: string;
    /**
     * Vision section description
     */
    visionDescription?: React$1.ReactNode;
    /**
     * Additional CSS classes for the vision description
     */
    visionDescriptionClassName?: string;
    /**
     * Vision CTA action configuration
     */
    visionAction?: ActionConfig;
    /**
     * Custom slot for rendering vision CTA (overrides visionAction)
     */
    visionActionSlot?: React$1.ReactNode;
    /**
     * Additional CSS classes for the vision section
     */
    visionClassName?: string;
    /**
     * Additional CSS classes for the section
     */
    className?: string;
    /**
     * Additional CSS classes for the container
     */
    containerClassName?: string;
    /**
     * Section background variant
     */
    background?: SectionBackground;
    /**
     * Section spacing variant
     */
    spacing?: SectionSpacing;
    /**
     * Pattern background key or URL
     */
    pattern?: PatternName | undefined;
    /**
     * Pattern opacity (0-1)
     */
    patternOpacity?: number;
}
/**
 * About Mission Principles - A comprehensive mission statement section with
 * numbered principle cards and a vision callout.
 *
 * Layout: Two-column grid with mission text on left, principle cards on right,
 * followed by a full-width vision banner.
 * Key features: Numbered principle cards, badge label, dual CTAs.
 * Best for: Company about pages, mission statements, values showcases.
 *
 * @example
 * ```tsx
 * <AboutMissionPrinciples
 *   badgeText="Our Mission"
 *   missionHeading="To empower people through technology"
 *   missionDescription="We believe technology should serve humanity."
 *   principles={[
 *     { number: "01", title: "Customer-Centric", description: "..." },
 *   ]}
 * />
 * ```
 */
declare function AboutMissionPrinciples({ badgeText, badgeClassName, missionHeading, missionHeadingClassName, missionDescription, missionDescriptionClassName, missionAction, missionActionSlot, missionActionClassName, principles, principlesSlot, principlesClassName, visionHeading, visionHeadingClassName, visionDescription, visionDescriptionClassName, visionAction, visionActionSlot, visionClassName, className, containerClassName, background, spacing, pattern, patternOpacity, }: AboutMissionPrinciplesProps): React$1.JSX.Element;

interface AboutExpandableValueItem {
    /**
     * Unique identifier for the value
     */
    id: string;
    /**
     * Icon element or icon name
     */
    icon?: React$1.ReactNode;
    /**
     * Value title
     */
    title?: React$1.ReactNode;
    /**
     * Short description shown when collapsed
     */
    shortDescription?: React$1.ReactNode;
    /**
     * Long description shown when expanded
     */
    longDescription?: React$1.ReactNode;
    /**
     * Examples of how the value is practiced
     */
    examples?: React$1.ReactNode[];
}
interface AboutExpandableValuesProps {
    /**
     * Badge/label text
     */
    badgeText?: React$1.ReactNode;
    /**
     * Main heading text
     */
    heading?: React$1.ReactNode;
    /**
     * Supporting description text
     */
    description?: React$1.ReactNode;
    /**
     * Array of value items
     */
    values?: AboutExpandableValueItem[];
    /**
     * Custom slot for rendering values (overrides values array)
     */
    valuesSlot?: React$1.ReactNode;
    /**
     * Bottom CTA heading
     */
    ctaHeading?: React$1.ReactNode;
    /**
     * Bottom CTA description
     */
    ctaDescription?: React$1.ReactNode;
    /**
     * Array of action configurations for CTA buttons
     */
    actions?: ActionConfig[];
    /**
     * Custom slot for rendering actions (overrides actions array)
     */
    actionsSlot?: React$1.ReactNode;
    /**
     * Additional CSS classes for the section
     */
    className?: string;
    /**
     * Additional CSS classes for the container
     */
    containerClassName?: string;
    /**
     * Additional CSS classes for the header
     */
    headerClassName?: string;
    /**
     * Additional CSS classes for the badge
     */
    badgeClassName?: string;
    /**
     * Additional CSS classes for the heading
     */
    headingClassName?: string;
    /**
     * Additional CSS classes for the description
     */
    descriptionClassName?: string;
    /**
     * Additional CSS classes for the values grid
     */
    valuesClassName?: string;
    /**
     * Additional CSS classes for the CTA section
     */
    ctaClassName?: string;
    /**
     * Additional CSS classes for the CTA heading
     */
    ctaHeadingClassName?: string;
    /**
     * Additional CSS classes for the CTA description
     */
    ctaDescriptionClassName?: string;
    /**
     * Additional CSS classes for the actions container
     */
    actionsClassName?: string;
    /**
     * Section background variant
     */
    background?: SectionBackground;
    /**
     * Section spacing variant
     */
    spacing?: SectionSpacing;
    /**
     * Pattern background key or URL
     */
    pattern?: PatternName | undefined;
    /**
     * Pattern opacity (0-1)
     */
    patternOpacity?: number;
}
/**
 * About Expandable Values - An interactive values section with expandable cards
 * that reveal detailed descriptions and examples when clicked.
 *
 * Layout: Responsive grid of value cards that expand to full width when active.
 * Key features: Expandable cards, icon integration, example lists, CTA banner.
 * Best for: Company values pages, culture showcases, brand identity sections.
 *
 * @example
 * ```tsx
 * <AboutExpandableValues
 *   badgeText="Our Core Values"
 *   heading="The Principles That Guide Us"
 *   values={[
 *     {
 *       id: "integrity",
 *       icon: "lucide/shield",
 *       title: "Integrity",
 *       shortDescription: "Doing what's right.",
 *       longDescription: "We believe in honesty...",
 *       examples: ["Transparent pricing", "Honest communication"],
 *     },
 *   ]}
 * />
 * ```
 */
declare function AboutExpandableValues({ badgeText, heading, description, values, valuesSlot, ctaHeading, ctaDescription, actions, actionsSlot, className, containerClassName, headerClassName, badgeClassName, headingClassName, descriptionClassName, valuesClassName, ctaClassName, ctaHeadingClassName, ctaDescriptionClassName, actionsClassName, background, spacing, pattern, patternOpacity, }: AboutExpandableValuesProps): React$1.JSX.Element;

interface CommunityMetric {
    /**
     * Metric value (e.g., "45%", "$2M")
     */
    value: string;
    /**
     * Metric label
     */
    label: string;
}
interface CommunityInitiative {
    /**
     * Unique identifier
     */
    id: string;
    /**
     * Initiative title
     */
    title: string;
    /**
     * Initiative description
     */
    description: string;
    /**
     * Icon name in format: prefix/name
     */
    icon: string;
    /**
     * Optional metrics to display
     */
    metrics?: CommunityMetric[];
    /**
     * Optional image URL
     */
    image?: string;
}
interface CommunityCategory {
    /**
     * Unique identifier
     */
    id: string;
    /**
     * Category title
     */
    title: string;
    /**
     */
    description: string;
    /**
     * Array of initiatives in this category
     */
    initiatives: CommunityInitiative[];
}
interface CommunityInitiativesProps {
    /**
     * Badge/label text
     */
    badgeText?: React$1.ReactNode;
    /**
     * Main heading text
     */
    heading?: React$1.ReactNode;
    /**
     * Supporting description text
     */
    description?: React$1.ReactNode;
    /**
     * Array of DEI categories
     */
    categories?: CommunityCategory[];
    /**
     * Custom slot for rendering categories (overrides categories array)
     */
    categoriesSlot?: React$1.ReactNode;
    /**
     * CTA badge text
     */
    ctaBadgeText?: React$1.ReactNode;
    /**
     * CTA heading
     */
    ctaHeading?: React$1.ReactNode;
    /**
     * CTA description
     */
    ctaDescription?: React$1.ReactNode;
    /**
     * Array of action configurations for CTA buttons
     */
    actions?: ActionConfig[];
    /**
     * Custom slot for rendering actions (overrides actions array)
     */
    actionsSlot?: React$1.ReactNode;
    /**
     * Additional CSS classes for the section
     */
    className?: string;
    /**
     * Additional CSS classes for the container
     */
    containerClassName?: string;
    /**
     * Additional CSS classes for the header
     */
    headerClassName?: string;
    /**
     * Additional CSS classes for the badge
     */
    badgeClassName?: string;
    /**
     * Additional CSS classes for the heading
     */
    headingClassName?: string;
    /**
     * Additional CSS classes for the description
     */
    descriptionClassName?: string;
    /**
     * Additional CSS classes for the tabs container
     */
    tabsClassName?: string;
    /**
     * Additional CSS classes for the CTA section
     */
    ctaClassName?: string;
    /**
     * Additional CSS classes for the CTA heading
     */
    ctaHeadingClassName?: string;
    /**
     * Additional CSS classes for the CTA description
     */
    ctaDescriptionClassName?: string;
    /**
     * Additional CSS classes for the actions container
     */
    actionsClassName?: string;
    /**
     * Optional Optix Flow configuration for image optimization
     */
    optixFlowConfig?: OptixFlowConfig;
    /**
     * Section background variant
     */
    background?: SectionBackground;
    /**
     * Section spacing variant
     */
    spacing?: SectionSpacing;
    /**
     * Pattern background key or URL
     */
    pattern?: PatternName | undefined;
    /**
     * Pattern opacity (0-1)
     */
    patternOpacity?: number;
}
/**
 * About DEI Initiatives - A comprehensive diversity, equity, and inclusion section
 * with tabbed categories and detailed initiative cards with metrics.
 *
 * Layout: Tabbed interface with alternating content/image layout for initiatives.
 * Key features: Category tabs, metrics display, responsive dropdown for mobile.
 * Best for: DEI pages, corporate responsibility sections, values showcases.
 *
 * @example
 * ```tsx
 * <CommunityInitiatives
 *   badgeText="Diversity & Inclusion"
 *   heading="Building a More Equitable Future"
 *   categories={[
 *     {
 *       id: "workplace",
 *       title: "Inclusive Workplace",
 *       description: "Creating an inclusive environment.",
 *       initiatives: [...]
 *     },
 *   ]}
 * />
 * ```
 */
declare function CommunityInitiatives({ badgeText, heading, description, categories, categoriesSlot, ctaBadgeText, ctaHeading, ctaDescription, actions, actionsSlot, className, containerClassName, headerClassName, badgeClassName, headingClassName, descriptionClassName, tabsClassName, ctaClassName, ctaHeadingClassName, ctaDescriptionClassName, actionsClassName, optixFlowConfig, background, spacing, pattern, patternOpacity, }: CommunityInitiativesProps): React$1.JSX.Element;

interface CultureTestimonial {
    /**
     * Testimonial quote
     */
    quote: string;
    /**
     * Author name
     */
    author: string;
    /**
     * Author role/title
     */
    role: string;
    /**
     * Author avatar URL
     */
    avatar: string;
}
interface CultureAspect {
    /**
     * Unique identifier
     */
    id: string;
    /**
     * Aspect title
     */
    title: string;
    /**
     * Aspect description
     */
    description: string;
    /**
     * Array of image URLs
     */
    images: string[];
    /**
     * Testimonial for this aspect
     */
    testimonial: CultureTestimonial;
}
interface AboutCultureTabsProps {
    /**
     * Badge/label text
     */
    badgeText?: React$1.ReactNode;
    /**
     * Main heading text
     */
    heading?: React$1.ReactNode;
    /**
     * Supporting description text
     */
    description?: React$1.ReactNode;
    /**
     * Array of culture aspects
     */
    aspects?: CultureAspect[];
    /**
     * Custom slot for rendering aspects (overrides aspects array)
     */
    aspectsSlot?: React$1.ReactNode;
    /**
     * CTA heading
     */
    ctaHeading?: React$1.ReactNode;
    /**
     * CTA description
     */
    ctaDescription?: React$1.ReactNode;
    /**
     * Array of action configurations for CTA buttons
     */
    actions?: ActionConfig[];
    /**
     * Custom slot for rendering actions (overrides actions array)
     */
    actionsSlot?: React$1.ReactNode;
    /**
     * CTA section images
     */
    ctaImages?: string[];
    /**
     * Custom slot for rendering CTA images (overrides ctaImages array)
     */
    ctaImagesSlot?: React$1.ReactNode;
    /**
     * Additional CSS classes for the section
     */
    className?: string;
    /**
     * Additional CSS classes for the container
     */
    containerClassName?: string;
    /**
     * Additional CSS classes for the header
     */
    headerClassName?: string;
    /**
     * Additional CSS classes for the badge
     */
    badgeClassName?: string;
    /**
     * Additional CSS classes for the heading
     */
    headingClassName?: string;
    /**
     * Additional CSS classes for the description
     */
    descriptionClassName?: string;
    /**
     * Additional CSS classes for the tabs container
     */
    tabsClassName?: string;
    /**
     * Additional CSS classes for the CTA section
     */
    ctaClassName?: string;
    /**
     * Additional CSS classes for the CTA heading
     */
    ctaHeadingClassName?: string;
    /**
     * Additional CSS classes for the CTA description
     */
    ctaDescriptionClassName?: string;
    /**
     * Additional CSS classes for the actions container
     */
    actionsClassName?: string;
    /**
     * Optional Optix Flow configuration for image optimization
     */
    optixFlowConfig?: OptixFlowConfig;
    /**
     * Section background variant
     */
    background?: SectionBackground;
    /**
     * Section spacing variant
     */
    spacing?: SectionSpacing;
    /**
     * Pattern background key or URL
     */
    pattern?: PatternName | undefined;
    /**
     * Pattern opacity (0-1)
     */
    patternOpacity?: number;
}
/**
 * About Culture Tabs - A tabbed company culture section with testimonials,
 * image galleries, and a careers CTA.
 *
 * Layout: Tabbed interface with description, testimonial card, and image grid.
 * Key features: Culture aspect tabs, employee testimonials, image galleries.
 * Best for: Company culture pages, careers sections, about us pages.
 *
 * @example
 * ```tsx
 * <AboutCultureTabs
 *   badgeText="Our Culture"
 *   heading="What Makes Us Different"
 *   aspects={[
 *     {
 *       id: "innovation",
 *       title: "Innovation First",
 *       description: "We believe in challenging the status quo.",
 *       images: [...],
 *       testimonial: { quote: "...", author: "...", role: "...", avatar: "..." },
 *     },
 *   ]}
 * />
 * ```
 */
declare function AboutCultureTabs({ badgeText, heading, description, aspects, aspectsSlot, ctaHeading, ctaDescription, actions, actionsSlot, ctaImages, ctaImagesSlot, className, containerClassName, headerClassName, badgeClassName, headingClassName, descriptionClassName, tabsClassName, ctaClassName, ctaHeadingClassName, ctaDescriptionClassName, actionsClassName, optixFlowConfig, background, spacing, pattern, patternOpacity, }: AboutCultureTabsProps): React$1.JSX.Element;

/**
 * Max width variants for Container component
 */
type ContainerMaxWidth = "sm" | "md" | "lg" | "xl" | "2xl" | "4xl" | "full";
/**
 * Background variants for Section component
 */
type SectionBackground = "default" | "white" | "gray" | "dark" | "gradient" | "primary" | "secondary" | "transparent" | "muted";
/**
 * Spacing variants for Section component
 * Can be a predefined variant or a custom Tailwind spacing class string
 * @example "lg" // predefined variant
 * @example "py-8 md:py-16" // custom spacing classes
 * @example "pt-4 pb-12 lg:pt-8 lg:pb-24" // asymmetric top/bottom spacing
 */
type SectionSpacing = "none" | "sm" | "md" | "lg" | "xl" | (string & {});
/**
 * Size variants for AnimatedDialog component
 */
type AnimatedDialogSize = "sm" | "md" | "lg" | "xl" | "full" | "compact";
/**
 * Props for Container component
 */
interface ContainerProps extends HTMLAttributes<HTMLElement> {
    /**
     * The content to be rendered inside the container
     */
    children: ReactNode;
    /**
     * Maximum width of the container
     * @default "xl"
     */
    maxWidth?: ContainerMaxWidth;
    /**
     * HTML element type to render
     * @default "div"
     */
    as?: keyof JSX.IntrinsicElements;
    /**
     * Additional CSS classes
     */
    className?: string;
}
/**
 * Props for Section component
 */
interface SectionProps extends HTMLAttributes<HTMLElement> {
    /**
     * Section ID for anchor links
     */
    id?: string;
    /**
     * Section title (renders as h2)
     */
    title?: string;
    /**
     * Section subtitle/eyebrow (renders above title)
     */
    subtitle?: string;
    /**
     * The content to be rendered inside the section
     */
    children: ReactNode;
    /**
     * Background style variant
     * @default "default"
     */
    background?: SectionBackground;
    /**
     * Vertical spacing variant
     * @default "lg"
     */
    spacing?: SectionSpacing;
    /**
     * Additional CSS classes (can override spacing and background styles)
     */
    className?: string;
    /**
     * Optional max width for the internal Container wrapper
     * @default "xl"
     */
    containerMaxWidth?: ContainerMaxWidth;
    /**
     * Additional CSS classes for the internal Container wrapper
     */
    containerClassName?: string;
    /**
     * Optional background pattern name from the predefined pattern overlays
     * Use one of the pattern overlay names for type-safe pattern selection
     * Examples: "dashedGridBasic", "circuitBoardFadeTop", "gradientGlowBottom"
     *
     * Smart default behavior:
     * - If pattern is provided without patternOpacity, opacity defaults to 1
     * - If no pattern is provided, opacity defaults to 0
     */
    pattern?: PatternName;
    /**
     * Pattern overlay opacity (0-1)
     * Defaults to 1 if pattern is provided, 0 if not
     * Can be explicitly set to override the default behavior
     */
    patternOpacity?: number;
    /**
     * Additional CSS classes for the pattern overlay
     */
    patternClassName?: string;
    /**
     * Inline styles (React.CSSProperties)
     */
    style?: React.CSSProperties;
}
/**
 * Props for AnimatedDialog component
 */
interface AnimatedDialogProps {
    /**
     * Whether the dialog is open
     */
    open: boolean;
    /**
     * Callback when the dialog open state changes
     */
    onOpenChange: (open: boolean) => void;
    /**
     * Dialog title
     */
    title?: string;
    /**
     * Eyebrow text above title
     */
    eyebrow?: string;
    /**
     * Dialog description
     */
    description?: string;
    /**
     * Dialog content
     */
    children?: ReactNode;
    /**
     * Custom header content (overrides title/eyebrow/description)
     */
    header?: ReactNode;
    /**
     * Footer content
     */
    footer?: ReactNode;
    /**
     * Dialog size variant
     * @default "lg"
     */
    size?: AnimatedDialogSize;
    /**
     * Additional CSS classes for the dialog container
     */
    className?: string;
    /**
     * Additional CSS classes for the content area
     */
    contentClassName?: string;
    /**
     * Featured media header to display at the top of the dialog (full-width, no padding)
     * Typically used with size="compact" for media card-style dialogs
     */
    featuredMediaHeader?: ReactNode;
}
/**
 * Props for PageHeroBanner component
 */
interface PageHeroBannerProps extends HTMLAttributes<HTMLDivElement> {
    /**
     * Image URL or Media ID to display as background
     * Either imageUrl or videoUrl must be provided
     */
    imageUrl?: string;
    /**
     * Video URL or Media ID to display as background
     * Either imageUrl or videoUrl must be provided
     */
    videoUrl?: string;
    /**
     * Alt text for the image (not used for video)
     */
    alt?: string;
    /**
     * Content to display on top of the banner
     */
    children: ReactNode;
    /**
     * Custom className for the banner container
     */
    className?: string;
    /**
     * Whether to use eager loading for the image
     * @default true for hero banners
     */
    loading?: "eager" | "lazy";
    /**
     * Minimum height of the banner
     * @default "500px"
     */
    minHeight?: string;
    /**
     * Whether to show the gradient overlay
     * @default true
     */
    showOverlay?: boolean;
    /**
     * Gradient overlay opacity
     * @default 0.6
     */
    overlayOpacity?: number;
    /**
     * Maximum width of content area
     * @default "4xl"
     */
    contentMaxWidth?: ContainerMaxWidth;
    /**
     * Custom className for the gradient overlay
     * Allows customization of overlay gradient for accessibility
     */
    overlayClassName?: string;
    /**
     * Custom className for the content Container
     * Allows overriding vertical alignment (e.g., items-start, items-end)
     */
    contentClassName?: string;
}
/**
 * Block Types - Content-Specific UI Blocks
 */
/**
 * Props for AlternatingBlocks component
 */
interface AlternatingBlockSection {
    /**
     * Content node to display (text, headings, etc.)
     */
    content: ReactNode;
    /**
     * Media node to display (image, video, icon, etc.)
     */
    media: ReactNode;
    /**
     * Whether to place media on the left side
     * @default false (media on right)
     */
    mediaLeft?: boolean;
}
interface AlternatingBlocksProps {
    /**
     * Array of sections to display with alternating layout
     */
    sections: AlternatingBlockSection[];
    /**
     * Additional CSS classes
     */
    className?: string;
}
/**
 * Props for FeatureShowcase component
 */
interface FeatureShowcaseItem {
    /**
     * Content node to display (text, headings, etc.)
     */
    content: ReactNode;
    /**
     * Media node to display (image, video, etc.)
     */
    mediaComponent: ReactNode;
}
interface FeatureShowcaseProps {
    /**
     * Array of feature items to display in carousel
     */
    items: FeatureShowcaseItem[];
    /**
     * Optional children to render above the carousel (e.g., section title)
     */
    children?: ReactNode;
    /**
     * Additional CSS classes for the outer container
     */
    className?: string;
    /**
     * Additional CSS classes for the carousel wrapper
     */
    carouselClassName?: string;
    /**
     * Additional CSS classes for each slide container
     */
    slideClassName?: string;
    /**
     * Additional CSS classes for the content area
     */
    contentClassName?: string;
    /**
     * Additional CSS classes for the media area
     */
    mediaClassName?: string;
    /**
     * Additional CSS classes for navigation arrows
     */
    arrowClassName?: string;
    /**
     * Whether to equalize slide heights on mobile
     * @default true
     */
    equalizeOnMobile?: boolean;
    /**
     * Whether to stretch media to fill available height on mobile
     * @default true
     */
    stretchMediaOnMobile?: boolean;
}
/**
 * Props for MediaHoverCtas component
 */
interface MediaHoverCtaItem {
    /**
     * Content to render inside the CTA card.
     */
    content?: ReactNode;
    /**
     * Image URL to reveal on hover (optional).
     */
    onHoverImgSrc?: string;
    /**
     * Additional classes for the hover image.
     */
    imgHoverClassName?: string;
    /**
     * Alt text for the hover image (leave empty for decorative images).
     */
    altText?: string;
    /**
     * Optional href to make the card a link.
     */
    cardHref?: string;
    /**
     * Initial background color (CSS color value or CSS variable).
     * Example: "#111" or "var(--brand-900)".
     */
    initialBackgroundColor?: string;
    /**
     * Hover background color (CSS color value or CSS variable).
     * Applied only when onHoverImgSrc is not provided.
     */
    onHoverBackgroundColor?: string;
}
type MediaHoverCtaType = MediaHoverCtaItem;
interface MediaHoverCtasProps {
    /**
     * Additional classes for the section wrapper.
     */
    sectionClassName?: string;
    /**
     * Additional classes for the grid container.
     */
    gridClassName?: string;
    /**
     * CTA items to render.
     */
    items?: MediaHoverCtaItem[];
    /**
     * Optional Optix Flow configuration for @page-speed/img.
     */
    optixFlowConfig?: {
        apiKey: string;
        compression?: number;
    };
}

export { AboutSplitHero as A, CommunityInitiatives as C, type DirectionConfig as D, type FeatureShowcaseItem as F, type MediaHoverCtasProps as M, type PageHeroBannerProps as P, type SectionProps as S, AboutMissionPrinciples as a, AboutExpandableValues as b, AboutCultureTabs as c, type ContainerProps as d, type ContainerMaxWidth as e, type SectionBackground as f, type SectionSpacing as g, type AnimatedDialogProps as h, type AnimatedDialogSize as i, type AlternatingBlocksProps as j, type AlternatingBlockSection as k, type AboutSplitHeroProps as l, type AboutMissionPrinciplesProps as m, type AboutExpandableValuesProps as n, type CommunityInitiativesProps as o, type AboutCultureTabsProps as p, type MediaHoverCtaItem as q, type MediaHoverCtaType as r, type FeatureShowcaseProps as s, type PatternName as t };
