/*
 * AH Hero Network. Place it in a full-width container with no padding.
 * The entrance is CSS keyframes (no JS-only hidden states), so the hero always shows.
 * Mobile breakpoints follow the site's Elementor ones: 1024 (tablet), 767 (mobile).
 */
.ah-hero {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	padding-block: 132px 92px;
	background: radial-gradient(110% 90% at 74% 42%, #17284F 0%, var(--ah-deep) 64%);
	color: var(--ah-on-navy);
	font-family: var(--ah-f-body);
	font-size: 17px;
	line-height: 1.75;
	-webkit-font-smoothing: antialiased;
}
[dir="rtl"] .ah-hero { background: radial-gradient(110% 90% at 26% 42%, #17284F 0%, var(--ah-deep) 64%); }
.ah-hero .ah-hero__net,
.ah-hero .ah-hero__links { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.ah-hero .ah-hero__links { pointer-events: none; }

.ah-hero .ah-hero__in {
	position: relative;
	z-index: 3;
	display: grid;
	grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr);
	gap: 40px;
	align-items: center;
	min-height: clamp(540px, 72svh, 720px);
	max-width: var(--ah-container);
	margin-inline: auto;
	padding-inline: var(--ah-gutter);
}
.ah-hero .ah-hero__copy { display: grid; gap: 20px; align-content: center; min-width: 0; }
.ah-hero .ah-hero__seo { margin: 0; font-size: .9rem; font-weight: 700; color: var(--ah-gold-hi); }

.ah-hero .ah-hero__title {
	margin: 0;
	font-family: var(--ah-f-display);
	font-weight: 800;
	font-size: clamp(2.3rem, 5.2vw, 4.2rem);
	line-height: 1.2;
	letter-spacing: 0;
	color: var(--ah-on-navy);
	text-wrap: balance;
}
.ah-hero .ah-hero__em { position: relative; display: inline-block; font-style: normal; color: var(--ah-gold-hi); }
.ah-hero .ah-hero__uline {
	position: absolute;
	left: -2%;
	bottom: -.08em;
	width: 104%;
	height: .32em;
	overflow: visible;
	pointer-events: none;
}
.ah-hero .ah-hero__uline .ah-scrib { stroke-width: 3; stroke-dasharray: 1; }

/* audience switch */
.ah-hero .ah-hero__aud { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: .88rem; color: var(--ah-on-navy-muted); }
.ah-hero .ah-hero__aud .ah-hero__audbtn {
	display: inline-block;
	width: auto;
	height: auto;
	min-height: 0;
	margin: 0;
	box-shadow: none;
	text-transform: none;
	letter-spacing: 0;
	font: inherit;
	font-size: .86rem;
	line-height: 1.6;
	color: var(--ah-on-navy-muted);
	background: transparent;
	border: 1px solid var(--ah-line-navy);
	border-radius: 999px;
	padding: 5px 13px;
	cursor: pointer;
	white-space: nowrap;
	transition: background-color .3s, color .3s, border-color .3s;
}
.ah-hero .ah-hero__aud .ah-hero__audbtn:hover { color: var(--ah-on-navy); border-color: var(--ah-gold-hi); background: transparent; }
.ah-hero .ah-hero__aud .ah-hero__audbtn[aria-pressed="true"] { background: var(--ah-gold-hi); color: var(--ah-deep); border-color: var(--ah-gold-hi); font-weight: 700; }

.ah-hero .ah-hero__sub {
	margin: 0;
	max-width: 56ch;
	min-height: 3.6em;
	font-size: clamp(1.02rem, 1.5vw, 1.15rem);
	color: var(--ah-on-navy-muted);
	transition: opacity .25s;
}
.ah-hero .ah-hero__sub.is-fading { opacity: 0; }
.ah-hero .ah-hero__ctas { display: flex; flex-wrap: wrap; gap: 12px; }

/* numbers */
.ah-hero .ah-hero__stats {
	position: relative;
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	max-width: 640px;
	margin-top: 8px;
	border-top: 1px solid var(--ah-line-navy);
}
.ah-hero .ah-hero__stat { display: grid; gap: 2px; min-width: 0; padding-top: 14px; }
.ah-hero .ah-hero__stat + .ah-hero__stat { padding-inline-start: 14px; border-inline-start: 1px solid var(--ah-line-navy); }
.ah-hero .ah-hero__stat b {
	justify-self: start;
	direction: ltr;
	unicode-bidi: isolate;
	font-family: var(--ah-f-display);
	font-weight: 800;
	font-size: 1.55rem;
	line-height: 1.2;
	white-space: nowrap;
	color: var(--ah-gold-hi);
}
.ah-hero .ah-hero__stat span { font-size: .78rem; line-height: 1.5; color: var(--ah-on-navy-muted); }
.ah-hero .ah-hero__note {
	position: absolute;
	top: -54px;
	inset-inline-end: 0;
	display: flex;
	align-items: flex-end;
	gap: 4px;
	transform: rotate(-4deg);
	pointer-events: none;
}
.ah-hero .ah-hero__note .ah-hand { font-size: 1.15rem; }
.ah-hero .ah-hero__note svg { width: 50px; height: 44px; }
.ah-hero .ah-hero__note .ah-scrib { stroke-dasharray: 1; }

/* portrait lens */
.ah-hero .ah-hero__media { position: relative; justify-self: center; perspective: 900px; }
.ah-hero .ah-hero__lens {
	position: relative;
	width: clamp(170px, 25vw, 320px);
	aspect-ratio: 1;
	border-radius: 50%;
	transform: rotateX(var(--lx, 0deg)) rotateY(var(--ly, 0deg));
	transform-style: preserve-3d;
	transition: transform .6s var(--ah-ease);
}
.ah-hero .ah-hero__img {
	position: relative;
	z-index: 2;
	display: block;
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: cover;
	object-position: 50% 22%;
	border-radius: 50%;
	box-shadow: 0 30px 80px -30px rgba(0, 0, 0, .7);
}
.ah-hero .ah-hero__lens::before {
	content: "";
	position: absolute;
	inset: -14px;
	z-index: 1;
	border-radius: 50%;
	border: 1px solid rgba(232, 201, 136, .55);
	transform: translateZ(-20px);
}
.ah-hero .ah-hero__lens::after {
	content: "";
	position: absolute;
	inset: -34px;
	z-index: 1;
	border-radius: 50%;
	border: 1px dashed rgba(232, 201, 136, .32);
}
.ah-hero .ah-hero__cap {
	position: absolute;
	z-index: 3;
	bottom: -12px;
	left: 50%;
	translate: -50% 0;
	transform: translateZ(30px);
	padding: 4px 12px;
	border-radius: 999px;
	border: 1px solid rgba(232, 201, 136, .4);
	background: var(--ah-deep);
	color: var(--ah-on-navy);
	font-size: .78rem;
	line-height: 1.6;
	white-space: nowrap;
}

/* proof cards */
.ah-hero .ah-hero__cards { position: absolute; inset: 0; pointer-events: none; }
.ah-hero .ah-hero__card {
	position: absolute;
	z-index: 4;
	display: grid;
	gap: 1px;
	min-width: 136px;
	padding: 10px 14px;
	border-radius: 14px;
	border: 1px solid rgba(232, 201, 136, .32);
	background: rgba(9, 18, 42, .76);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
	box-shadow: 0 18px 40px -20px rgba(0, 0, 0, .7);
	color: var(--ah-on-navy);
	text-decoration: none;
	pointer-events: auto;
	transition: border-color .3s, translate .5s var(--ah-ease);
}
.ah-hero a.ah-hero__card:hover { border-color: var(--ah-gold-hi); color: var(--ah-on-navy); }
.ah-hero .ah-hero__card:nth-child(1) { top: -8%; inset-inline-end: -28%; }
.ah-hero .ah-hero__card:nth-child(2) { top: 40%; inset-inline-end: -38%; }
.ah-hero .ah-hero__card:nth-child(3) { bottom: -27%; inset-inline-end: -12%; }
.ah-hero .ah-hero__pk { font-family: var(--ah-f-mono); font-size: .62rem; letter-spacing: .16em; line-height: 1.6; color: var(--ah-on-navy-muted); }
.ah-hero .ah-hero__card 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.15;
	color: var(--ah-gold-hi);
}
.ah-hero .ah-hero__card small { font-size: .74rem; line-height: 1.5; color: var(--ah-on-navy-muted); }

/* platform chips, positioned by the network script */
.ah-hero .ah-hero__chips { position: absolute; inset: 0; z-index: 2; pointer-events: none; }
.ah-hero .ah-hero__chip {
	position: absolute;
	left: 0;
	top: 0;
	transform: translate(-999px, -999px);
	translate: -50% -160%;
	padding: 2px 9px;
	border-radius: 999px;
	border: 1px solid rgba(232, 201, 136, .35);
	background: rgba(9, 18, 42, .82);
	color: var(--ah-gold-hi);
	font-family: var(--ah-f-mono);
	font-size: .68rem;
	letter-spacing: .05em;
	line-height: 1.6;
	white-space: nowrap;
	transition: opacity .5s;
}

/* motion: entrance once, loops only while on screen */
@media (prefers-reduced-motion: no-preference) {
	.ah-hero .ah-hero__title .ah-w { animation: ah-word-up .8s var(--ah-ease) backwards; animation-delay: calc(40ms + var(--i, 0) * 45ms); }
	.ah-hero .ah-hero__seo { animation: ah-fade-up .7s var(--ah-ease) backwards; }
	.ah-hero .ah-hero__aud { animation: ah-fade-up .7s var(--ah-ease) .45s backwards; }
	.ah-hero .ah-hero__sub { animation: ah-fade-up .7s var(--ah-ease) .55s backwards; }
	.ah-hero .ah-hero__ctas { animation: ah-fade-up .7s var(--ah-ease) .65s backwards; }
	.ah-hero .ah-hero__stats { animation: ah-fade-up .7s var(--ah-ease) .75s backwards; }
	.ah-hero .ah-hero__uline .ah-scrib { animation: ah-draw 1.2s var(--ah-ease) .9s backwards; }
	.ah-hero .ah-hero__note .ah-scrib { animation: ah-draw 1.4s var(--ah-ease) 1.3s backwards; }
	.ah-hero .ah-hero__lens::after { animation: ah-spin 40s linear infinite; }
	.ah-hero .ah-hero__card { animation: ah-float 7s ease-in-out infinite; }
	.ah-hero .ah-hero__card:nth-child(2) { animation-delay: -2.3s; }
	.ah-hero .ah-hero__card:nth-child(3) { animation-delay: -4.6s; }
	.ah-hero.is-off .ah-hero__lens::after,
	.ah-hero.is-off .ah-hero__card { animation-play-state: paused; }
}
@media (prefers-reduced-motion: reduce) {
	.ah-hero .ah-hero__lens,
	.ah-hero .ah-hero__card,
	.ah-hero .ah-hero__sub,
	.ah-hero .ah-hero__chip { transition: none; }
}

/* small laptops: the copy column is too narrow for the note above the numbers, so it goes below them */
@media (max-width: 1200px) {
	.ah-hero .ah-hero__note { position: static; order: 9; grid-column: 1 / -1; justify-self: end; margin-top: 8px; transform: rotate(-2deg); }
	.ah-hero .ah-hero__note svg { scale: 1 -1; }
}

/* tablet: one column, portrait on top, cards in a row under the copy */
@media (max-width: 1024px) {
	.ah-hero { padding-block: 110px 80px; }
	.ah-hero .ah-hero__in { grid-template-columns: minmax(0, 1fr); min-height: 0; gap: 34px; }
	.ah-hero .ah-hero__media { display: contents; }
	.ah-hero .ah-hero__lens { order: -1; justify-self: center; }
	.ah-hero .ah-hero__cards { order: 3; position: static; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
	.ah-hero .ah-hero__card,
	.ah-hero .ah-hero__card:nth-child(n) { position: static; inset: auto; min-width: 0; padding: 8px 10px; animation: none; translate: none; }
	.ah-hero .ah-hero__card b { font-size: 1.1rem; }
	.ah-hero .ah-hero__pk { font-size: .56rem; letter-spacing: .08em; }
	.ah-hero .ah-hero__card small { font-size: .68rem; line-height: 1.4; }
	.ah-hero .ah-hero__note { display: none; }
}
@media (max-width: 767px) {
	.ah-hero { font-size: 16.5px; }
	.ah-hero .ah-hero__stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.ah-hero .ah-hero__stat:nth-of-type(odd) { padding-inline-start: 0; border-inline-start: 0; }
	.ah-hero .ah-hero__stat:nth-of-type(n+3) { margin-top: 10px; }
	.ah-hero .ah-hero__chips { display: none; }
}