.ahrbg-grid-wrapper {
	--ahrbg-columns: 4;
	--ahrbg-gap: 18px;
	--ahrbg-min-tile-height: 280px;
	--ahrbg-radius: 24px;
	--ahrbg-overlay-opacity: .42;
	--ahrbg-overlay-opacity-hover: .28;
	--ahrbg-gradient-strength: .72;
	--ahrbg-card-bg: #111111;
	--ahrbg-border-color: rgba(250, 250, 250, .10);
	--ahrbg-border-color-hover: rgba(201, 169, 110, .55);
	width: 100%;
	background: transparent;
}

.ahrbg-grid {
	display: grid;
	grid-template-columns: repeat(var(--ahrbg-columns), minmax(0, 1fr));
	grid-auto-rows: minmax(var(--ahrbg-min-tile-height), auto);
	grid-auto-flow: row;
	gap: var(--ahrbg-gap);
	width: 100%;
}

.ahrbg-card {
	position: relative;
	display: flex;
	min-height: var(--ahrbg-min-tile-height);
	overflow: hidden;
	isolation: isolate;
	border: 1px solid var(--ahrbg-border-color);
	border-radius: var(--ahrbg-radius);
	background: var(--ahrbg-card-bg);
	color: #fafafa;
	text-decoration: none;
	transform: translateY(0);
	transition: transform .28s ease, border-color .28s ease, box-shadow .28s ease;
}

.ahrbg-card:hover,
.ahrbg-card:focus-visible {
	border-color: var(--ahrbg-border-color-hover);
}

.ahrbg-card[href]:hover {
	transform: translateY(-3px);
	box-shadow: 0 20px 60px rgba(0, 0, 0, .24);
}

.ahrbg-card:focus-visible {
	outline: 2px solid #c9a96e;
	outline-offset: 4px;
}

.ahrbg-card__media {
	position: absolute;
	inset: 0;
	z-index: 0;
	background-image: var(--ahrbg-card-image);
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	transform: scale(1);
	transition: transform .45s ease;
}

.ahrbg-card:hover .ahrbg-card__media {
	transform: scale(1.02);
}

.ahrbg-card__media::after {
	position: absolute;
	inset: 0;
	content: "";
	background:
		linear-gradient(
			180deg,
			rgba(10, 10, 10, .04) 0%,
			rgba(10, 10, 10, calc(var(--ahrbg-gradient-strength) * .55)) 58%,
			rgba(10, 10, 10, var(--ahrbg-gradient-strength)) 100%
		);
}

.ahrbg-card__overlay {
	position: absolute;
	inset: 0;
	z-index: 1;
	background: #0a0a0a;
	opacity: var(--ahrbg-overlay-opacity);
	transition: opacity .28s ease;
}

.ahrbg-card:hover .ahrbg-card__overlay,
.ahrbg-card:focus-visible .ahrbg-card__overlay {
	opacity: var(--ahrbg-overlay-opacity-hover);
}

.ahrbg-card__content {
	align-self: flex-end;
	position: relative;
	z-index: 2;
	width: 100%;
	padding: clamp(20px, 3vw, 34px);
}

.ahrbg-card__eyebrow {
	margin: 0 0 10px;
	color: #c9a96e;
	font-family: "JetBrains Mono", "Courier New", monospace;
	font-size: 11px;
	font-weight: 500;
	line-height: 1.35;
	letter-spacing: .14em;
	text-transform: uppercase;
}

.ahrbg-card__title {
	margin: 0;
	color: #fafafa;
	font-family: Archivo, "Helvetica Neue", Arial, sans-serif;
	font-size: clamp(23px, 2.1vw, 36px);
	font-weight: 760;
	line-height: 1.02;
	letter-spacing: 0;
}

.ahrbg-card__description {
	max-width: 40rem;
	margin: 14px 0 0;
	color: rgba(250, 250, 250, .68);
	font-family: "Helvetica Neue", Arial, sans-serif;
	font-size: 15px;
	line-height: 1.55;
	letter-spacing: 0;
}

.ahrbg-grid-wrapper--description-hover .ahrbg-card__description {
	opacity: 1;
	transform: none;
	transition: opacity .24s ease, transform .24s ease;
}

@media (hover: hover) and (pointer: fine) {
	.ahrbg-grid-wrapper--description-hover .ahrbg-card__description {
		opacity: 0;
		transform: translateY(6px);
	}

	.ahrbg-grid-wrapper--description-hover .ahrbg-card:hover .ahrbg-card__description,
	.ahrbg-grid-wrapper--description-hover .ahrbg-card:focus-visible .ahrbg-card__description {
		opacity: 1;
		transform: translateY(0);
	}
}

@media (min-width: 1025px) {
	.ahrbg-grid {
		grid-auto-flow: dense;
	}

	.ahrbg-card--wide,
	.ahrbg-card--large {
		grid-column: span 2;
	}

	.ahrbg-card--tall,
	.ahrbg-card--large {
		grid-row: span 2;
	}

	.ahrbg-grid-wrapper--no-spans .ahrbg-card {
		grid-column: span 1;
		grid-row: span 1;
	}
}

@media (min-width: 768px) and (max-width: 1024px) {
	.ahrbg-grid {
		grid-auto-flow: row;
	}

	.ahrbg-card--wide,
	.ahrbg-card--large {
		grid-column: span 2;
	}

	.ahrbg-card--tall {
		grid-column: span 1;
	}

	.ahrbg-card__title {
		font-size: clamp(22px, 3.4vw, 31px);
	}
}

@media (max-width: 767px) {
	.ahrbg-grid {
		grid-template-columns: 1fr;
		grid-auto-flow: row;
	}

	.ahrbg-card,
	.ahrbg-card--normal,
	.ahrbg-card--wide,
	.ahrbg-card--tall,
	.ahrbg-card--large {
		grid-column: span 1;
		grid-row: span 1;
	}

	.ahrbg-card[href]:hover {
		transform: none;
	}

	.ahrbg-card__content {
		padding: 22px;
	}

	.ahrbg-card__title {
		font-size: 26px;
	}

	.ahrbg-card__description {
		font-size: 14px;
	}
}