.holy-container {
	display: grid;
	gap: 3rem;
	margin-bottom: 1rem;
}

	.holy-image {
		width: 100%;
		border-radius: 2px;
		box-shadow: 0 0 4px 0 rgb(0 0 0 / 25%);
	}

/***************/
/* Search bar */

.holy-searchbar {
	display: flex;
	margin-bottom: 3rem;
}

.holy-searchbar__bar {
	height: 100%;
}

	.holy-searchbar__bar:focus {
		border-color: #1a4684;
		box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%), 0 0 8px rgb(26 70 132 / 40%);
	}


.holy-searchbar__button {
	border: 1px solid rgb(26 70 132 / 40%);
	transition: 200ms background-color;
}

	.holy-searchbar__button:hover {
		border: 1px solid rgb(26 70 132 / 40%);
		background-color: rgb(0 0 0 / 8%);
	}

	.holy-searchbar__button:focus,
	.holy-searchbar__button:focus-visible {
		outline: none;
	}

/***************/
/* HOLY BOXES */
.holy-boxes {
	display: grid;
	gap: 2rem;
	grid-template-columns: repeat(4, 1fr);
}

@media (max-width: 768px) {
	.holy-boxes {
		grid-template-columns: repeat(2, 1fr);
	}
}

.holy-boxes__box {
	position: relative;
	overflow: hidden;
	height: 15rem;
	background-color: white;
	border-radius: 2px;
	overflow: hidden;
	transition: 200ms box-shadow ease-in-out;
	box-shadow: 0 0 6px 0 rgb(0 0 0 / 10%);
}

	.holy-boxes__box:hover {
		box-shadow: 0 0 6px 4px rgb(0 0 0 / 15%);
	}

	.holy-boxes__box::after {
		content: '';
		display: block;
		position: absolute;
		left: 0;
		height: 100%;
		width: 100%;
		transform: scale(1.5);
		transition: 300ms bottom ease-in-out;
		background: linear-gradient(0, rgb(0 0 0 / 12%), white);
		bottom: -150%;
	}

	.holy-boxes__box:hover::after {
		bottom: 25%;
	}

.holy-boxes__link {
	color: rgb(188 83 93);
	display: block;
	padding: 1rem 2rem;
	height: 100%;
	width: 100%;
	font-size: 30px;
}

.holy-boxes__link:hover {
	color: rgb(188 83 93) !important;
}

	.holy-boxes__arrow {
	position: absolute;
	height: 2rem;
	width: 3rem;
	right: 2rem;
	fill: rgb(68 68 68);
	transition: 300ms bottom ease-in, 200ms opacity;
	opacity: 0;
	bottom: -2rem;
}

.holy-boxes__box:hover .holy-boxes__arrow {
	opacity: 1;
	bottom: 1rem;
}


/***************/
/*   TAG LIST  */

.holy-taglist {
	display: grid;
	grid-template-columns: repeat(8, minmax(0, 120px));
	gap: 3rem;
	justify-content: center;
	text-align: center;
}

@media (max-width: 768px) {
	.holy-taglist {
		grid-template-columns: repeat(4, minmax(0, 120px));
	}
}

.holy-taglist__item {
	-webkit-user-select: none;
	user-select: none;
	transition: 0.2s transform ease-out;
}

	.holy-taglist__item:hover {
		transform: scale(1.12);
	}

.holy-taglist__image {
	border-radius: 100%;
	background-color: white;
	padding: 0.75rem;
	overflow: hidden;
}

.holy-taglist__tag {
	overflow-wrap: break-word;
	font-size: 75%;
}