「詳細はこちら」で記事の高さが広がると、下のコンテンツにかぶる（Readmore.js使用）

前提・実現したいこと

記事に「詳細はこちら」ボタンをつけて記事の続きが読めるようにしたいと思っています。（アコーディオンのような）

現在の状況は、Readmore.jsを使って、記事に「詳細はこちら」ボタンをつけて、続きの記事を開閉して読めるようにしました。

発生している問題

タイトル1
3列2行（display: grid;を使いました）
↓続きを読むで高さが広がるとタイトル2も下に移動するかと思いきや、動かず、かぶってしまいます（質問内容）

タイトル2
3列2行（display: grid;を使いました）

タイトル3
3列2行（display: grid;を使いました）

3列2行は、「詳細はこちら」で記事の高さが広がると、合わせて移動してくれるんですが
タイトル2、3が移動してくれません。

Readmore.jsには以下のように記述しております！

$(function () {
	$('article').readmore({
		speed: 1000,
		collapsedHeight: 0,
		moreLink: '<a href="#"><button class="readmore text-center">詳細はこちら</button></a>',
		lessLink: '<a href="#"><button class="readmore-close text-center">詳細を閉じる</a>'
	});
});