.c-home-tile {
	position: relative;
	display: grid;
	grid-template-rows: max-content;

	&:hover,
	&:focus {
		&:after {
			opacity: 0.6;
		}
	}

	&.c-home-tile--portrait {
		aspect-ratio: 287 / 440;

		.c-home-tile__content {
			padding: 25px;
		}
	}

	&.c-home-tile--square {
		aspect-ratio: 1;

		.c-home-tile__content {
			padding: 12px;
		}
	}

	&:after {
		content: "";
		position: absolute;
		width: 100%;
		height: 100%;
		background-color: var(--color-primary);
		opacity: 0.3;
		transition: opacity 0.3s;
	}

	.c-home-tile__image {
		position: absolute;
		width: 100%;
		height: 100%;
		object-fit: cover;
	}

	.c-home-tile__content {
		position: relative;
		display: flex;
		flex-direction: column;
		justify-content: flex-end;
		color: var(--color-white);
		z-index: 1;
	}

	.c-home-tile__green-flag {
		position: relative;
		display: flex;
		width: 100%;
		justify-content: flex-end;
		padding: 12px;
		z-index: 1;

		@media (width > 767px) {
			position: absolute;
			top: 0;
			left: 0;
			z-index: 5;
		}

		svg {
			width: 100px;
			max-height: 45px;
		}
	}

	.c-home-tile__meta {
		display: flex;
		flex-direction: column;
		line-height: 1.6;
	}

	.c-home-tile__price {
		margin-top: 8px;
		font-size: 18px;
	}
}