/* Стили для якорных ссылок */
section {
    scroll-margin-top: 80px; /* Соответствует высоте хедера */
    padding-top: 20px; /* Отступ сверху */
}

/* Медиа-запрос для мобильных устройств */
@media (max-width: 768px) {
    section {
        scroll-margin-top: 60px; /* Соответствует новой высоте хедера */
    }
    
    html {
        scroll-padding-top: 60px; /* Обновленный scroll-padding */
        -webkit-overflow-scrolling: touch; /* Фикс для плавной прокрутки на iOS */
    }
}

body {
    scroll-padding-top: 80px; /* Добавляем scroll-padding для всей страницы */
}

/* Стили для якорных ссылок и общие стили для блога */

/* Стили для якорных ссылок */
a[href^="#"] {
    scroll-margin-top: 80px;
}

/* Исправление стилей для изображений в статьях */
.article-image {
    width: 100%;
    height: auto;
    border-radius: 10px;
    margin: 20px 0;
    text-align: center;
    overflow: hidden;
}

.article-image img {
    max-width: 100%;
    height: auto;
    display: block;
    margin: 0 auto;
}

/* Медиа-запросы для адаптивности изображений */
@media (max-width: 768px) {
    .article-image {
        margin: 15px 0;
    }
}

/* Стили для продуктовых изображений */
.product-image-container img {
    max-width: 100%;
    height: auto;
    display: block;
    margin: 0 auto;
}