/*
 * About page (/about/): why AWR exists, what it believes, who is behind it.
 * Builds on awr-homepage.css (.awr-hs tokens, eyebrow, titles, leads, buttons, CTA band).
 *
 * Visual language: circles are people, lines and squares are data.
 * Motion is progressive enhancement: start states apply only under html.awr-about-js
 * (set by awr-about.js). Without JS or with reduced motion, everything is final.
 */

.awr-about h1, .awr-about h2, .awr-about h3 { hyphens: manual; -webkit-hyphens: manual; }

/* Flow-layout margins off inside our own layouts; spacing is set explicitly below. */
.awr-about .awr-about__inner > *, .awr-about .awr-about-hero > *, .awr-about .awr-about-hero__text > *,
.awr-about .awr-about-story > *, .awr-about .awr-about-story__close > *, .awr-about .awr-about-split > *,
.awr-about .awr-about-split__text > *, .awr-about .awr-about-split__aside > *, .awr-about .awr-about-head > *,
.awr-about .awr-origin > *, .awr-about .awr-origin__sources > *, .awr-about .awr-origin__source > *,
.awr-about .awr-contrast > *, .awr-about .awr-principles > *, .awr-about .awr-principle > *,
.awr-about .awr-team > *, .awr-about .awr-person > *, .awr-about .awr-person__mark > *,
.awr-about .awr-fan > *, .awr-about .awr-about-quote > * { margin-block: 0; }

.awr-about,
.awr-about-cta {
	--awr-heading-font: var(--wp--preset--font-family--montserrat, inherit);
}
.awr-about .awr-about-h2 { max-width: 20ch; }
.awr-about .awr-about-head { margin-bottom: clamp(2.5rem, 5vw, 3.75rem); }
.awr-about .awr-about-head .awr-hs__lead { margin-top: 1.25rem; }
.awr-hs .awr-about-title__accent { color: var(--awr-blue-ink); }
.awr-hs.awr-about--origin .awr-about-title__accent,
.awr-hs .awr-about-title__line { display: block; }

/* ---------- 1 Hero ---------- */

.awr-hs.awr-about--hero { padding-top: clamp(4.5rem, 9vw, 7.5rem); }

.awr-about .awr-about-hero {
	display: grid;
	grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);
	gap: clamp(2rem, 5vw, 5rem);
	align-items: center;
}
.awr-hs .awr-about-title {
	margin: 0;
	max-width: 15ch;
	color: var(--awr-slate);
	font-size: clamp(2.375rem, 1.4rem + 3vw, 3.875rem);
	font-weight: 700;
	line-height: 1.06;
	letter-spacing: -0.025em;
	text-wrap: balance;
}
.awr-about .awr-about-hero__text .awr-hs__lead { margin-top: 1.75rem; max-width: 34rem; }

/* People (rings) on a field of data points; the accent layer connects some of them.
   Plays once on load (CSS only, so there is no flash before the script runs). */
.awr-about-field {
	position: relative;
	width: 100%;
	max-width: 30rem;
	aspect-ratio: 1;
	justify-self: end;
	background: url(about-field.svg) center / contain no-repeat;
	animation: awr-about-fade 0.9s ease both;
}
.awr-about-field::after {
	content: "";
	position: absolute;
	inset: 0;
	background: url(about-field-accent.svg) center / contain no-repeat;
	animation: awr-about-draw 1.8s cubic-bezier(0.2, 0.7, 0.2, 1) 0.6s both;
}
@keyframes awr-about-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes awr-about-draw { from { clip-path: inset(0 100% 0 0); } to { clip-path: inset(0 0 0 0); } }

.awr-about .awr-about-story {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: clamp(2rem, 5vw, 5rem);
	margin-top: clamp(3rem, 6vw, 5rem);
	padding-top: clamp(2rem, 4vw, 3rem);
	border-top: 1px solid var(--awr-line-soft);
}
.awr-about .awr-about-story p:not([class*="awr-"]) { color: var(--awr-slate); font-size: 1.0625rem; line-height: 1.7; }
.awr-hs .awr-about-statement {
	text-wrap: balance;
	margin-bottom: 1.25rem !important;
	padding-left: 1rem;
	border-left: 2px solid var(--awr-blue);
	color: var(--awr-slate);
	font-family: var(--awr-heading-font);
	font-size: clamp(1.375rem, 1.1rem + 1vw, 1.75rem);
	font-weight: 700;
	line-height: 1.25;
	letter-spacing: -0.01em;
}

/* ---------- 2 Why AWR exists ---------- */

.awr-about .awr-about-split {
	display: grid;
	grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
	gap: clamp(2rem, 5vw, 5rem);
	align-items: end;
}
.awr-about .awr-about-split__text .awr-hs__title { margin-bottom: 1.75rem; }
.awr-about .awr-about-split__text p:not([class*="awr-"]) { margin-top: 1rem; color: var(--awr-slate); font-size: 1.0625rem; line-height: 1.7; max-width: 38rem; }

.awr-hs .awr-about-quote {
	margin: 0 !important; /* the theme sets quote margins with !important */
	padding: 1.75rem 0 0;
	border: 0;
	border-top: 1px solid var(--awr-line);
	background: none;
	font-style: normal;
}
.awr-hs .awr-about-quote p {
	color: var(--awr-slate);
	font-family: var(--awr-heading-font);
	font-size: clamp(1.5rem, 1.1rem + 1.4vw, 2.125rem);
	font-style: normal;
	font-weight: 600;
	line-height: 1.25;
	letter-spacing: -0.015em;
	text-wrap: pretty;
}
.awr-hs .awr-about-foundation {
	margin-top: 1.5rem !important;
	color: var(--awr-blue-ink);
	font-weight: 700;
	font-size: 1.0625rem;
}

/* The visual: what people do + what the business knows -> AWR Intelligence -> better ... */
.awr-about .awr-origin {
	--awr-origin-gap: clamp(3rem, 7vw, 6rem);
	--awr-origin-drop: 2.25rem;
	display: flex;
	flex-direction: column;
	align-items: center;
	margin-top: clamp(3.5rem, 7vw, 6rem);
}
.awr-about .awr-origin__sources {
	position: relative;
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--awr-origin-gap);
	width: 100%;
	max-width: 62rem;
}
/* "+" between the two sources: drawn by the people panel so it sits in the gap
   whatever the panel heights, and appears with the panel */
.awr-about .awr-origin__source--people::after {
	content: "+";
	content: "+" / "";
	position: absolute;
	left: calc(100% + 1px + var(--awr-origin-gap) / 2);
	top: 50%;
	z-index: 1;
	display: grid;
	place-items: center;
	width: 2.25rem;
	height: 2.25rem;
	box-sizing: border-box;
	transform: translate(-50%, -50%);
	border: 1px solid var(--awr-line);
	border-radius: 50%;
	background: #fff;
	color: var(--awr-slate-muted);
	font-size: 1.125rem;
	line-height: 1;
}
/* bracket joining both sources, then a drop into the core */
.awr-about .awr-origin__sources::after {
	content: "";
	position: absolute;
	top: 100%;
	left: calc((100% - var(--awr-origin-gap)) / 4);
	right: calc((100% - var(--awr-origin-gap)) / 4);
	height: var(--awr-origin-drop);
	box-sizing: border-box;
	border: 1px solid var(--awr-blue);
	border-top: 0;
	border-radius: 0 0 8px 8px;
	transform-origin: center top;
	transition: transform 0.6s ease 0.6s, opacity 0.6s ease 0.6s;
}

.awr-about .awr-origin__source {
	position: relative;
	padding: clamp(1.5rem, 3vw, 2.25rem);
	background: #fff;
	transition: opacity 0.8s ease, transform 0.8s cubic-bezier(0.2, 0.7, 0.2, 1);
}
/* people: organic, open */
.awr-about .awr-origin__source--people {
	display: flex;
	flex-direction: column;
	border: 1px dashed #C3CDD8;
	border-radius: 2rem;
}
/* business records: structured, ruled */
.awr-about .awr-origin__source--business {
	border: 1px solid var(--awr-line);
	border-radius: 3px;
	transition-delay: 0.15s;
}
.awr-hs .awr-origin__label {
	margin: 0 0 1.5rem;
	color: var(--awr-blue-ink);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.awr-hs .awr-origin__people {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	flex: 1;
	align-content: center;
	gap: 1.25rem 1rem;
	margin: 0;
	padding: 0 0 1.25rem;
	list-style: none;
}
.awr-hs .awr-origin__people li {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	margin: 0;
	color: var(--awr-slate);
	font-size: 0.9375rem;
	font-weight: 600;
	line-height: 1.3;
}
.awr-hs .awr-origin__people li:nth-child(2),
.awr-hs .awr-origin__people li:nth-child(4) { margin-top: 1.25rem; }
.awr-hs .awr-origin__people li:nth-child(3) { padding-left: 1rem; }
.awr-hs .awr-origin__people li::before {
	content: "";
	flex: none;
	width: 2.25rem;
	height: 2.25rem;
	box-sizing: border-box;
	border: 1px solid #8A96A3;
	border-radius: 50%;
	background: radial-gradient(circle, #8A96A3 0 3px, transparent 3.5px) #fff;
}

.awr-hs .awr-origin__records {
	margin: 0;
	padding: 0;
	list-style: none;
	border-top: 1px solid var(--awr-line-soft);
}
.awr-hs .awr-origin__records li {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	margin: 0;
	padding: 0.6rem 0;
	border-bottom: 1px solid var(--awr-line-soft);
	color: var(--awr-slate);
	font-size: 0.9375rem;
	font-weight: 600;
	line-height: 1.3;
}
.awr-hs .awr-origin__records li::before {
	content: "";
	flex: none;
	width: 9px;
	height: 9px;
	box-sizing: border-box;
	border: 1px solid #8A96A3;
	background: #fff;
}
.awr-hs .awr-origin__records li::after {
	content: "";
	flex: 1;
	height: 1px;
	margin-left: 0.25rem;
	background: repeating-linear-gradient(90deg, var(--awr-line) 0 2px, transparent 2px 6px);
}

.awr-hs .awr-origin__core {
	position: relative;
	display: inline-flex;
	align-items: center;
	margin-top: calc(var(--awr-origin-drop) * 2) !important;
	padding: 1rem 1.75rem 1rem 3.25rem;
	border-radius: var(--awr-radius);
	background:
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Crect x='.5' y='.5' width='17' height='17' fill='none' stroke='%238CC2FF'/%3E%3Ccircle cx='9' cy='9' r='4.5' fill='none' stroke='%23fff'/%3E%3Ccircle cx='9' cy='9' r='1.6' fill='%23fff'/%3E%3C/svg%3E") 1.25rem center / 18px 18px no-repeat,
		var(--awr-slate);
	color: #fff;
	font-size: 0.875rem;
	font-weight: 700;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	transition: opacity 0.6s ease 1s, transform 0.6s ease 1s;
}
.awr-hs .awr-origin__core::before {
	content: "";
	position: absolute;
	bottom: 100%;
	left: 50%;
	width: 1px;
	height: var(--awr-origin-drop);
	background: var(--awr-blue);
}

/* outcomes widen as they go: understanding -> service -> decisions -> performance */
.awr-hs .awr-origin__outcomes {
	position: relative;
	width: 100%;
	max-width: 46rem;
	margin: 2.5rem 0 0;
	padding: 0;
	list-style: none;
}
.awr-hs .awr-origin__outcomes::before {
	content: "";
	position: absolute;
	bottom: 100%;
	left: 50%;
	width: 1px;
	height: 2.5rem;
	background: var(--awr-line);
	transition: opacity 0.4s ease 1s;
}
.awr-hs .awr-origin__outcomes li {
	--w: 2rem;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 1rem;
	margin: 0;
	padding: 0.65rem 0;
	color: var(--awr-slate);
	font-size: 0.8125rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	white-space: nowrap;
	transition: opacity 0.5s ease;
}
.awr-hs .awr-origin__outcomes li::before,
.awr-hs .awr-origin__outcomes li::after {
	content: "";
	flex: none;
	width: var(--w);
	height: 1px;
	background: #B7C3CF;
	transition: transform 0.6s ease;
}
.awr-hs .awr-origin__outcomes li::before { transform-origin: right center; }
.awr-hs .awr-origin__outcomes li::after { transform-origin: left center; }
.awr-hs .awr-origin__outcomes li:nth-child(2) { --w: 4.5rem; transition-delay: 1.35s; }
.awr-hs .awr-origin__outcomes li:nth-child(3) { --w: 7rem; transition-delay: 1.6s; }
.awr-hs .awr-origin__outcomes li:nth-child(4) { --w: 10rem; transition-delay: 1.85s; color: var(--awr-blue-ink); }
.awr-hs .awr-origin__outcomes li:nth-child(1) { transition-delay: 1.1s; }
.awr-hs .awr-origin__outcomes li:nth-child(4)::before,
.awr-hs .awr-origin__outcomes li:nth-child(4)::after { height: 2px; background: var(--awr-blue); }
.awr-hs .awr-origin__outcomes li:nth-child(1)::before, .awr-hs .awr-origin__outcomes li:nth-child(1)::after { transition-delay: 1.1s; }
.awr-hs .awr-origin__outcomes li:nth-child(2)::before, .awr-hs .awr-origin__outcomes li:nth-child(2)::after { transition-delay: 1.35s; }
.awr-hs .awr-origin__outcomes li:nth-child(3)::before, .awr-hs .awr-origin__outcomes li:nth-child(3)::after { transition-delay: 1.6s; }
.awr-hs .awr-origin__outcomes li:nth-child(4)::before, .awr-hs .awr-origin__outcomes li:nth-child(4)::after { transition-delay: 1.85s; }

.awr-about-js .awr-origin:not(.is-in) .awr-origin__source { opacity: 0; transform: translateY(14px); }
.awr-about-js .awr-origin:not(.is-in) .awr-origin__sources::after { opacity: 0; transform: scaleY(0); }
.awr-about-js .awr-origin:not(.is-in) .awr-origin__core { opacity: 0; transform: translateY(8px); }
.awr-about-js .awr-origin:not(.is-in) .awr-origin__outcomes li,
.awr-about-js .awr-origin:not(.is-in) .awr-origin__outcomes::before { opacity: 0; }
.awr-about-js .awr-origin:not(.is-in) .awr-origin__outcomes li::before,
.awr-about-js .awr-origin:not(.is-in) .awr-origin__outcomes li::after { transform: scaleX(0); }

/* ---------- 3 Our perspective ---------- */

.awr-hs.awr-about--perspective { background: var(--awr-surface); }

.awr-about .awr-contrast { border-top: 1px solid var(--awr-line); }
.awr-hs .awr-contrast__row {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0 clamp(2rem, 5vw, 5rem);
	margin: 0;
	padding: 1.5rem 0;
	border-bottom: 1px solid var(--awr-line);
	font-size: clamp(1.0625rem, 1rem + 0.4vw, 1.3125rem);
	line-height: 1.45;
}
.awr-hs .awr-contrast__can { color: var(--awr-slate); font-weight: 600; }
.awr-hs .awr-contrast__limit {
	padding-left: clamp(1.25rem, 3vw, 2.5rem);
	border-left: 1px solid var(--awr-line);
	color: var(--awr-slate-muted);
	transition: opacity 0.7s ease, transform 0.7s ease;
}
.awr-hs .awr-contrast__row:nth-child(2) .awr-contrast__limit { transition-delay: 0.25s; }
.awr-hs .awr-contrast__row:nth-child(3) .awr-contrast__limit { transition-delay: 0.5s; }
.awr-about-js .awr-contrast:not(.is-in) .awr-contrast__limit { opacity: 0; transform: translateX(-8px); }

.awr-hs .awr-about-belief {
	text-wrap: pretty;
	max-width: 42rem;
	margin-top: clamp(2.5rem, 5vw, 3.5rem) !important;
	color: var(--awr-slate);
	font-family: var(--awr-heading-font);
	font-size: clamp(1.375rem, 1.1rem + 1.1vw, 1.875rem);
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: -0.01em;
}

.awr-about .awr-principles {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: clamp(2.5rem, 5vw, 3.5rem) clamp(2rem, 6vw, 6rem);
	margin-top: clamp(3.5rem, 7vw, 5.5rem);
}
.awr-about .awr-principle {
	position: relative;
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	column-gap: 1.5rem;
	align-content: start;
	padding-top: 1.5rem;
	border-top: 1px solid var(--awr-line);
}
.awr-about .awr-principle::before {
	content: "";
	position: absolute;
	top: -1px;
	left: 0;
	width: 3rem;
	height: 2px;
	background: var(--awr-blue);
	transform-origin: left center;
	transition: transform 0.8s ease;
}
.awr-about .awr-principle:nth-child(2)::before { transition-delay: 0.15s; }
.awr-about .awr-principle:nth-child(3)::before { transition-delay: 0.3s; }
.awr-about .awr-principle:nth-child(4)::before { transition-delay: 0.45s; }
.awr-about-js .awr-principles:not(.is-in) .awr-principle::before { transform: scaleX(0); }
.awr-hs .awr-principle__num {
	grid-row: 1 / span 2;
	color: var(--awr-blue-ink);
	font-family: var(--awr-heading-font);
	font-size: clamp(2.5rem, 2rem + 1.6vw, 3.25rem);
	font-weight: 300;
	line-height: 0.9;
	letter-spacing: -0.03em;
	font-variant-numeric: tabular-nums;
}
.awr-hs .awr-principle__title {
	margin: 0;
	color: var(--awr-slate);
	font-size: 0.9375rem;
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}
.awr-hs .awr-principle__text {
	grid-column: 2;
	margin-top: 0.75rem !important;
	color: var(--awr-slate-muted);
	font-size: 1rem;
	line-height: 1.65;
}

/* ---------- 4 The people behind AWR ---------- */

.awr-about .awr-team {
	display: grid;
	/* the three founders in a row, then the other two */
	grid-template-columns: repeat(6, minmax(0, 1fr));
	column-gap: clamp(1.5rem, 3vw, 2.5rem);
	row-gap: 0;
}
.awr-about .awr-person { display: flex; flex-direction: column; grid-column: span 2; padding-bottom: 0; }
.awr-about .awr-person:nth-child(n+4) { grid-column: span 3; }
.awr-hs .awr-person:nth-child(-n+3) .awr-person__bio { padding-bottom: 3rem; }
@supports (grid-template-rows: subgrid) {
	/* line up descriptors, names, roles and bios across the row */
	.awr-about .awr-person { display: grid; grid-row: span 5; grid-template-rows: subgrid; row-gap: 0; }
}
.awr-about .awr-person__mark {
	position: relative;
	display: grid;
	place-items: center;
	width: 7rem;
	height: 7rem;
	margin-bottom: 1.5rem !important;
	box-sizing: border-box;
	border: 1px solid var(--awr-line);
	border-radius: 50%;
	background: #fff;
}
/* a quarter arc of AWR blue around each person */
.awr-about .awr-person__mark::after {
	content: "";
	position: absolute;
	inset: -7px;
	border: 1px solid transparent;
	border-top-color: var(--awr-blue);
	border-radius: 50%;
	transform: rotate(-45deg);
	transition: transform 1s cubic-bezier(0.2, 0.7, 0.2, 1), opacity 0.6s ease;
}
.awr-about .awr-person:nth-child(2) .awr-person__mark::after { transition-delay: 0.12s; }
.awr-about .awr-person:nth-child(3) .awr-person__mark::after { transition-delay: 0.24s; }
.awr-about .awr-person:nth-child(4) .awr-person__mark::after { transition-delay: 0.36s; }
.awr-about .awr-person:nth-child(5) .awr-person__mark::after { transition-delay: 0.48s; }
.awr-about-js .awr-team:not(.is-in) .awr-person__mark::after { opacity: 0; transform: rotate(-160deg); }
.awr-hs .awr-person__initials {
	margin: 0;
	color: var(--awr-slate);
	font-family: var(--awr-heading-font);
	font-size: 1.375rem;
	font-weight: 600;
	letter-spacing: 0.04em;
	line-height: 1;
}
.awr-about .awr-person__photo { width: 100%; height: 100%; margin: 0; }
.awr-about .awr-person__photo img { display: block; width: 100%; height: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 50%; }
.awr-hs .awr-person__descriptor {
	margin-bottom: 0.5rem !important;
	color: var(--awr-blue-ink);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.16em;
	text-transform: uppercase;
}
.awr-hs .awr-person__name {
	margin: 0;
	color: var(--awr-slate);
	font-size: 1.375rem;
	font-weight: 700;
	line-height: 1.25;
}
/* name + LinkedIn icon (only when a profile URL is set) */
.awr-about .awr-person__head { display: flex; align-items: center; gap: 0.6rem; }
.awr-about .awr-person__head > * { margin: 0; }
.awr-hs .awr-person__social { flex: none; gap: 0; margin: 0; padding: 0; }
.awr-hs .awr-person__social.is-style-logos-only .wp-social-link { color: var(--awr-slate-muted); }
.awr-hs .awr-person__social.is-style-logos-only .wp-social-link:hover { color: var(--awr-blue-ink); }
.awr-hs .awr-person__social .wp-social-link a { padding: 0.15rem; }
.awr-hs .awr-person__social .wp-social-link svg { width: 1.125rem; height: 1.125rem; }
.awr-hs .awr-person__social .wp-social-link a:focus-visible { outline: 2px solid var(--awr-blue); outline-offset: 2px; border-radius: 2px; }

.awr-hs .awr-person__role {
	margin-top: 0.35rem !important;
	color: var(--awr-slate-muted);
	font-size: 0.9375rem;
	line-height: 1.45;
}
.awr-hs .awr-person__bio {
	max-width: 38rem;
	margin-top: 1.25rem !important;
	padding-top: 1.25rem;
	border-top: 1px solid var(--awr-line-soft);
	color: var(--awr-slate);
	font-size: 0.9375rem;
	line-height: 1.65;
}

/* ---------- 5 How we think ---------- */

.awr-hs.awr-about--disciplines { background: var(--awr-surface); }

.awr-about .awr-fan {
	--awr-fan-rays: clamp(5rem, 9vw, 9rem);
	display: grid;
	grid-template-columns: minmax(0, 32rem) var(--awr-fan-rays) max-content 3.25rem minmax(0, 14rem);
	justify-content: center;
	align-items: center;
}
.awr-hs .awr-fan__rows {
	position: relative;
	display: grid;
	grid-auto-rows: 1fr;
	margin: 0;
	padding: 0;
	list-style: none;
	border-top: 1px solid var(--awr-line);
}
.awr-hs .awr-fan__rows li {
	position: relative;
	display: block;
	align-content: center; /* rows share one height; keep each sentence centred in its row */
	margin: 0;
	padding: 0.85rem 1.5rem 0.85rem 0;
	border-bottom: 1px solid var(--awr-line);
	color: var(--awr-slate-muted);
	font-size: 1.0625rem;
	line-height: 1.45;
}
.awr-hs .awr-fan__rows li strong { color: var(--awr-slate); font-weight: 700; }
/* each discipline's node, where its line starts */
.awr-hs .awr-fan__rows li::after {
	content: "";
	position: absolute;
	right: -4px;
	top: 50%;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: var(--awr-blue);
	transform: translateY(-50%);
}
/* the five lines converge on AWR Intelligence */
.awr-hs .awr-fan__rows::after {
	content: "";
	position: absolute;
	left: 100%;
	top: 0;
	bottom: 0;
	width: var(--awr-fan-rays);
	background: url(about-rays.svg) 0 0 / 100% 100% no-repeat;
	clip-path: inset(0 0 0 0);
	transition: clip-path 1.1s cubic-bezier(0.2, 0.7, 0.2, 1) 0.2s;
}
.awr-hs .awr-fan__core {
	position: relative;
	grid-column: 3;
	display: grid;
	place-items: center;
	width: 9.5rem;
	aspect-ratio: 1;
	margin: 0;
	padding: 1rem;
	box-sizing: border-box;
	border: 1px solid var(--awr-blue);
	border-radius: 50%;
	background: #fff;
	box-shadow: 0 0 0 8px rgba(1, 120, 255, 0.07);
	color: var(--awr-slate);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	line-height: 1.4;
	text-align: center;
	text-transform: uppercase;
	transition: opacity 0.6s ease 1s, transform 0.6s ease 1s;
}
.awr-hs .awr-fan__core::after {
	content: "";
	position: absolute;
	left: 100%;
	top: 50%;
	width: 3.25rem;
	height: 1px;
	background: var(--awr-blue);
}
.awr-hs .awr-fan__out {
	position: relative;
	grid-column: 5;
	margin: 0;
	padding-left: 0.5rem;
	color: var(--awr-blue-ink);
	font-family: var(--awr-heading-font);
	font-size: clamp(1.25rem, 1rem + 0.8vw, 1.625rem);
	font-weight: 700;
	line-height: 1.2;
	transition: opacity 0.6s ease 1.3s;
}
.awr-hs .awr-fan__out::before {
	content: "";
	position: absolute;
	right: 100%;
	top: 50%;
	transform: translateY(-50%);
	border-left: 6px solid var(--awr-blue);
	border-top: 4px solid transparent;
	border-bottom: 4px solid transparent;
}
.awr-about-js .awr-fan:not(.is-in) .awr-fan__rows::after { clip-path: inset(0 100% 0 0); }
.awr-about-js .awr-fan:not(.is-in) .awr-fan__core { opacity: 0; transform: scale(0.94); }
.awr-about-js .awr-fan:not(.is-in) .awr-fan__out { opacity: 0; }

.awr-hs .awr-about-together {
	max-width: 42rem;
	margin-top: clamp(2.5rem, 5vw, 3.5rem) !important;
	color: var(--awr-slate);
	font-size: 1.125rem;
	line-height: 1.65;
}

/* ---------- 6 Closing ---------- */

.awr-hs .awr-about-cta__title {
	margin: 0;
	max-width: 14ch;
	color: #fff;
	font-size: clamp(2.375rem, 1.6rem + 4.6vw, 5.5rem);
	font-weight: 700;
	line-height: 1.02;
	letter-spacing: -0.03em;
}
.awr-hs .awr-about-cta__line {
	margin-top: 1.25rem !important;
	color: #8CC2FF;
	font-family: var(--awr-heading-font);
	font-size: clamp(1.375rem, 1.1rem + 1.2vw, 2.125rem);
	font-weight: 500;
	line-height: 1.25;
}

/* ---------- Responsive ---------- */

@media (max-width: 899.98px) {
	.awr-about .awr-team { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.awr-about .awr-person, .awr-about .awr-person:nth-child(n+4) { grid-column: span 1; }
	.awr-hs .awr-person__bio { padding-bottom: 3rem; }
}

@media (max-width: 1099.98px) {
	/* How we think: lines -> one vertical convergence */
	.awr-about .awr-fan { grid-template-columns: minmax(0, 1fr); justify-items: center; }
	.awr-hs .awr-fan__core { grid-column: 1; }
	.awr-hs .awr-fan__rows { width: 100%; }
	.awr-hs .awr-fan__rows li { padding-right: 0; }
	.awr-hs .awr-fan__rows li::after { display: none; }
	.awr-hs .awr-fan__rows::after {
		left: 0;
		right: 0;
		top: calc(100% + 1px);
		bottom: auto;
		width: auto;
		height: 0.75rem;
		box-sizing: border-box;
		border: 1px solid var(--awr-blue);
		border-top: 0;
		border-radius: 0 0 8px 8px;
		background: none;
	}
	.awr-hs .awr-fan__core { margin-top: 3rem; width: 8.5rem; }
	.awr-hs .awr-fan__core::before {
		content: "";
		position: absolute;
		bottom: calc(100% + 1px);
		left: 50%;
		width: 1px;
		height: 2.25rem;
		background: var(--awr-blue);
	}
	.awr-hs .awr-fan__core::after { left: 50%; top: calc(100% + 8px); width: 1px; height: 2rem; }
	.awr-hs .awr-fan__out { grid-column: 1; margin-top: 2.75rem; padding: 0; text-align: center; }
	.awr-hs .awr-fan__out::before {
		right: auto;
		left: 50%;
		top: auto;
		bottom: calc(100% + 0.25rem);
		transform: translateX(-50%);
		border-top: 6px solid var(--awr-blue);
		border-left: 4px solid transparent;
		border-right: 4px solid transparent;
		border-bottom: 0;
	}
}

@media (max-width: 1023.98px) {
	.awr-about .awr-about-hero { grid-template-columns: minmax(0, 1fr); }
	.awr-about-field { justify-self: start; max-width: 22rem; aspect-ratio: 4 / 3; background-size: cover; }
	.awr-about-field::after { background-size: cover; }
	.awr-about .awr-about-split { grid-template-columns: minmax(0, 1fr); align-items: start; }
	.awr-hs .awr-about-quote { margin-top: 1rem !important; }
}

@media (max-width: 781.98px) {
	.awr-about .awr-about-story { grid-template-columns: minmax(0, 1fr); gap: 2rem; }

	.awr-about .awr-origin__sources { grid-template-columns: minmax(0, 1fr); }
	.awr-about .awr-origin__source--people::after { left: 50%; top: calc(100% + 1px + var(--awr-origin-gap) / 2); }
	.awr-about .awr-origin__sources::after { left: 50%; right: auto; width: 1px; border: 0; border-radius: 0; background: var(--awr-blue); }
	/* rows still widen step by step: size the rows, let the side lines fill them */
	.awr-hs .awr-origin__outcomes li { --row: 15rem; width: var(--row); max-width: 100%; box-sizing: border-box; margin-inline: auto; gap: 0.75rem; font-size: 0.75rem; letter-spacing: 0.12em; }
	.awr-hs .awr-origin__outcomes li::before,
	.awr-hs .awr-origin__outcomes li::after { flex: 1 1 0; width: auto; min-width: 0.5rem; }
	.awr-hs .awr-origin__outcomes li:nth-child(2) { --row: 16rem; }
	.awr-hs .awr-origin__outcomes li:nth-child(3) { --row: 17rem; }
	.awr-hs .awr-origin__outcomes li:nth-child(4) { --row: 18.5rem; }

	.awr-hs .awr-contrast__row { grid-template-columns: minmax(0, 1fr); gap: 0.6rem; }
	.awr-hs .awr-contrast__limit { padding-left: 0.9rem; border-left: 2px solid var(--awr-line); }

	.awr-about .awr-principles { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 599.98px) {
	.awr-about .awr-team { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 359.98px) {
	/* "understanding" has to fit on one line */
	.awr-hs .awr-about-title { font-size: 2.0625rem; }
}

@media (max-width: 479.98px) {
	/* the four people in one column: two single-word columns no longer fit */
	.awr-hs .awr-origin__people { grid-template-columns: minmax(0, 1fr); }
	.awr-hs .awr-origin__people li:nth-child(n) { margin-top: 0; padding-left: 0; }
}

/* ---------- Reduced motion ---------- */

@media (prefers-reduced-motion: reduce) {
	.awr-about *, .awr-about *::before, .awr-about *::after { transition: none !important; animation: none !important; }
}