body {
    background: #f1f0ee;
    color: #222;
    font-family: Arial, sans-serif;
}

.site-header {
    background: #f1f0ee;
}

.navbar-brand {
    color: #222 !important;
    font-weight: bold;
}

.nav-link {
    color: #222 !important;
}

.page-content {
    margin-top: 40px;
    margin-bottom: 40px;
}

.site-footer {
    background: #f1f0ee;
    color: #222;
    padding: 30px 0;
    margin-top: 50px;
}

.content-column {
    max-width: 850px;
}

.article-card {
    background: #f1f0ee;
    padding: 20px;
    border-radius: 8px;
    margin-bottom: 20px;
}

.article-card img {
    width: 100%;
    border-radius: 6px;
}

.article-title {
    margin-top: 15px;
}

.article-title a {
    text-decoration: none;
    color: #4ea5ae;
}

.article-title a:hover {
    text-decoration: underline;

}

a {
    text-decoration: none;
    color: #4ea5ae;
}

a:hover {
    text-decoration: underline;

}

.hero {
    background: #f1f0ee;
    padding: 40px;
    border-radius: 10px;
}

.nav-menu {
    flex-direction: row;
    /* пункты всегда в строку */
    gap: 1rem;
    margin-left: auto;
    /* прижать меню вправо на десктопе */
}

.h1,

.h4,
.h5,
.h6,
h1,

h4,
h5,
h6 {

    color: white;
    background: #4ea5ae;
}

@media (max-width: 575.98px) {
    .site-header .navbar-nav {
        flex: 0 0 100%;
        /* занять всю строку — перенос гарантирован */
        margin-left: 0;
        /* на новой строке выравнивание по левому краю */
    }

    .site-header .navbar-brand {
        margin: 0 auto;
        /* центрируем логотип */
    }
}