スマホ時に、メディアの順番を「タイトル→画像→テキスト」の順番にしたい

前提

スマホ時に、メディアの順番を「タイトル→画像→テキスト」の順番にしたい

実現したいこと

PCでこのように表示されるもの（メディア）を、スマホでは「タイトル→写真→テキスト」の順番で表示されるようにしたいです。

発生している問題・エラーメッセージ

普段メディアを再現するときにはdisplay:flexを使って左右に並べています。もしスマホ版で「写真→タイトル→テキスト」の順番にしたいのであればflex-direction:columnにすれば良いので問題ないのですが、質問の順番にするとなると写真をタイトルとテキストの間に割り込ませなければならないため実装の方法に迷っています。

質問したいこと

①flexを用いて質問通りの順番にするにはどのように考えれば良いでしょうか？
②flexを用いないとすればどのような方法が考えられるでしょうか？