/* Same black pill as post h2s */
.mbb-pill-heading {
	padding: 6px 22px 8px;
	border-radius: 999px;
	background: var(--mbb-black);
	font-family: var(--mbb-font-body);
	font-size: 22px;
	font-weight: 900;
	line-height: 1.2;
	letter-spacing: -0.03em;
	text-align: center;
	color: var(--mbb-yellow);
}

.mbb-items .mbb-pill-heading {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
}

.mbb-pill-heading__icon {
	flex: none;
	width: 28px;
	height: 28px;
	object-fit: contain;
}

.mbb-items__section {
	margin-top: 36px;
}

.mbb-items__section + .mbb-items__section {
	margin-top: 76px;
}

@media (max-width: 639px) {
	.mbb-items__section + .mbb-items__section {
		margin-top: 56px;
	}
}

.mbb-items-grid {
	display: grid;
	grid-template-columns: repeat(6, minmax(0, 1fr));
	gap: 28px 22px;
	align-items: start;
	margin: 26px 0 0;
	padding: 0;
	list-style: none;
}

.mbb-items-grid__item { --mbb-tilt: 1deg; }
.mbb-items-grid__item:nth-child(6n + 2) { --mbb-tilt: -0.8deg; }
.mbb-items-grid__item:nth-child(6n + 3) { --mbb-tilt: 0.6deg; }
.mbb-items-grid__item:nth-child(6n + 4) { --mbb-tilt: -1.1deg; }
.mbb-items-grid__item:nth-child(6n + 5) { --mbb-tilt: 0.8deg; }
.mbb-items-grid__item:nth-child(6n + 6) { --mbb-tilt: -0.5deg; }

@media (max-width: 1249px) {
	.mbb-items-grid {
		grid-template-columns: repeat(5, minmax(0, 1fr));
	}
}

@media (max-width: 1023px) {
	.mbb-items-grid {
		grid-template-columns: repeat(4, minmax(0, 1fr));
		gap: 24px 16px;
	}

	.mbb-pill-heading {
		padding: 6px 18px 7px;
		font-size: 19px;
	}
}

@media (max-width: 639px) {
	.mbb-items-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 20px 12px;
	}
}

.mbb-item-card {
	position: relative;
	overflow: hidden;
	background: var(--mbb-white);
	border: var(--mbb-stroke) solid var(--mbb-black);
	border-radius: var(--mbb-radius-lg);
	box-shadow: var(--mbb-shadow-md);
	transform: rotate(var(--mbb-tilt, 0deg));
	transition: transform 180ms ease;
}

@media (hover: hover) {
	.mbb-item-card:hover {
		z-index: 1;
		transform: rotate(0deg) scale(1.03);
	}
}

@media (prefers-reduced-motion: reduce) {
	.mbb-item-card {
		transition: none;
	}
}

.mbb-item-card__icon {
	display: flex;
	align-items: center;
	justify-content: center;
	aspect-ratio: 1 / 1;
	border-bottom: var(--mbb-stroke) solid var(--mbb-black);
	/* The game's equip slot background */
	background: var(--mbb-white) url(../img/item-bg.png) center / 100% 100% no-repeat;
}

.mbb-item-card__img {
	width: 72%;
	height: 72%;
	object-fit: contain;
}

.mbb-item-card__name {
	padding: 9px 8px 11px;
	font-size: 15px;
	font-weight: 900;
	line-height: 19px;
	text-align: center;
}
