/* Borromeo Hover Gallery */
.bhg {
	display: flex;
	gap: var(--bhg-gap, 20px);
	height: var(--bhg-height, 600px);
	width: 100%;
}

.bhg-col {
	position: relative;
	flex: 1 1 0;
	min-width: 0;
	display: block;
	border-radius: var(--bhg-radius, 15px);
	overflow: hidden;
	background-size: cover;
	background-position: center;
	cursor: pointer;
	text-decoration: none;
	outline: none;
	transition: flex 0.65s cubic-bezier(0.33, 0, 0.2, 1);
}

/* Hover devices: the hovered column grows, siblings give way */
@media (hover: hover) {
	.bhg-col:hover,
	.bhg-col:focus-visible {
		flex-grow: var(--bhg-expand, 2.6);
	}
}

/* Touch devices: tap toggles .is-active (bhg.js) */
.bhg-col.is-active {
	flex-grow: var(--bhg-expand, 2.6);
}

.bhg-col:focus-visible {
	box-shadow: 0 0 0 3px #c2aa22;
}

/* Tablet */
@media (max-width: 991px) {
	.bhg {
		height: calc(var(--bhg-height, 600px) * 0.7);
	}
}

/* Mobile: stacked */
@media (max-width: 767px) {
	.bhg {
		flex-direction: column;
		height: auto;
	}
	.bhg-col {
		flex: none !important;
		height: 220px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.bhg-col {
		transition: none;
	}
}