/* pages.css — селекторы под конкретные страницы. Страница помечается атрибутом на : . Общее сюда не класть, ему место в components.css. */ /* --- Главная --- */ [data-page='home'] .hero { padding-block: var(--space-7) var(--space-8); background: linear-gradient(180deg, var(--color-surface) 0%, var(--color-bg) 100%); border-bottom: 1px solid var(--color-border); } [data-page='home'] .hero-lead { font-size: var(--text-lg); color: var(--color-ink-muted); max-width: 56ch; } [data-page='home'] .hero-actions { display: flex; flex-wrap: wrap; gap: var(--space-3); margin-top: var(--space-5); } /* --- Контакты --- */ [data-page='kontakty'] .contact-layout { display: grid; gap: var(--space-6); grid-template-columns: 1fr; } @media (min-width: 900px) { [data-page='kontakty'] .contact-layout { grid-template-columns: 3fr 2fr; } } /* --- 404 --- */ [data-page='404'] .section { text-align: center; } [data-page='404'] p { margin-inline: auto; }