/* ============================================================
   1. ОБЩАЯ БАЗА (Глобальные настройки)
   ============================================================ */
/* Убираем стандартные отступы, создающие зазоры */
.header, .container-nav, .container-header {
    margin-bottom: 0 !important;
    margin-top: 0 !important;
}

*, *:before, *:after { 
    box-sizing: border-box !important; 
}

body { 
    background-color: #4a4d4a !important; 
    margin: 0; 
}

.main-column, .site-grid { 
    background-color: #F1F1D8 !important;
}

.navbar-brand, .header-title, .site-description, .container-header, .breadcrumb { 
    display: none !important; 
}
.container-header .grid-child {
    padding: 0 0 5px; margin-top: -5px; 
    background-color: #000 !important;
}

.card-header {
    padding: var(--card-cap-padding-y)var(--card-cap-padding-x);
    color: var(--card-cap-color);
    background-color: var(--card-cap-bg);
    border-bottom: var(--card-border-width)solid var(--card-border-color);
    margin-bottom: 0;
    color: #555 !important;
    text-align: center !important;
    font: 800 12pt "Open Sans", sans-serif !important;
    border-top: 3px solid #8b0000 !important;
}

.card-body {
    background-color: #FAFAE1 !important; 
}

.article-info {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 18px !important;
    list-style: none !important;
    padding: 5px 0 !important;
    margin: 0 0 5px 0 !important;
    border-bottom: 1px solid rgba(0,0,0,0.1);
}

.article-info dd, .article-info dt {
    margin: 0 !important;
    font-size: 0.9rem !important;
    color: #666 !important;
	text-align: center;
}

.com-content-article__body, [itemprop="articleBody"] {
    font-family: "Open Sans", sans-serif !important;
    font-size: 1.1rem !important;
    line-height: 1.6 !important; /* Чуть увеличил для комфорта */
    color: #333 !important;
}

/* ФУТЕР: Растяжка фона на весь экран */
.footer {
    display: block !important;
    width: 100% !important; /* Растягиваем на всю ширину браузера */
    max-width: 100% !important;
    background: #000 url('/images/banners/footer.png') no-repeat center center !important;
    margin: 0 !important;
    padding: 8px 0 !important;
}

/* Контент внутри футера оставляем в границах сайта */
.footer .grid-child {
    max-width: 1320px !important;
    margin: 0 auto !important;
    color: #fff !important;
}

a:link, a:visited {
    text-decoration: none; 
    color: #444 !important;
}

a:hover {
    text-decoration: underline;
}

/* ============================================================
   2. ДЕСКТОП (ПК — от 992px)
   ============================================================ */
@media (min-width: 992px) {
    
    header.header, .container-nav, .site-grid {
        display: block !important;
        width: 1320px !important;
        max-width: 1320px !important; 
        margin-left: auto !important;
        margin-right: auto !important;
}

    header.header {
        height: 150px !important;
        background: #000 url('/images/banners/shichan_desktop.png') no-repeat center center !important;
        background-size: cover !important;
}

/* МЕНЮ: Песочный цвет */
    .container-nav {
        background-color: #1a1a1a !important;
        border-top: 4px solid #8b0000 !important;
}

    .container-nav .metismenu a, .container-nav .navigation a {
        color: #C5C4A4 !important; 
        text-decoration: none !important;
}

.metismenu.mod-menu .metismenu-item {
        flex-wrap: wrap;
        align-items: center;
        padding: 0 1.2em;
        font-size: 1.1em;
        line-height: 1.1;
        display: flex;
}

.container-header .metismenu > li + li {
        margin-left: 0; background-color: #000;
}
    .site-grid {
        margin-top: -100px !important; 
        display: grid !important;
        gap: 30px !important;
        padding: 0 !important;
}

    aside .moduletable {
        background-color: #ffffff !important;
        padding: 20px !important;
        margin-bottom: 25px !important;
        border-radius: 8px !important;
        box-shadow: 0 4px 12px rgba(0,0,0,0.08) !important;
}

    aside .card-title {
        color: #2C1715 !important;
        font-size: 1.2rem !important;
        text-transform: uppercase !important;
        border-bottom: 2px solid #8b0000 !important;
        padding-bottom: 8px !important;
        text-align: center !important; 
}

    h1, .h1, h2, .h2 {
        color: #2C1715 !important;
        text-align: center !important;
        font: 800 18pt "Open Sans", sans-serif !important;
        border-top: 3px solid #8b0000 !important;
        padding-top: 10px;
        text-decoration: none;
}

/* Цвет только для названий статей в блоге и внутри материала */
h1, .h1, 
h2.item-title, 
.page-header h1, 
.com-content-category-blog__item-title a {
        color: #8b0000 !important; /* Здесь ставьте любой нужный цвет для заголовков */
        text-decoration: none !important;
}

/* Цвет только для пунктов ГЛАВНОГО МЕНЮ */
.metismenu.mod-menu a {
        color: #C5C4A4 !important; /* Ваш песочный/бежевый цвет для меню */
        padding: 0;
}

.metismenu.mod-menu a:hover {
        color: #ffffff !important; /* Цвет при наведении в меню */ }
}

/* ============================================================
   3. МОБИЛЬНАЯ ВЕРСИЯ (До 991px)
   ============================================================ */
@media (max-width: 991px) {
    .container-header, header.header { display: block !important; }

    header.header {
        height: 140px !important;
        border-top: 4px solid #8b0000 !important;
        background: #000 url('/images/banners/shichan_mobile.png') no-repeat center center / contain !important;
}

    .site-grid {
        display: flex !important;
        flex-direction: column !important;
        padding: 0 15px 20px !important;
}

    .container-nav {
        position: fixed !important; 
        bottom: 0; 
        left: 0; 
        width: 100% !important;
        z-index: 10000 !important; 
        background: #000 url('/images/banners/footer.png') no-repeat center center !important;
}
    h1, .h1, h2, .h2 {
        color: #2C1715 !important;
        text-align: center !important;
        font: 800 18pt "Open Sans", sans-serif !important;
        text-decoration: none;
        border-top: 3px solid #8b0000 !important;
        padding-top: 4px !important;
}
}