/* assets/css/front-page.css */

/* Общая структура заголовков секций (промокоды / карточки предложений) —
   отступы и фон идентичны, различаются только цвета. */
.ax-heading {
	margin-top: 20px;
	margin-bottom: 10px;
}

/* Заголовок и подзаголовок вместе, в одном блоке фона — ограничен шириной
   макета страницы (1120px через родительский .site-container), а не всей
   шириной экрана. */
.ax-heading__band {
	background: #f2f2f2;
	width: 100%;
	box-sizing: border-box;
	padding: 5px;
}

.ax-heading__title {
	margin: 5px 0;
	font-size: 16px; /* без этого h1/h2 использует собственный крупный шрифт браузера по умолчанию для расчёта высоты строки, даже когда видимый текст внутри мельче через дочерние span */
	line-height: 1.2;
	text-align: center;
}

.ax-heading__label,
.ax-heading__date {
	font-size: 16px;
	font-weight: 700;
}
.ax-heading__date {
	margin-left: 6px; /* отступ между двумя частями заголовка — не указан явно */
}

/* white-space: pre-line — перенос строки там, где в переводимой строке
   стоит настоящий символ новой строки, без внедрения HTML-тегов в текст. */
.ax-heading__subtitle {
	margin: 0;
	text-align: center;
	font-size: 11px;
	font-weight: 400;
	color: #000;
	white-space: pre-line;
}

/* Промокоды: rgb(0,91,160) на заголовке, rgb(1,115,200) на дате —
   тёмный/светлый парный оттенок синего, как в цветах категории меню.
   Ссылка в подзаголовке цвет не переопределяет — используется общий
   цвет ссылок сайта (см. style.css). */
.ax-heading--promo .ax-heading__label { color: rgb(0, 91, 160); }
.ax-heading--promo .ax-heading__date { color: rgb(1, 115, 200); }

/* Карточки предложений: rgb(59,114,0)/rgb(69,133,0) — та же пара
   тёмный/светлый зелёный, что и в остальном сайте (#3b7200/#458500). */
.ax-heading--offer .ax-heading__label { color: rgb(59, 114, 0); }
.ax-heading--offer .ax-heading__date { color: rgb(69, 133, 0); }

/* Витрина блога: фирменный зелёный ("Aherbia green", #458500) —
   заголовок цветом, фон — тот же оттенок почти прозрачным тоном (6%). */
.ax-heading--blog .ax-heading__band { background: rgba(69, 133, 0, 0.06); }
.ax-heading--blog .ax-heading__label { color: #458500; }