/*
 * AH Content Grid: services (capability cards), courses (course cards), resources (free-resource
 * cards with cover tiles), case studies (case cards with the big number), blog posts (article
 * cards: image, category chip and date, title, excerpt). Ported from the v5 capability, academy,
 * free-resource and work cards. Cards rise in with `translate`, so the tilt (`transform`) keeps
 * working after the reveal. Columns: 3 (resources 4), 2 at 1200px, 1 at 767px; the Columns
 * control overrides.
 */
.ah-cg {
	--ah-cg-gap: 18px;
	display: grid;
	gap: 22px;
	font-family: var(--ah-f-body);
	font-size: 17px;
	line-height: 1.75;
	color: var(--ah-ink);
	-webkit-font-smoothing: antialiased;
}
.ah-cg .ah-cg__grid {
	display: grid;
	grid-template-columns: repeat(var(--ah-cg-cols, 3), minmax(0, 1fr));
	gap: var(--ah-cg-gap);
}
.ah-cg.ah-cg--res .ah-cg__grid { grid-template-columns: repeat(var(--ah-cg-cols, 4), minmax(0, 1fr)); gap: var(--ah-cg-gap, 16px); }
.ah-cg .ah-cg__card[hidden] { display: none; }

/* shared card pieces */
.ah-cg .ah-cg__card {
	position: relative;
	min-width: 0;
	margin: 0;
	border: 1px solid var(--ah-card-line);
	border-radius: var(--ah-r-card);
	background: var(--ah-card);
	box-shadow: var(--ah-shadow);
	color: var(--ah-ink);
	transition: transform .5s var(--ah-ease), border-color .35s, box-shadow .45s var(--ah-ease), opacity .9s var(--ah-ease) calc(var(--i, 0) * 90ms), translate .9s var(--ah-ease) calc(var(--i, 0) * 90ms);
}
.ah-cg .ah-cg__card.is-tilting { transition: transform .08s linear, border-color .35s, box-shadow .45s var(--ah-ease), opacity .9s var(--ah-ease), translate .9s var(--ah-ease); }
.ah-cg .ah-cg__card:hover { border-color: var(--ah-tint-line); box-shadow: var(--ah-shadow-hi); }
.ah-cg .ah-cg__link { color: inherit; text-decoration: none; background: none; }
.ah-cg .ah-cg__link:hover { color: inherit; }
.ah-cg .ah-cg__link::before { content: ""; position: absolute; inset: 0; z-index: 5; border-radius: inherit; }
.ah-cg .ah-cg__link:focus-visible { outline: none; }
.ah-cg .ah-cg__card:has(.ah-cg__link:focus-visible) { outline: 2px solid var(--ah-gold); outline-offset: 3px; }
@supports not selector(:has(*)) {
	.ah-cg .ah-cg__link:focus-visible { outline: 2px solid var(--ah-gold); outline-offset: 3px; }
}
.ah-motion .ah-cg .ah-cg__card.ah-rv { opacity: 0; translate: 0 22px; }
.ah-motion .ah-cg .ah-cg__card.ah-rv.seen { opacity: 1; translate: none; }

/* ---------- service: capability card ---------- */
.ah-cg .ah-cg__card--service {
	--ah-cg-ink: var(--ah-ink);
	--ah-cg-muted: var(--ah-muted);
	--ah-cg-gold: var(--ah-ink-gold);
	--ah-cg-peek: var(--ah-sand);
	--ah-cg-line: var(--ah-line);
	display: flex;
	flex-direction: column;
	gap: 12px;
	padding: 26px 24px 22px;
	color: var(--ah-cg-ink);
}
.ah-cg .ah-cg__card--service.ah-cg__card--dark {
	--ah-cg-ink: var(--ah-on-navy);
	--ah-cg-muted: var(--ah-on-navy-muted);
	--ah-cg-gold: var(--ah-gold-hi);
	--ah-cg-peek: #13204A;
	--ah-cg-line: var(--ah-line-navy);
	border-color: var(--ah-navy);
	background: var(--ah-navy);
	box-shadow: var(--ah-shadow-dark);
}
.ah-cg .ah-cg__card--service.ah-cg__card--dark:hover { border-color: rgba(232, 201, 136, .45); box-shadow: 0 26px 50px -30px rgba(9, 18, 42, .8); }
.ah-cg .ah-cg__top { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
.ah-cg .ah-cg__top .ah-itile { translate: calc(var(--mx, 0) * 8px) calc(var(--my, 0) * 6px); transition: transform .5s var(--ah-spring), translate .5s var(--ah-ease); }
.ah-cg .ah-cg__card:hover .ah-cg__top .ah-itile { transform: rotate(calc(var(--ah-dir) * 6deg)) scale(1.08); }
.ah-cg .ah-cg__no { font-family: var(--ah-f-mono); font-size: .78rem; line-height: 1.6; color: var(--ah-cg-gold); }
.ah-cg .ah-cg__title {
	margin: 0;
	font-family: var(--ah-f-display);
	font-weight: 700;
	font-size: var(--ah-fs-card);
	line-height: 1.45;
	letter-spacing: 0;
	color: inherit;
	text-wrap: balance;
}
.ah-cg .ah-cg__text { margin: 0; font-size: .94rem; line-height: 1.75; color: var(--ah-cg-muted); }
.ah-cg .ah-cg__foot { display: grid; gap: 12px; margin-block-start: auto; }
.ah-cg .ah-cg__peek { position: relative; aspect-ratio: 2.9; margin: 0; overflow: hidden; border-radius: var(--ah-r-sm); background: var(--ah-cg-peek); }
.ah-cg .ah-cg__peek .ah-cg__img {
	display: block;
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: cover;
	object-position: center top;
	scale: 1.1;
	translate: calc(var(--mx, 0) * -14px) calc(var(--my, 0) * -10px);
	transition: transform .9s var(--ah-ease), translate .5s var(--ah-ease);
}
.ah-cg .ah-cg__card:hover .ah-cg__img { transform: scale(1.06); }
.ah-cg .ah-cg__proof {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	margin: 0;
	padding-block-start: 10px;
	border-top: 1px dashed var(--ah-cg-line);
	font-family: var(--ah-f-mono);
	font-size: .78rem;
	line-height: 1.6;
	color: var(--ah-cg-gold);
}
.ah-cg .ah-cg__pf { unicode-bidi: isolate; }
.ah-cg .ah-cg__proof .ah-btn__arr { flex: none; width: 15px; height: 15px; margin-inline-start: auto; transition: translate .35s var(--ah-ease); }
[dir="rtl"] .ah-cg .ah-btn__arr { scale: -1 1; }
.ah-cg .ah-cg__card.has-link:hover .ah-cg__proof .ah-btn__arr { translate: calc(var(--ah-dir) * 5px) 0; }

/* ---------- course card ---------- */
.ah-cg .ah-cg__card--course { display: grid; align-content: start; gap: 12px; padding: 22px; }
.ah-cg .ah-cg__card--course:hover { border-color: var(--ah-tint-line); }
.ah-cg .ah-cg__ctop { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; }
.ah-cg .ah-cg__card--course .ah-itile { transform: translateZ(0); transition: transform .5s var(--ah-spring); }
.ah-cg .ah-cg__card--course:hover .ah-itile { transform: translateZ(30px) rotate(-5deg) scale(1.06); }
.ah-cg .ah-cg__st { padding: 1px 10px; border: 1px solid var(--ah-line); border-radius: 999px; font-size: .74rem; font-weight: 700; line-height: 1.6; white-space: nowrap; color: var(--ah-ink-gold); }
.ah-cg .ah-cg__st.ah-cg__st--waitlist { border-color: rgba(122, 95, 49, .45); background: rgba(232, 201, 136, .2); }
.ah-cg .ah-cg__st.ah-cg__st--open { border-color: rgba(46, 139, 99, .45); color: #23704F; }
.ah-cg .ah-cg__ch { margin: 0; font-family: var(--ah-f-display); font-weight: 700; font-size: var(--ah-fs-card); line-height: 1.45; letter-spacing: 0; color: var(--ah-ink); }
.ah-cg .ah-cg__cx { margin: 0; font-size: .9rem; line-height: 1.7; color: var(--ah-muted); }
.ah-cg .ah-cg__meta { display: flex; flex-wrap: wrap; gap: 6px 14px; padding-top: 10px; border-top: 1px dashed var(--ah-line); font-size: .8rem; line-height: 1.5; color: var(--ah-soft); }
.ah-cg .ah-cg__price { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; margin: 0; direction: ltr; }
[dir="rtl"] .ah-cg .ah-cg__price { justify-content: flex-end; }
.ah-cg .ah-cg__price b { font-family: var(--ah-f-display); font-weight: 800; font-size: 1.4rem; line-height: 1.2; color: var(--ah-ink); }
.ah-cg .ah-cg__price s { font-family: var(--ah-f-mono); font-size: .82rem; color: var(--ah-soft); }

/* ---------- resource card ---------- */
.ah-cg .ah-cg__card--res { display: grid; grid-template-rows: auto 1fr; overflow: hidden; }
.ah-cg .ah-cg__card--res:hover,
.ah-cg .ah-cg__card--res:focus-within { transform: translateY(-4px); border-color: var(--ah-tint-line); box-shadow: var(--ah-shadow-hi); }
.ah-cg .ah-cg__cv {
	display: grid;
	place-items: center;
	height: var(--ah-cg-cover, 120px);
	padding: 12px;
	overflow: hidden;
	font-family: var(--ah-f-mono);
	font-weight: 500;
	font-size: .7rem;
	letter-spacing: .18em;
	line-height: 1.6;
	text-align: center;
	text-transform: uppercase;
}
.ah-cg .ah-cg__cvin { display: grid; justify-items: center; gap: 6px; transition: transform .6s var(--ah-spring); }
.ah-cg .ah-cg__card--res:hover .ah-cg__cvin { transform: scale(1.08); }
.ah-cg .ah-cg__cvin.ah-cg__cvin--title { display: block; font-family: var(--ah-f-display); font-weight: 800; font-size: 1.05rem; letter-spacing: 0; line-height: 1.45; text-transform: none; }
.ah-cg .ah-cg__cv--a { background: var(--ah-navy); color: var(--ah-gold-hi); }
.ah-cg .ah-cg__cv--b { background: var(--ah-gold); color: var(--ah-deep); }
.ah-cg .ah-cg__cv--c { background: #2B3A63; color: var(--ah-on-navy); }
.ah-cg .ah-cg__cv--d { background: #E7E1D3; color: var(--ah-ink); }
.ah-cg .ah-cg__cv--img { padding: 0; background: var(--ah-navy); }
.ah-cg .ah-cg__cimg { width: 100%; height: 100%; max-width: none; object-fit: cover; }
.ah-cg .ah-cg__big { display: block; font-family: var(--ah-f-display); font-weight: 800; font-size: 2rem; letter-spacing: 0; line-height: 1.3; }
.ah-cg .ah-cg__ext { padding: 1px 7px; border-radius: 5px; background: rgba(255, 255, 255, .55); color: var(--ah-deep); letter-spacing: .12em; }
.ah-cg .ah-cg__body { display: grid; align-content: start; gap: 6px; padding: 16px; }
.ah-cg .ah-cg__rs { font-size: .74rem; font-weight: 700; line-height: 1.6; color: var(--ah-ink-gold); }
.ah-cg .ah-cg__rt { margin: 0; font-family: var(--ah-f-body); font-weight: 700; font-size: .98rem; line-height: 1.6; letter-spacing: 0; color: var(--ah-ink); }
.ah-cg .ah-cg__rx { margin: 0; font-size: .84rem; line-height: 1.7; color: var(--ah-muted); }

/* ---------- case card ---------- */
.ah-cg .ah-cg__card--case { display: grid; grid-template-rows: auto 1fr; overflow: hidden; }
.ah-cg .ah-cg__card--case:hover,
.ah-cg .ah-cg__card--case:focus-within { border-color: var(--ah-gold); }
.ah-cg .ah-cg__fig { position: relative; height: clamp(210px, 20vw, 270px); margin: 0; overflow: hidden; background: var(--ah-navy); }
.ah-cg .ah-cg__fig .ah-cg__fimg { display: block; width: 100%; height: 100%; max-width: none; object-fit: cover; transition: transform 1.2s var(--ah-ease); }
.ah-cg .ah-cg__card--case:hover .ah-cg__fimg { transform: scale(1.05); }
.ah-cg .ah-cg__fig--big::after { content: ""; position: absolute; z-index: 1; inset: auto 0 0; height: 55%; background: linear-gradient(to top, rgba(9, 18, 42, .62), rgba(9, 18, 42, 0)); pointer-events: none; }
.ah-cg .ah-cg__client {
	position: absolute;
	z-index: 2;
	top: 10px;
	inset-inline-start: 10px;
	max-width: calc(100% - 20px);
	overflow: hidden;
	padding: 3px 10px;
	border-radius: 999px;
	background: rgba(9, 18, 42, .82);
	color: var(--ah-on-navy);
	font-family: var(--ah-f-en), var(--ah-f-body);
	font-size: .74rem;
	line-height: 1.6;
	white-space: nowrap;
	text-overflow: ellipsis;
}
.ah-cg .ah-cg__bign {
	position: absolute;
	z-index: 2;
	bottom: 10px;
	inset-inline-end: 12px;
	direction: ltr;
	font-family: var(--ah-f-display);
	font-weight: 800;
	font-size: 2.3rem;
	line-height: 1;
	color: var(--ah-gold-hi);
	text-shadow: 0 2px 24px rgba(0, 0, 0, .6);
	transform: translateZ(40px);
}
.ah-cg .ah-cg__vis {
	display: grid;
	place-items: center;
	align-content: center;
	gap: 4px;
	width: 100%;
	height: 100%;
	background: radial-gradient(80% 80% at 50% 40%, var(--ah-navy-2), var(--ah-deep));
	color: var(--ah-gold-hi);
	transition: transform 1.2s var(--ah-ease);
}
.ah-cg .ah-cg__card--case:hover .ah-cg__vis { transform: scale(1.04); }
.ah-cg .ah-cg__vis b { direction: ltr; font-family: var(--ah-f-display); font-weight: 800; font-size: 3.4rem; line-height: 1.1; }
.ah-cg .ah-cg__vis small { font-family: var(--ah-f-mono); font-weight: 500; font-size: .7rem; letter-spacing: .3em; line-height: 1.5; text-transform: uppercase; color: var(--ah-on-navy-muted); }
.ah-cg .ah-cg__cbody { display: flex; flex-direction: column; gap: 8px; padding: 18px 20px 20px; }
.ah-cg .ah-cg__ct { margin: 0; font-family: var(--ah-f-display); font-weight: 700; font-size: 1.12rem; line-height: 1.55; letter-spacing: 0; color: var(--ah-ink); text-wrap: pretty; }
.ah-cg .ah-cg__cs { display: -webkit-box; margin: 0; overflow: hidden; font-size: .9rem; line-height: 1.75; color: var(--ah-muted); -webkit-line-clamp: 3; -webkit-box-orient: vertical; }
.ah-cg .ah-cg__go { margin-block-start: auto; padding-top: 6px; }
.ah-cg .ah-cg__card--case:hover .ah-cg__go:not(.ah-more--soon) { color: var(--ah-ink); }

/* ---------- post card ---------- */
.ah-cg .ah-cg__card--post { display: grid; grid-template-rows: auto 1fr; overflow: hidden; }
.ah-cg .ah-cg__card--post:hover,
.ah-cg .ah-cg__card--post:focus-within { transform: translateY(-4px); border-color: var(--ah-tint-line); box-shadow: var(--ah-shadow-hi); }
.ah-cg .ah-cg__pfig { position: relative; aspect-ratio: 16 / 10; margin: 0; overflow: hidden; background: var(--ah-navy); }
.ah-cg .ah-cg__pfig .ah-cg__pimg { display: block; width: 100%; height: 100%; max-width: none; max-height: none; margin: 0; border-radius: 0; object-fit: cover; transition: transform 1.2s var(--ah-ease); }
.ah-cg .ah-cg__card--post:hover .ah-cg__pimg { transform: scale(1.04); }
.ah-cg .ah-cg__pph { display: grid; place-items: center; width: 100%; height: 100%; background: radial-gradient(80% 80% at 50% 40%, var(--ah-navy-2), var(--ah-deep)); }
.ah-cg .ah-cg__pph b { direction: ltr; font-family: var(--ah-f-display); font-weight: 800; font-size: 2.4rem; line-height: 1; color: var(--ah-gold-hi); }
.ah-cg .ah-cg__pbody { display: flex; flex-direction: column; gap: 10px; min-width: 0; padding: 18px 20px 20px; }
.ah-cg .ah-cg__pmeta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; margin: 0; font-size: .78rem; line-height: 1.6; color: var(--ah-soft); }
.ah-cg .ah-cg__pc {
	max-width: 100%;
	overflow: hidden;
	padding: 1px 10px;
	border: 1px solid rgba(122, 95, 49, .4);
	border-radius: 999px;
	background: rgba(232, 201, 136, .18);
	font-weight: 700;
	color: var(--ah-ink-gold);
	white-space: nowrap;
	text-overflow: ellipsis;
}
.ah-cg .ah-cg__pd { font-variant-numeric: tabular-nums; unicode-bidi: isolate; }
.ah-cg .ah-cg__pt { margin: 0; font-family: var(--ah-f-display); font-weight: 700; font-size: 1.12rem; line-height: 1.55; letter-spacing: 0; color: var(--ah-ink); text-wrap: pretty; }
.ah-cg .ah-cg__px { display: -webkit-box; margin: 0; overflow: hidden; font-size: .9rem; line-height: 1.75; color: var(--ah-muted); -webkit-line-clamp: 3; -webkit-box-orient: vertical; }
.ah-cg .ah-cg__card--post:hover .ah-cg__go { color: var(--ah-ink); }

/* ---------- filter chips ---------- */
.ah-cg .ah-cg__chips { display: flex; flex-wrap: wrap; gap: 8px; }
.ah-cg .ah-cg__chips[hidden] { display: none; }
.ah-cg .ah-cg__chip.ah-cg__chip {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	width: auto;
	height: auto;
	margin: 0;
	padding: 6px 14px;
	border: 1px solid var(--ah-line);
	border-radius: 999px;
	background: var(--ah-paper);
	box-shadow: none;
	color: var(--ah-ink);
	font-family: var(--ah-f-body);
	font-size: .86rem;
	font-weight: 600;
	line-height: 1.5;
	letter-spacing: 0;
	text-transform: none;
	white-space: nowrap;
	cursor: pointer;
	transition: border-color .25s, color .25s, background-color .25s;
}
.ah-cg .ah-cg__chip.ah-cg__chip:hover { border-color: var(--ah-ink-gold); background: var(--ah-paper); color: var(--ah-ink-gold); }
.ah-cg .ah-cg__chip.ah-cg__chip[aria-pressed="true"] { border-color: var(--ah-navy); background: var(--ah-navy); color: var(--ah-on-navy); }
.ah-cg .ah-cg__chip .ah-cg__n { font-family: var(--ah-f-mono); font-weight: 500; font-size: .72rem; color: var(--ah-soft); }
.ah-cg .ah-cg__chip[aria-pressed="true"] .ah-cg__n { color: var(--ah-gold-hi); }
.ah-cg .ah-cg__chip:focus-visible { outline: 2px solid var(--ah-gold); outline-offset: 2px; }
.ah-cg.ah-on-dark .ah-cg__chip.ah-cg__chip { border-color: var(--ah-line-navy); background: rgba(255, 255, 255, .04); color: var(--ah-on-navy); }
.ah-cg.ah-on-dark .ah-cg__chip.ah-cg__chip[aria-pressed="true"] { border-color: var(--ah-gold); background: var(--ah-gold); color: var(--ah-deep); }
.ah-cg.ah-on-dark .ah-cg__chip[aria-pressed="true"] .ah-cg__n { color: var(--ah-deep); }

/* "view all" and the editor note */
.ah-cg .ah-cg__all { margin: 4px 0 0; }
.ah-cg .ah-cg__empty { margin: 0; padding: 28px; border: 1px dashed var(--ah-line); border-radius: 14px; background: var(--ah-paper); color: var(--ah-muted); text-align: center; }

@media (prefers-reduced-motion: reduce) {
	.ah-cg .ah-cg__card,
	.ah-cg .ah-cg__img,
	.ah-cg .ah-cg__fimg,
	.ah-cg .ah-cg__pimg,
	.ah-cg .ah-cg__vis,
	.ah-cg .ah-cg__cvin,
	.ah-cg .ah-itile { transition: none; }
	.ah-cg .ah-cg__card:hover .ah-itile,
	.ah-cg .ah-cg__card:hover .ah-cg__img,
	.ah-cg .ah-cg__card:hover .ah-cg__fimg,
	.ah-cg .ah-cg__card:hover .ah-cg__pimg,
	.ah-cg .ah-cg__card:hover .ah-cg__vis,
	.ah-cg .ah-cg__card--res:hover .ah-cg__cvin,
	.ah-cg .ah-cg__card--res:hover,
	.ah-cg .ah-cg__card--post:hover,
	.ah-cg .ah-cg__card--post:focus-within { transform: none; }
	.ah-motion .ah-cg .ah-cg__card.ah-rv { opacity: 1; translate: none; transition: none; }
}

@media (max-width: 1200px) {
	.ah-cg .ah-cg__grid,
	.ah-cg.ah-cg--res .ah-cg__grid { grid-template-columns: repeat(var(--ah-cg-cols, 2), minmax(0, 1fr)); }
}
@media (max-width: 767px) {
	.ah-cg { font-size: 16.5px; }
	.ah-cg .ah-cg__grid,
	.ah-cg.ah-cg--res .ah-cg__grid { grid-template-columns: repeat(var(--ah-cg-cols, 1), minmax(0, 1fr)); gap: 14px; }
	.ah-cg .ah-cg__card--service { padding: 22px 20px 18px; }
	.ah-cg .ah-cg__peek { aspect-ratio: 2.3; }
	.ah-cg .ah-cg__pbody { gap: 8px; padding: 16px 18px 18px; }
	/* chips scroll sideways instead of stacking rows */
	.ah-cg .ah-cg__chips { flex-wrap: nowrap; overflow-x: auto; margin-inline: calc(-1 * var(--ah-gutter, 16px)); padding-inline: var(--ah-gutter, 16px); padding-block-end: 4px; scrollbar-width: none; }
	.ah-cg .ah-cg__chips::-webkit-scrollbar { display: none; }
}
