/**
 * OSHIDA — about / manifesto.
 *
 * @figma 2014:2499  Frame 334 — 1151.54 x 500 at (144.23, 1574), r=50, hairline
 * @figma 2014:2500  copy 812.43 x 350 at parent (60, 75) — 18px on 35px leading
 * @figma 2014:2501  the arch mark, 169.12 x 154.95, at the inline START
 * @figma 2014:2614  Group 387 — the statement, 869.96 x 255 at (284.52, 2242.64)
 *
 * The card is 60px padding all round; inside it the mark leads (inline start,
 * i.e. physical right) and the copy follows in an 812px column, which is what
 * the measured boxes give: mark 1066.65–1235.77, copy 204.23–1016.66, card
 * 144.23–1295.77.
 *
 * Owner: work package C2.
 */

.o-about-manifesto {
	padding-block-start: var(--o-about-gap);
}

.o-about-manifesto__card {
	display: flex;
	align-items: center;
	gap: clamp(24px, 3.4vw, 49px); /* 1066.65 - 1016.66 */
	padding: clamp(28px, 4.2vw, 60px);
	border: var(--o-line-width) solid var(--o-line);
	border-radius: var(--o-radius-xl);
	background-color: var(--o-veil-card);
	box-shadow: var(--o-shadow-panel);
}

.o-about-manifesto__mark {
	flex: none;
	inline-size: clamp(80px, 11.7vw, 169px);
}

.o-about-manifesto__mark-art {
	display: block;
	inline-size: 100%;
}

.o-about-manifesto__copy {
	flex: 1 1 auto;
	min-inline-size: 0;
	font-size: var(--o-fs-md);
	font-weight: var(--o-fw-extralight);
	line-height: var(--o-leading-card);
	letter-spacing: var(--o-track-tight);
	text-align: start;
}

.o-about-manifesto__copy p {
	margin: 0;
}

.o-about-manifesto__copy p + p {
	margin-block-start: var(--o-leading-card);
}

.o-about-manifesto__copy strong {
	font-weight: var(--o-fw-black);
}

.o-about-manifesto__accent {
	color: var(--o-gold);
}

/* --------------------------------------------------------------------------
 * The statement under the card — @figma 2014:2614, centred, 870px column.
 * -------------------------------------------------------------------------- */

.o-about-manifesto__statement {
	max-inline-size: 870px;
	margin: 0;
	margin-block-start: clamp(64px, 11.7vw, 169px); /* 2242.64 - 2074 */
	margin-inline: auto;
	font-size: var(--o-fs-md);
	font-weight: var(--o-fw-extralight);
	line-height: 51px; /* @figma 2014:2615 — 255 / 5 lines */
	text-align: center;
	text-wrap: pretty;
}

.o-about-manifesto__statement strong {
	font-weight: var(--o-fw-black);
}

@media (max-width: 899px) {
	.o-about-manifesto__card {
		flex-direction: column;
		align-items: center;
		text-align: start;
	}

	.o-about-manifesto__statement {
		line-height: var(--o-lh-body);
	}
}
