.multicolumn {

	.multicolumn__header {

		.multicolumn__eyebrow {
			margin: 0 0 6px 0;
			color: var(--color-primary);
		}

		.multicolumn__heading {
			margin: 0;
		}

		.multicolumn__description {
			margin: 10px 0 0 0;
			font-size: 18px;
		}

	}

	.multicolumn__items {
		display: grid;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 10px;
		margin: 30px 0 0 0;

		.multicolumn__item {
			min-width: 0;

			.multicolumn__link {
				position: relative;
				display: block;
				width: 100%;
				height: 100%;
				overflow: hidden;
				aspect-ratio: 1.3 / 1;
				border: 1px solid var(--border-white);
				border-radius: 6px;
				transition: .3s all;

				@media (max-width: 767px) {
					aspect-ratio: 1.5 / 1;
				}

				&:hover {
					border-color: var(--color-primary);
				}

				.multicolumn__media {
					position: absolute;
					inset: 0;
					width: 100%;
					height: 100%;

					.multicolumn__image {
						display: block;
						width: 100%;
						height: 100%;
						object-fit: cover;
					}

					&::after {
						content: "";
						position: absolute;
						inset: 0;
						background: linear-gradient(
							to top,
							rgba(0, 0, 0, 0.8) 0%,
							rgba(0, 0, 0, 0) 65%
						);
					}

				}

				.multicolumn__icon {
					position: absolute;
					top: 20px;
					left: 20px;
					z-index: 2;
					width: 46px;
					height: 46px;
					border-radius: 4px;
					border: 1px solid var(--color-primary);
					background: var(--color-black);
					display: flex;
					justify-content: center;
					align-items: center;

					@media (max-width: 767px) {
						top: 16px;
						left: 16px;
					}

					img {
						display: block;
						width: auto;
						max-width: 23px;
						width: 23px;
						height: auto;
						@media (max-width: 767px) {
							width: 22px;
							height: 22px;
							object-fit: contain;
						}
					}

				}

				.multicolumn__content {
					position: relative;
					z-index: 2;
					display: flex;
					align-items: flex-end;
					justify-content: space-between;
					gap: 20px;
					height: 100%;
					padding: 30px;

					@media (max-width: 767px) {
						padding: 16px;
					}

					.multicolumn__content-inner {

						.multicolumn__item-title {
							margin: 0;
						}

						.multicolumn__item-description {
							font-size: 18px;
							margin: 4px 0 0 0;
							font-weight: 200;
							@media (max-width: 767px) {
								font-size: 14px;
							}
						}

					}

					.multicolumn__arrow {
						flex-shrink: 0;

						svg {
							display: block;
						}

					}

				}

			}

		}

	}

	@media (max-width: 989px) {

		.multicolumn__items {
			grid-template-columns: repeat(2, minmax(0, 1fr));
		}

	}

	@media (max-width: 767px) {

		.multicolumn__header {

			.multicolumn__eyebrow {

			}

			.multicolumn__heading {

			}

			.multicolumn__description {

			}

		}

		.multicolumn__items {
			grid-template-columns: 1fr;

			.multicolumn__item {

				.multicolumn__link {

					.multicolumn__media {

					}

					.multicolumn__icon {

					}

					.multicolumn__content {

						.multicolumn__content-inner {

							.multicolumn__item-title {

							}

							.multicolumn__item-description {

							}

						}

						.multicolumn__arrow {

						}

					}

				}

			}

		}

	}

}