pointer-events: none を扱った記事も、リンクを無効にするとか、クリックを無効にするとか書かれていて、pointer-eventsについての説明として間違いとまでは言えないですが、正確ではないので、できるだけ正確な解説をします。
まずMDNの解説は
特定のグラフィック要素がマウスイベントの対象になる可能性のある環境 (存在する場合) を設定します。
いまいちよくわかりませんね。
自分なりに説明すれば
その要素のマウスやタッチで反応する範囲を定義するプロパティ
ってところです。
htmlより細かい指定のできるsvgを例にすると直感的でわかりやすいです。
pointer-events: fill を指定すると、塗られた部分のみポインターに反応します。
つまり pointer-events: none はポインターに反応する範囲は一切無し、見えてはいるけどポインターに対しては存在しないかのようにふるまいます。
そのためポインターによるホバーやクリックには反応しませんが、キーボードのタブによるフォーカスとエンターによるクリックはできます。
ポインターでクリックしても、ないものとされるので配下がクリックされることになります。
イベントまわりを理解してたら、一見、内部的にはpreventDefault,stopPropagationしてイベントを無効してるようにも見えますが、そもそもイベントの発火自体していません。