/*
 * About Us page (setup/content/about-us.php). Sizes and spacing were measured on the Squarespace page
 * at 1440px and 390px wide; type sizes scale linearly between the two, like Squarespace's.
 */
.sr-about-sections {
	--sr-about-gutter: 3vw;
	--sr-about-h2: clamp(35.44px, 31.11px + 1.111vw, 47.1px);
	--sr-about-h3: clamp(28.96px, 26.07px + 0.7406vw, 36.74px);
	--sr-about-text: clamp(21.4px, 20.2px + 0.3086vw, 24.64px);
	--sr-about-small: clamp(18.16px, 17.68px + 0.1234vw, 19.46px);
}

/* Sections sit flush against each other and span the page. */
.wp-block-post-content.sr-about-sections > * + * {
	margin-block-start: 0;
}

.sr-about-sections .sr-about-section {
	margin-block: 0;
	padding: 95px var(--sr-about-gutter);
}

.sr-about-sections .sr-about-story {
	padding-block: 112px;
}

.sr-about-sections .sr-about-board {
	padding-block: 126px 127px;
}

.sr-about-sections .sr-about-principles,
.sr-about-sections .sr-about-scholar {
	padding-bottom: 112px;
}

/* Type. */
.sr-about-sections .sr-about-section :where(h2, h3, p, figure, .wp-block-columns, .wp-block-file) {
	margin-block: 0;
}

/* Squarespace wraps lines greedily; the parent theme balances headings and "prettifies" paragraphs. */
.sr-about-sections .sr-about-section :is(h2, h3, p) {
	text-wrap: wrap;
}

.sr-about-sections .sr-about-section h2 {
	font-size: var(--sr-about-h2);
	line-height: 1.3;
}

.sr-about-sections .sr-about-section h3 {
	font-size: var(--sr-about-h3);
	line-height: 1.333;
}

.sr-about-sections .sr-about-section p {
	font-size: var(--sr-about-text);
	line-height: 1.6;
}

.sr-about-sections .sr-about-section p.sr-about-small {
	font-size: var(--sr-about-small);
}

/* Vertical rhythm (Squarespace: headings 32px below, paragraphs 16px apart). */
.sr-about-sections .sr-about-section h3 + h3,
.sr-about-sections .sr-about-section :is(h2, h3) + p {
	margin-top: 32px;
}

.sr-about-sections .sr-about-section p + p {
	margin-top: 16px;
}

/* Squarespace has an empty line before these paragraphs. */
.sr-about-sections .sr-about-story p + p {
	margin-top: calc(16px + 1.6em);
}

.sr-about-sections .sr-about-scholar p.sr-about-contact {
	margin-top: calc(32px + 1.6em);
}

/* Our Story: image on the left, text on the right. */
.sr-about-sections .sr-about-story .wp-block-columns {
	gap: 11.1%;
}

.sr-about-story .wp-block-image img {
	display: block;
}

/* Core Principles: photo under a dark overlay, three columns. */
.sr-about-sections .sr-about-principles {
	min-height: 0;
	align-items: flex-start;
}

.sr-about-sections .sr-about-principles .wp-block-columns {
	gap: 34px;
	margin-top: 34px;
}

.sr-about-sections .sr-about-principles p + h3 {
	margin-top: 78px;
}

/* Year in Review: title, then a row with a PDF icon, the file name and "Download", then the viewer. */
.sr-about-sections .sr-about-scholar p.sr-about-report-title {
	margin-top: 34px;
	font-size: 20px;
	line-height: 26px;
}

.sr-about-sections .sr-about-scholar .wp-block-file.sr-about-report {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	margin-top: 32px;
	font-size: 15px;
	line-height: 20px;
}

.sr-about-report::before {
	content: "PDF";
	display: flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	width: 30px;
	height: 38px;
	margin-right: 16px;
	border: 2px solid #e02b3a;
	border-radius: 4px 9px 4px 4px;
	color: #e02b3a;
	font-family: var(--wp--preset--font-family--body);
	font-size: 8px;
	font-weight: 700;
	letter-spacing: 0.05em;
}

.sr-about-report > a:not(.wp-block-file__button) {
	color: inherit;
	text-decoration: none;
}

.sr-about-sections .sr-about-report .wp-block-file__button {
	margin-left: auto;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: none;
	color: inherit;
	font-family: var(--wp--preset--font-family--body);
	font-size: 13px;
	line-height: 20px;
	text-decoration: none;
}

.sr-about-sections .sr-about-report .wp-block-file__embed {
	order: 1;
	flex-basis: 100%;
	box-sizing: border-box;
	height: auto !important; /* The block saves a fixed 600px height; the live viewers keep the page's proportions. */
	aspect-ratio: 677 / 954;
	margin: 16px 0 0;
	background: #d1d1d1;
}

/* Phone (the width where columns stack). */
@media (max-width: 781px) {
	.sr-about-sections {
		--sr-about-gutter: 6vw;
	}

	.sr-about-sections .sr-about-section {
		padding-block: 76px;
	}

	.sr-about-sections .sr-about-story,
	.sr-about-sections .sr-about-principles {
		padding-block: 77px;
	}

	.sr-about-sections .sr-about-board {
		padding-block: 127px 161px;
	}

	.sr-about-sections .sr-about-story .wp-block-columns,
	.sr-about-sections .sr-about-principles .wp-block-columns {
		gap: 34px;
	}

	.sr-about-sections .sr-about-principles p + h3 {
		margin-top: 77px;
	}
}