Когда я достигаю точки останова 480 пикселей, правый отступ, который я установил для тела, исчезает. ⇐ CSS

[Anonymous]

В моем коде есть несколько статей, в которых отображается сетка. Я установил отступ тела на прописку: 0 1em; и минимальная ширина следующих элементов и классов - 450 пикселей;
может кто-нибудь сказать мне, почему отступы справа исчезают, когда я опускаюсь ниже точки останова 480 пикселей???
Вот скриншот моей страницы ниже точки останова 480 пикселей:
Скриншот моего веб-сайта:
Вот фрагмент моего CSS:

body{
padding: 0 1rem;
}

/* Media Queries */

.article-container {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(450px, auto));
column-gap: 30px;
row-gap: 50px;
}

/* Utilities */

nav,
.article-container,
article,
.jour-hero,
.about-hero{
margin: 0 auto;
}

footer,
nav,
.jour-hero,
.about-hero,
.hero{
min-width: 450px;
}

nav,
.jour-hero,
.about-hero,
.hero,
.article-container{
max-width: 1600px;
}


Подробнее здесь: https://stackoverflow.com/questions/783 ... y-disappea