klz-cables.com/components/blog/SplitHeading.tsx

'use client';

import React from 'react';

interface SplitHeadingProps {
  children: React.ReactNode;
  className?: string;
  id?: string;
}

export default function SplitHeading({
  children,
  className = '',
  id,
  level: Level = 'h2',
}: SplitHeadingProps & { level?: any }) {
  return (
    <div id={id} className={className}>
      <Level className="text-xl md:text-2xl font-bold leading-tight text-text-primary">
        {children}
      </Level>
    </div>
  );
}