/* Летопись на странице «Наши истоки».
 *
 * Хроника, а не карточки: одна вертикальная линия, годы засечками, записи
 * подряд сверху вниз. Палитра фирменная — бордо #882426, графит #1c2023,
 * подложка #f7f7f7, как в соседних блоках сайта.
 *
 * Кириллица: интерлиньяж не ниже 1.6, межбуквенное не сжимаем.
 */

.ced-chron {
	--chron-ink: #1c2023;
	--chron-muted: #5f5f5f;   /* 7,0:1 на белом */
	--chron-accent: #882426;
	--chron-rule: #e2ddd6;

	max-width: 50rem;
	margin: 0 auto;
	padding: 2.5rem 0 0;
	color: var(--chron-ink);
}

.ced-chron__head {
	margin: 0 0 1.75rem;
}

.ced-chron__title {
	margin: 0;
	font-size: clamp(22px, 2.6vw, 30px);
	line-height: 1.25;
	font-weight: 700;
	color: var(--chron-ink);
}

/* Короткая черта под заголовком — тот же приём, что у «Наших контактов». */
.ced-chron__title::after {
	content: "";
	display: block;
	width: 2.5rem;
	height: 3px;
	margin: 0.75rem 0 0;
	background: var(--chron-accent);
}

.ced-chron__lead {
	margin: 0.9rem 0 0;
	font-size: 15px;
	line-height: 1.7;
	color: var(--chron-muted);
}

.ced-chron__list {
	margin: 0;
	padding: 0 0 0 1.75rem;
	list-style: none;
	border-left: 1px solid var(--chron-rule);
}

.ced-chron__year {
	position: relative;
	margin: 2rem 0 1.1rem;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.08em;
	color: var(--chron-muted);
}

.ced-chron__year:first-child {
	margin-top: 0;
}

/* Засечка года на линии. */
.ced-chron__year::before {
	content: "";
	position: absolute;
	left: -1.75rem;
	top: 0.5em;
	width: 0.85rem;
	height: 1px;
	background: var(--chron-rule);
}

.ced-chron__item {
	position: relative;
	display: flex;
	flex-wrap: wrap;
	gap: 0.35rem 1.25rem;
	padding: 0 0 1.6rem;
}

/* Точка записи — на самой линии. */
.ced-chron__item::before {
	content: "";
	position: absolute;
	left: calc(-1.75rem - 4px);
	top: 0.55em;
	width: 9px;
	height: 9px;
	border-radius: 50%;
	background: #fff;
	box-shadow: 0 0 0 2px var(--chron-accent);
}

.ced-chron__date {
	flex: 0 0 6.5rem;
	font-size: 14px;
	line-height: 1.6;
	color: var(--chron-muted);
	white-space: nowrap;
}

.ced-chron__body {
	flex: 1 1 20rem;
	min-width: 0;
}

.ced-chron__link {
	display: inline-block;
	font-size: 17px;
	line-height: 1.45;
	font-weight: 600;
	color: var(--chron-ink);
	text-decoration: none;
	border-bottom: 1px solid transparent;
	transition: color 0.18s ease, border-color 0.18s ease;
}

.ced-chron__link:hover,
.ced-chron__link:focus {
	color: var(--chron-accent);
	border-bottom-color: var(--chron-accent);
}

.ced-chron__text {
	/* Мера строки: у записей без миниатюры текст иначе тянется на всю
	   колонку и доходит до 86 знаков при норме 60–75. */
	max-width: 34em;
	margin: 0.4rem 0 0;
	font-size: 15px;
	line-height: 1.7;
	color: var(--chron-muted);
}

.ced-chron__aside {
	flex: 0 0 auto;
	order: 3;
}

.ced-chron__thumb {
	display: block;
	width: 96px;
	height: 72px;
	object-fit: cover;
	border-radius: 2px;
}

/* Телефон: дата встаёт над заголовком, миниатюра уходит под текст. */
@media (max-width: 575px) {
	.ced-chron {
		padding-top: 2rem;
	}

	.ced-chron__list {
		padding-left: 1.35rem;
	}

	.ced-chron__item::before {
		left: calc(-1.35rem - 4px);
	}

	.ced-chron__year::before {
		left: -1.35rem;
	}

	.ced-chron__date {
		flex-basis: 100%;
	}

	.ced-chron__aside {
		flex-basis: 100%;
		order: 4;
		margin-top: 0.6rem;
	}

	.ced-chron__thumb {
		width: 120px;
		height: 90px;
	}
}

/* Переход в рубрику: вся летопись целиком, включая то, что не поместилось. */
.ced-chron__more {
	margin: 0.5rem 0 0;
	padding-left: 1.75rem;
}

.ced-chron__all {
	display: inline-block;
	padding: 0.55rem 1.1rem;
	border: 1px solid var(--chron-accent);
	border-radius: 2px;
	font-size: 14px;
	line-height: 1.5;
	font-weight: 600;
	color: var(--chron-accent);
	text-decoration: none;
	transition: background-color 0.18s ease, color 0.18s ease;
}

.ced-chron__all:hover,
.ced-chron__all:focus {
	background: var(--chron-accent);
	color: #fff;
}

@media (max-width: 575px) {
	.ced-chron__more {
		padding-left: 1.35rem;
	}
}