Как такое можно реализовать?
<div class="box" data-text="Заголовок">
<a href="url">
<h2 class="visually-hidden">Заголовок</h2>
</a>
<div>Описание</div>
<img src="url" alt="Описание картинки">
</div>
<body>
<header class="header">
<div class="container">
<h1 id="server-name">Old Memories</h1>
<a id="discord-link" href="https://discord.gg/WpWxxnrN">Наш Discord</a>
</div>
</header>
<main class="main">
<section class="about">
<h2 id="about-project">О проекте</h2>
<p>текст</p>
</section>
</main>
<script src="script.js"></script>
</body>
а стрелки как бы в контейнере
к этому при адаптиве не слипались
grid-column: span 2;
1fr 166px 1fr
547fx 1fr 547px
grid-template-rows вообще не нужно писать, высота контента в любой момент может измениться