function AnimationTextHead({ name, text, children }) {
  return (
    <div className="flex justify-center items-start relative w-fit">
      <div className="overflow-hidden mb-[4px] md:mb-[5px] lg:mb-[6px]">
        <p
          data-aos={name}
          className="text-[#3B3B3B] text-nowrap overflow-hidden text-[14px] sm:text-[16px] md:text-[18px] lg:text-[20px] font-bold"
        >
          {text}
        </p>
      </div>
      <div className="absolute bottom-0 right-1/2 translate-x-1/2 w-full flex justify-center">
        {children}
      </div>
    </div>
  );
}

export default AnimationTextHead;