I do understand why this error occured, it's because of this part:

        <p className="text-xl text-white px-6 py-4 w-[45%]">
          A dedicated{" "}
          <Tooltip tooltip="My cool tooltip!">
            <span className="text-primary">programmer</span>
          </Tooltip>{" "}
          with a penchant for turning ideas into reality through elegant lines
          of code. Embracing challenges and seeking innovative solutions in the
          ever-evolving landscape of technology.
        </p>

In here, there's a Tooltip tag inside a p tag, and the tooltip tag contains divs:

  return (
    <div onMouseEnter={({ clientX }) => ...>
      <span
        ref={tooltipRef}
        className="..."
      >
        {tooltip}
      </span>
      {children}
    </div>
  );

Now, how do I make it work?