/* /transition — the acquisition notice.
 *
 * Built on the same tokens as the Webflow marketing sheets (--green-*, Akkurat,
 * Ariata) so it reads as part of the site rather than a bolted-on page. Layout
 * is its own, because nothing in the Webflow export resembles a dated notice
 * with a timeline.
 */

.transition-page {
	font-family: Akkurat, "Akkurat Fallback", sans-serif;
	color: var(--type-base, #3d4249);
}

.transition-hero {
	background-color: var(--green-100, #e8f2f0);
	padding: 72px 24px 64px;
	text-align: center;
}

.transition-hero-inner {
	max-width: 760px;
	margin-inline: auto;
}

.transition-eyebrow {
	color: var(--green-300, #1c9a49);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	margin: 0 0 16px;
}

.transition-title {
	font-family: "Ariata Display (Demo)", "Ariata Fallback", Georgia, serif;
	color: var(--green-800, #1c5c50);
	font-size: clamp(34px, 5vw, 55px);
	font-weight: 900;
	line-height: 1.08;
	margin: 0 0 16px;
}

.transition-lede {
	color: var(--green-600, #386f65);
	font-size: clamp(18px, 2.2vw, 24px);
	font-weight: 700;
	line-height: 1.35;
	margin: 0;
}

.transition-published {
	color: var(--gray-500, #6b7280);
	font-size: 13px;
	margin: 24px 0 0;
}

.transition-body {
	max-width: 760px;
	margin-inline: auto;
	padding: 56px 24px 96px;
}

.transition-body p {
	font-size: 18px;
	line-height: 1.6;
	margin: 0 0 20px;
}

.transition-section {
	margin-top: 56px;
}

.transition-section:first-of-type {
	margin-top: 0;
}

.transition-h2 {
	font-family: "Ariata Display (Demo)", "Ariata Fallback", Georgia, serif;
	color: var(--green-800, #1c5c50);
	font-size: clamp(26px, 3.2vw, 36px);
	font-weight: 900;
	line-height: 1.15;
	margin: 0 0 20px;
}

.transition-h3 {
	color: var(--green-800, #1c5c50);
	font-size: 20px;
	font-weight: 700;
	margin: 32px 0 12px;
}

.transition-kicker {
	color: var(--green-300, #1c9a49);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	margin: 0 0 8px;
}

/* The two headline changes, called out so they can't be missed. */
.transition-changes {
	list-style: none;
	margin: 0 0 24px;
	padding: 0;
	display: grid;
	gap: 16px;
}

.transition-change {
	background: #fff;
	border: 1px solid var(--green-200, #a4c7be);
	border-left: 4px solid var(--green-600, #386f65);
	border-radius: 8px;
	padding: 20px 24px;
}

.transition-change strong {
	color: var(--green-800, #1c5c50);
	display: block;
	font-size: 17px;
	margin-bottom: 6px;
}

.transition-change p {
	margin: 0;
	font-size: 17px;
	line-height: 1.55;
}

/* Key dates */
.transition-dates {
	list-style: none;
	margin: 0;
	padding: 0;
	border-top: 1px solid var(--green-200, #a4c7be);
}

.transition-date {
	display: flex;
	gap: 24px;
	align-items: baseline;
	padding: 18px 4px;
	border-bottom: 1px solid var(--green-200, #a4c7be);
}

.transition-date dt {
	color: var(--green-800, #1c5c50);
	font-weight: 700;
	font-size: 17px;
	flex: 0 0 190px;
}

.transition-date dd {
	margin: 0;
	font-size: 17px;
	line-height: 1.5;
}

.transition-list {
	margin: 0 0 20px;
	padding-left: 22px;
}

.transition-list li {
	font-size: 18px;
	line-height: 1.6;
	margin-bottom: 10px;
}

.transition-footnote {
	color: var(--gray-500, #6b7280);
	font-size: 13px;
	line-height: 1.5;
	margin: 16px 0 0;
}

/* Communications log */
.transition-comms {
	list-style: none;
	margin: 0;
	padding: 0;
}

.transition-comm {
	padding: 20px 0;
	border-bottom: 1px solid var(--green-200, #a4c7be);
}

.transition-comm:first-child {
	border-top: 1px solid var(--green-200, #a4c7be);
}

.transition-comm-date {
	color: var(--gray-500, #6b7280);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	margin: 0 0 6px;
}

.transition-comm-title {
	color: var(--green-800, #1c5c50);
	font-size: 18px;
	font-weight: 700;
	margin: 0 0 4px;
}

.transition-comm-summary {
	margin: 0;
	font-size: 16px;
	line-height: 1.5;
}

.transition-contact {
	background: var(--lavender-100, #f4f8ff);
	border-radius: 10px;
	padding: 28px 32px;
	margin-top: 24px;
}

.transition-email {
	display: inline-block;
	color: var(--green-800, #1c5c50);
	font-size: 20px;
	font-weight: 700;
	text-decoration: none;
	border-bottom: 2px solid var(--green-600, #386f65);
	margin: 4px 0 12px;
}

.transition-email:hover {
	opacity: 0.75;
}

.transition-back {
	display: inline-block;
	margin-top: 48px;
	color: var(--green-600, #386f65);
	font-weight: 700;
	font-size: 15px;
	text-decoration: none;
}

.transition-back:hover {
	text-decoration: underline;
}

@media (max-width: 600px) {
	.transition-date {
		flex-direction: column;
		gap: 4px;
	}

	.transition-date dt {
		flex-basis: auto;
	}

	.transition-contact {
		padding: 22px 20px;
	}
}
