/* AH Page Hero. Place it in a full-width container with no padding. */
.ah-ph {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	padding-block: 150px 88px;
	background: radial-gradient(90% 120% at 18% 30%, #17284F 0%, var(--ah-deep) 66%);
	color: var(--ah-on-navy);
	font-family: var(--ah-f-body);
	font-size: 17px;
	line-height: 1.75;
}
[dir="rtl"] .ah-ph { background: radial-gradient(90% 120% at 82% 30%, #17284F 0%, var(--ah-deep) 66%); }
/* the network of the home hero, reduced to a faint printed grid of nodes */
.ah-ph::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background-image: radial-gradient(rgba(232, 201, 136, .16) 1px, transparent 1.6px);
	background-size: 28px 28px;
	-webkit-mask-image: radial-gradient(70% 90% at 50% 40%, #000 0%, transparent 75%);
	mask-image: radial-gradient(70% 90% at 50% 40%, #000 0%, transparent 75%);
}
.ah-ph::after {
	content: "";
	position: absolute;
	bottom: 22px;
	inset-inline-end: max(10px, env(safe-area-inset-right, 0px));
	width: 22px;
	height: 22px;
	border-bottom: 1px solid rgba(226, 197, 143, .45);
	border-inline-end: 1px solid rgba(226, 197, 143, .45);
	opacity: .55;
}
.ah-ph .ah-ph__in {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 48px;
	align-items: center;
	max-width: var(--ah-container);
	margin-inline: auto;
	padding-inline: var(--ah-gutter);
}
.ah-ph.ah-ph--media .ah-ph__in { grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr); }
.ah-ph .ah-ph__copy { display: grid; gap: 18px; align-content: center; max-width: 820px; min-width: 0; }

.ah-ph .ah-ph__crumb ol { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; font-size: .82rem; color: var(--ah-on-navy-muted); }
.ah-ph .ah-ph__crumb li + li::before { content: "/"; margin-inline-end: 6px; color: rgba(232, 201, 136, .5); }
.ah-ph .ah-ph__crumb a { color: var(--ah-on-navy-muted); text-decoration: none; }
.ah-ph .ah-ph__crumb a:hover { color: var(--ah-gold-hi); }
.ah-ph .ah-ph__crumb [aria-current] { color: var(--ah-gold-hi); }

.ah-ph .ah-ph__title {
	margin: 0;
	font-family: var(--ah-f-display);
	font-weight: 800;
	font-size: clamp(2.1rem, 4.6vw, 3.7rem);
	line-height: 1.22;
	letter-spacing: 0;
	color: var(--ah-on-navy);
	text-wrap: balance;
}
.ah-ph .ah-ph__em { position: relative; display: inline-block; font-style: normal; color: var(--ah-gold-hi); }
.ah-ph .ah-ph__uline { position: absolute; left: -2%; bottom: -.08em; width: 104%; height: .32em; overflow: visible; pointer-events: none; }
.ah-ph .ah-ph__uline .ah-scrib { stroke: var(--ah-gold-hi); stroke-width: 3; stroke-dasharray: 1; }
.ah-ph .ah-ph__intro { margin: 0; max-width: 62ch; font-size: clamp(1.02rem, 1.5vw, 1.15rem); color: var(--ah-on-navy-muted); }
.ah-ph .ah-ph__ctas { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 6px; }

.ah-ph .ah-ph__stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); max-width: 640px; margin-top: 10px; border-top: 1px solid var(--ah-line-navy); }
.ah-ph .ah-ph__stat { display: grid; gap: 2px; min-width: 0; padding-top: 14px; }
.ah-ph .ah-ph__stat + .ah-ph__stat { padding-inline-start: 14px; border-inline-start: 1px solid var(--ah-line-navy); }
.ah-ph .ah-ph__stat b { justify-self: start; direction: ltr; unicode-bidi: isolate; font-family: var(--ah-f-display); font-weight: 800; font-size: 1.5rem; line-height: 1.2; color: var(--ah-gold-hi); white-space: nowrap; }
.ah-ph .ah-ph__stat span { font-size: .78rem; line-height: 1.5; color: var(--ah-on-navy-muted); }

.ah-ph .ah-ph__media { position: relative; justify-self: center; width: 100%; max-width: 420px; margin: 0; }
.ah-ph .ah-ph__img { display: block; width: 100%; height: auto; max-width: none; border-radius: 18px; border: 1px solid rgba(232, 201, 136, .35); box-shadow: 0 40px 80px -40px rgba(0, 0, 0, .8); aspect-ratio: 4 / 5; object-fit: cover; object-position: 50% 22%; rotate: -1.2deg; }
.ah-ph.ah-ph--lens .ah-ph__media { max-width: 320px; }
.ah-ph.ah-ph--lens .ah-ph__img { aspect-ratio: 1; border-radius: 50%; rotate: none; outline: 1px dashed rgba(232, 201, 136, .32); outline-offset: 18px; }
.ah-ph .ah-ph__cap { position: absolute; bottom: -12px; left: 50%; translate: -50% 0; padding: 4px 12px; border-radius: 999px; border: 1px solid rgba(232, 201, 136, .4); background: var(--ah-deep); font-size: .78rem; line-height: 1.6; white-space: nowrap; color: var(--ah-on-navy); }
.ah-ph .ah-ph__note { position: absolute; top: -40px; inset-inline-start: -20px; display: flex; align-items: flex-end; gap: 4px; transform: rotate(-4deg); pointer-events: none; }
.ah-ph .ah-ph__note .ah-hand { font-size: 1.15rem; color: var(--ah-gold-hi); white-space: nowrap; }
.ah-ph .ah-ph__note svg { width: 46px; height: 40px; }
.ah-ph .ah-ph__note .ah-scrib { stroke: var(--ah-gold-hi); stroke-dasharray: 1; }

@media (prefers-reduced-motion: no-preference) {
	.ah-ph .ah-ph__title .ah-w { animation: ah-word-up .8s var(--ah-ease) backwards; animation-delay: calc(40ms + var(--i, 0) * 45ms); }
	.ah-ph .ah-ph__crumb, .ah-ph .ah-ph__kicker { animation: ah-fade-up .7s var(--ah-ease) backwards; }
	.ah-ph .ah-ph__intro { animation: ah-fade-up .7s var(--ah-ease) .4s backwards; }
	.ah-ph .ah-ph__ctas { animation: ah-fade-up .7s var(--ah-ease) .5s backwards; }
	.ah-ph .ah-ph__stats { animation: ah-fade-up .7s var(--ah-ease) .6s backwards; }
	.ah-ph .ah-ph__media { animation: ah-fade-up .9s var(--ah-ease) .3s backwards; }
	.ah-ph .ah-ph__uline .ah-scrib { animation: ah-draw 1.2s var(--ah-ease) .8s backwards; }
	.ah-ph .ah-ph__note .ah-scrib { animation: ah-draw 1.4s var(--ah-ease) 1.2s backwards; }
}

@media (max-width: 1024px) {
	.ah-ph { padding-block: 120px 72px; }
	.ah-ph.ah-ph--media .ah-ph__in { grid-template-columns: minmax(0, 1fr); gap: 56px; }
	.ah-ph .ah-ph__media { order: -1; max-width: 340px; }
	.ah-ph.ah-ph--lens .ah-ph__media { max-width: 220px; }
	.ah-ph .ah-ph__note { display: none; }
}
@media (max-width: 767px) {
	.ah-ph { font-size: 16.5px; padding-block: 110px 64px; }
	.ah-ph .ah-ph__stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.ah-ph .ah-ph__stat:nth-of-type(odd) { padding-inline-start: 0; border-inline-start: 0; }
	.ah-ph .ah-ph__stat:nth-of-type(n+3) { margin-top: 10px; }
}