/* LoudMemories — the "About" page: the site's history, and the running list
   of major updates underneath it. Page-only rules; the hero, section heads
   and body typography come from content/policy/css/policy.css, which this
   page shares rather than duplicates. */

/* ------------------------------------------------------------- timeline */

.ab-timeline {
	position: relative;
	margin: 0;
	padding: 0;
	list-style: none;
	max-width: var(--doc-measure);
}
.ab-timeline::before {
	content: "";
	position: absolute;
	top: 6px;
	bottom: 6px;
	left: 3px;
	width: 1px;
	background: var(--lm-line-strong);
}
.ab-timeline > li {
	position: relative;
	margin: 0 0 clamp(1.75rem, 5vw, 2.25rem);
	padding: 0 0 0 clamp(1.5rem, 6vw, 2.25rem);
}
.ab-timeline > li:last-child { margin-bottom: 0; }
.ab-timeline > li::before {
	content: "";
	position: absolute;
	top: 7px;
	left: 0;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: var(--lm-bg);
	border: 1px solid var(--lm-green-lt);
}
.ab-timeline > li.is-current::before {
	background: var(--lm-green-lt);
	box-shadow: 0 0 0 3px rgba(var(--lm-green-lt-rgb), .22);
}
.ab-timeline .ab-year {
	display: block;
	margin: 0 0 4px;
	font-family: var(--lm-mono);
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--lm-green-lt);
}
.ab-timeline h3 {
	margin: 0 0 8px;
	font-family: var(--lm-sans);
	font-size: 1.0625rem;
	font-weight: 700;
	letter-spacing: .01em;
	color: var(--lm-ink);
}
.ab-timeline p {
	margin: 0;
	font-size: clamp(0.9375rem, 3.4vw, 1rem);
	line-height: 1.75;
	color: var(--lm-muted);
	text-wrap: pretty;
}