/* main.css — overrides ONLY for index.html
Требование: body[data-page="index"] в .
*/
:root {
/* единая высота fixed header на десктопе (как в style.css) */
--hdr-h: 72px;
/* насколько близко к хедеру начинается контент на главной */
--index-top-gap: 18px;
/* вертикальный ритм секций на главной */
--index-section-gap: 34px;
}
/* =========================
INDEX — PAGE GEOMETRY
========================= */
body[data-page="index"] .page {
/* убираем “второй” верхний отступ от page (его роль возьмёт main) */
padding-top: 0 !important;
/* боковые/низ оставляем как было по сетке сайта */
padding-left: 20px;
padding-right: 20px;
padding-bottom: 48px;
}
/* Главный фикс: вместо глобального padding-top (72+32) ставим (72+gap) */
@media (min-width: 769px) {
body[data-page="index"]>.page>main {
padding-top: calc(var(--hdr-h) + var(--index-top-gap)) !important;
}
}
/* =========================
INDEX — HERO CLEANUP
========================= */
body[data-page="index"] main {
gap: var(--index-section-gap);
}
/* У тебя было margin:-23px, из-за этого “ломается” ритм при разных шрифтах/рендере */
body[data-page="index"] .hero-sub {
margin: 10px 0 20px !important;
max-width: 520px;
}
/* Чуть плотнее бейджи, чтобы верх не выглядел “пустым” */
body[data-page="index"] .hero-badges {
margin: 0 0 10px;
}
/* Кнопка — не на всю ширину на десктопе (сейчас растягивается “как мобилка”) */
@media (min-width: 769px) {
body[data-page="index"] .hero-cta .btn {
width: auto;
min-width: 340px;
}
}
/* Карточка справа — чуть стабильнее по высоте/внутреннему ритму */
body[data-page="index"] .hero-card {
padding: 18px 18px 16px;
}
/* =========================
INDEX — FOOTER SPACING
========================= */
body[data-page="index"] footer.site-footer {
/* чтобы футер не “прилипал” и не выглядел ниже/выше на разных страницах */
margin-top: 28px;
}