/* Adi About */

.adi-ab,
.adi-ab * { box-sizing: border-box; }

.adi-ab {
	--adi-ab-ink: #111010;
	--adi-ab-muted: #5c5752;      /* 6.4:1 on white — past the AA floor */
	--adi-ab-rule: rgba(0, 0, 0, .18);
	--adi-ab-paper: #f4f2ef;
	--adi-ab-cell: #ffffff;
	color: var(--adi-ab-ink);
}

.adi-ab ul { list-style: none; margin: 0; padding: 0; }
.adi-ab img { max-width: 100%; height: auto; display: block; }
.adi-ab a { color: inherit; }

.adi-ab a:focus-visible,
.adi-ab button:focus-visible {
	outline: 3px solid var(--adi-ab-accent, #e03127);
	outline-offset: 3px;
	border-radius: 3px;
}

.adi-ab > * {
	max-width: 1360px;
	margin-left: auto;
	margin-right: auto;
	padding-left: clamp(18px, 4vw, 56px);
	padding-right: clamp(18px, 4vw, 56px);
}

.adi-ab-h2 {
	margin: 0 0 clamp(20px, 3vw, 36px);
	font-size: 12px;
	letter-spacing: .22em;
	text-transform: uppercase;
	color: var(--adi-ab-muted);
}

/* ---------- hero ---------- */

.adi-ab-hero { padding-top: clamp(40px, 8vw, 110px); }

.adi-ab-hero__title {
	margin: 0;
	line-height: .88;
	letter-spacing: -.035em;
}
.adi-ab-hero__one,
.adi-ab-hero__two,
.adi-ab-hero__since { display: block; }

.adi-ab-hero__one { font-size: clamp(42px, 11vw, 150px); font-weight: 700; }
.adi-ab-hero__two { font-size: clamp(42px, 11vw, 150px); font-weight: 300; }
.adi-ab-hero__since {
	margin-top: .2em;
	font-size: clamp(16px, 2.2vw, 30px);
	font-weight: 400;
	letter-spacing: .02em;
	color: var(--adi-ab-muted);
}

.adi-ab-hero__intro {
	margin: clamp(26px, 4vw, 48px) 0 0;
	max-width: 62ch;
	font-size: clamp(17px, 1.7vw, 21px);
	line-height: 1.6;
	color: var(--adi-ab-muted);
}

.adi-ab-hero__image { margin: clamp(32px, 5vw, 70px) 0 0; }

/* ---------- philosophy ---------- */

.adi-ab-phil { padding-top: clamp(50px, 8vw, 110px); }

.adi-ab-phil__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: clamp(24px, 4vw, 64px);
	align-items: start;
}
.adi-ab-phil__media { display: grid; gap: clamp(14px, 2vw, 24px); }
.adi-ab-phil__text { font-size: 17px; line-height: 1.75; }
.adi-ab-phil__text p + p { margin-top: 1.1em; }

/* ---------- team ---------- */

.adi-ab-team { padding-top: clamp(50px, 8vw, 110px); }

.adi-ab-team__intro {
	max-width: 70ch;
	margin-bottom: clamp(26px, 4vw, 48px);
	font-size: 17px;
	line-height: 1.75;
	color: var(--adi-ab-muted);
}

.adi-ab-team__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
	gap: clamp(20px, 3vw, 40px);
}

.adi-ab-person__media {
	position: relative;
	margin-bottom: 14px;
	overflow: hidden;
	border-radius: 6px;
	background: var(--adi-ab-paper);
	aspect-ratio: 3 / 4;
}
.adi-ab-person__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.adi-ab-person__hover {
	position: absolute;
	inset: 0;
	opacity: 0;
	transition: opacity .3s ease;
}
.adi-ab-person.has-hover:hover .adi-ab-person__hover,
.adi-ab-person.has-hover:focus-within .adi-ab-person__hover { opacity: 1; }

.adi-ab-person__name { margin: 0; font-size: clamp(18px, 1.8vw, 23px); line-height: 1.1; }
.adi-ab-person__first { display: block; font-weight: 700; }
.adi-ab-person__last { display: block; font-weight: 300; }

.adi-ab-person__role { margin: 7px 0 0; font-size: 14px; color: var(--adi-ab-muted); }

.adi-ab-person__since {
	display: flex;
	gap: 7px;
	margin: 8px 0 0;
	font-size: 11px;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--adi-ab-muted);
}
.adi-ab-person__since-value { color: var(--adi-ab-accent, #e03127); }

/* ---------- what we do ---------- */

.adi-ab-what { padding-top: clamp(50px, 8vw, 110px); }
.adi-ab-what__text {
	max-width: 32ch;
	font-size: clamp(20px, 2.6vw, 34px);
	line-height: 1.32;
	letter-spacing: -.01em;
}
.adi-ab-what__text p + p { margin-top: .7em; }

/* ---------- capabilities ---------- */

.adi-ab-caps { padding: 0; max-width: none; }

.adi-ab-cap {
	max-width: 1360px;
	margin: 0 auto;
	padding: clamp(40px, 6vw, 90px) clamp(18px, 4vw, 56px);
	border-top: 1px solid var(--adi-ab-rule);
}

.adi-ab-cap__title {
	margin: 0 0 clamp(20px, 3vw, 36px);
	font-size: clamp(30px, 5.5vw, 72px);
	line-height: .96;
	letter-spacing: -.03em;
	font-weight: 700;
}
.adi-ab-cap__title-two { display: block; font-weight: 300; }

.adi-ab-cap__body {
	display: grid;
	grid-template-columns: 1.4fr 1fr;
	gap: clamp(24px, 4vw, 64px);
	align-items: start;
}
.adi-ab-cap__text { font-size: 16px; line-height: 1.75; }
.adi-ab-cap__text p + p { margin-top: 1.1em; }

.adi-ab-cap__skills {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
	gap: 2px 20px;
}
.adi-ab-cap__skills li {
	padding: 7px 0;
	border-bottom: 1px solid var(--adi-ab-rule);
	font-size: 14px;
	color: var(--adi-ab-muted);
}

.adi-ab-cap__link { margin: clamp(20px, 2.6vw, 30px) 0 0; grid-column: 1 / -1; }
.adi-ab-cap__link a {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding-bottom: 4px;
	border-bottom: 1px solid var(--adi-ab-rule);
	font-size: 15px;
	text-decoration: none;
	min-height: 44px;
	transition: border-color .18s ease, color .18s ease;
}
.adi-ab-cap__link a:hover {
	border-color: var(--adi-ab-accent, #e03127);
	color: var(--adi-ab-accent, #e03127);
}
.adi-ab-cap__arrow { transition: transform .25s cubic-bezier(.2, .7, .3, 1); }
.adi-ab-cap__link a:hover .adi-ab-cap__arrow { transform: translateX(5px); }

.adi-ab-cap__image { margin-top: clamp(26px, 4vw, 46px); }

/* ---------- workspace ---------- */

.adi-ab-space { padding-top: clamp(50px, 8vw, 110px); }

.adi-ab-space__grid {
	display: grid;
	gap: clamp(24px, 4vw, 60px);
	align-items: center;
}

/* Photographs first in the markup, so on a phone they sit above the text
   with no reordering needed. The columns are swapped on desktop. */
@media (min-width: 861px) {
	.adi-ab-space--right .adi-ab-space__grid,
	.adi-ab-space--left .adi-ab-space__grid { grid-template-columns: 1fr 1fr; }

	.adi-ab-space--right .adi-ab-space__media { order: 2; }
	.adi-ab-space--right .adi-ab-space__text { order: 1; }

	.adi-ab-space--left .adi-ab-space__media { order: 1; }
	.adi-ab-space--left .adi-ab-space__text { order: 2; }
}

.adi-ab-space--below .adi-ab-space__text { order: 1; max-width: 62ch; }
.adi-ab-space--below .adi-ab-space__media { order: 2; }

.adi-ab-space__media {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: clamp(10px, 1.6vw, 18px);
}
.adi-ab-space__cell { margin: 0; }
.adi-ab-space__cell img { width: 100%; border-radius: 6px; }

/* A single photograph fills the column; after that they tile, with the
   first one spanning both so the group reads as a composition. */
.adi-ab-space__media > :only-child { grid-column: 1 / -1; }
.adi-ab-space__cell--0 { grid-column: 1 / -1; }

.adi-ab-space--below .adi-ab-space__media {
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	margin-top: clamp(20px, 3vw, 36px);
}
.adi-ab-space--below .adi-ab-space__cell--0 { grid-column: auto; }

.adi-ab-space__text {
	font-size: 17px;
	line-height: 1.75;
	color: var(--adi-ab-muted);
}
.adi-ab-space__text p + p { margin-top: 1.1em; }

/* ---------- clients ---------- */

.adi-ab-clients { padding-top: clamp(50px, 8vw, 110px); }
.adi-ab-clients .adi-cl { padding-left: 0; padding-right: 0; }

/* ---------- closing ---------- */

.adi-ab-cta {
	padding-top: clamp(60px, 9vw, 130px);
	padding-bottom: clamp(60px, 9vw, 130px);
	text-align: center;
}
.adi-ab-cta__line {
	margin: 0 0 14px;
	font-size: 12px;
	letter-spacing: .24em;
	text-transform: uppercase;
	color: var(--adi-ab-muted);
}
.adi-ab-cta__email { margin: 0 0 26px; }
.adi-ab-cta__email a {
	font-size: clamp(24px, 5vw, 62px);
	line-height: 1.05;
	letter-spacing: -.025em;
	text-decoration: none;
	border-bottom: 2px solid transparent;
}
.adi-ab-cta__email a:hover { border-bottom-color: currentColor; }

.adi-ab-cta__button {
	display: inline-block;
	padding: 14px 28px;
	border-radius: 3px;
	background: var(--adi-ab-ink);
	color: var(--adi-ab-cell);
	font-size: 15px;
	text-decoration: none;
	min-height: 46px;
}
.adi-ab-cta__button:hover { background: var(--adi-ab-accent, #e03127); color: #fff; }

/* ---------- reveal ---------- */

.adi-ab-reveal { opacity: 0; transform: translateY(22px); }
.adi-ab-reveal.is-in {
	opacity: 1;
	transform: none;
	transition: opacity .7s cubic-bezier(.2, .7, .3, 1), transform .7s cubic-bezier(.2, .7, .3, 1);
}

/* ---------- small screens ---------- */

@media (max-width: 860px) {
	.adi-ab-phil__grid,
	.adi-ab-cap__body { grid-template-columns: 1fr; }
	.adi-ab-space__media { grid-template-columns: 1fr; }
}

@media (max-width: 600px) {
	.adi-ab-team__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
	/* Hover cannot happen on a touch screen, so the second photo would
	   never be seen; the first one stands alone. */
	.adi-ab-person__hover { display: none; }
}

@media (prefers-reduced-motion: reduce) {
	.adi-ab-reveal { opacity: 1; transform: none; transition: none; }
	.adi-ab-person__hover,
	.adi-ab-cap__link a,
	.adi-ab-cap__arrow { transition: none; }
	.adi-ab-cap__link a:hover .adi-ab-cap__arrow { transform: none; }
}

/* =====================================================================
   Dark mode — follows the visitor, obeys an explicit override
   ================================================================== */

@media (prefers-color-scheme: dark) {
	:root:not([data-adi-theme="light"]) .adi-ab {
		--adi-ab-ink: #f3f1ee;
		--adi-ab-muted: #b4aea7;
		--adi-ab-rule: rgba(255, 255, 255, .26);
		--adi-ab-paper: #1f1e1d;
		--adi-ab-cell: #141312;
	}
	:root:not([data-adi-theme="light"]) .adi-ab { background: #141312; }
	:root:not([data-adi-theme="light"]) .adi-ab-cta__button { background: #f3f1ee; color: #141312; }
}

[data-adi-theme="dark"] .adi-ab {
	--adi-ab-ink: #f3f1ee;
	--adi-ab-muted: #b4aea7;
	--adi-ab-rule: rgba(255, 255, 255, .26);
	--adi-ab-paper: #1f1e1d;
	--adi-ab-cell: #141312;
	background: #141312;
}
[data-adi-theme="dark"] .adi-ab-cta__button { background: #f3f1ee; color: #141312; }

@media (prefers-contrast: more) {
	.adi-ab {
		--adi-ab-muted: var(--adi-ab-ink);
		--adi-ab-rule: currentColor;
	}
}

/* Headings inherit our colour, not the theme's. */
.adi-ab h1,
.adi-ab h2,
.adi-ab h3,
.adi-ab h4,
.adi-ab h5,
.adi-ab h6 { color: inherit; }