/* Гранит62 — дополнительные стили (основные — инлайн в page.html) */

/* Шрифт Merriweather через system fallback (без CDN зависимости) */

/* Плавный скролл */
html { scroll-behavior: smooth; }

/* Ссылки в контенте */
.seo-content a {
    color: var(--primary);
    text-decoration: underline;
    text-underline-offset: 2px;
}
.seo-content a:hover { color: var(--primary-dark); }

/* Список в SEO-тексте */
.seo-content ul, .seo-content ol {
    background: var(--bg-white);
    border-left: 3px solid var(--accent);
    padding: 1rem 1rem 1rem 2rem;
    border-radius: 0 var(--radius) var(--radius) 0;
    margin: 1.25rem 0;
}
.seo-content li { margin-bottom: .625rem; }

/* Карточки каталога */
.catalog-card {
    background: var(--bg-white);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    padding: 1.5rem;
    transition: box-shadow .2s, transform .2s;
}
.catalog-card:hover {
    box-shadow: var(--shadow);
    transform: translateY(-2px);
}

/* Блок материалов */
.materials-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 1rem;
    margin: 1.5rem 0;
}
.material-item {
    background: var(--bg-white);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    padding: 1rem;
    text-align: center;
    font-size: .9375rem;
}
.material-item strong { display: block; color: var(--primary-dark); margin-bottom: .25rem; }
.material-item span { color: var(--text-light); font-size: .875rem; }

/* Контактный блок */
.contact-block {
    background: var(--primary);
    color: #fff;
    border-radius: var(--radius);
    padding: 2rem;
    text-align: center;
    margin: 2rem 0;
}
.contact-block h3 { color: var(--accent); margin-bottom: 1rem; }
.contact-block a {
    color: #fff;
    font-size: 1.25rem;
    font-weight: 700;
    display: block;
    margin: .5rem 0;
}
.contact-block a:hover { color: var(--accent); text-decoration: none; }

/* Highlight box */
.highlight-box {
    background: var(--accent-light);
    border: 1px solid var(--accent);
    border-radius: var(--radius);
    padding: 1.25rem 1.5rem;
    margin: 1.5rem 0;
}
.highlight-box p { margin: 0; color: var(--primary-dark); }

/* Адаптивные таблицы */
table {
    width: 100%;
    border-collapse: collapse;
    margin: 1.5rem 0;
    background: var(--bg-white);
    border-radius: var(--radius);
    overflow: hidden;
    font-size: .9375rem;
}
th {
    background: var(--primary);
    color: #fff;
    padding: .75rem 1rem;
    text-align: left;
    font-weight: 600;
}
td {
    padding: .625rem 1rem;
    border-bottom: 1px solid var(--border);
}
tr:last-child td { border-bottom: none; }
tr:hover td { background: var(--bg); }

@media (max-width: 600px) {
    table, thead, tbody, th, td, tr { display: block; }
    thead tr { position: absolute; top: -9999px; left: -9999px; }
    td { border: none; border-bottom: 1px solid var(--border); padding: .5rem 1rem; }
    td::before { content: attr(data-label); font-weight: 600; display: block; color: var(--primary-dark); }
}