.banner {
	.container {
		.row {
			position: relative;

			.bg-gradient {
				position: absolute;
				bottom: 0;
				left: 50%;
				transform: translateX(-50%);
				width: 100%;
				max-width: 1440px;
				height: 215px;
				background: var(--Deep-Void-Purple, #542985);
				filter: blur(250px);
				z-index: -1;
			}

			.breadcrumb {
				a {
					display: flex;
					flex-direction: row;
					align-items: center;
					gap: 5px;
					color: var(--royal-electric) !important;
					text-decoration: none;

					&:hover {
						color: var(--neon-violet) !important;
					}

					svg {
						width: 20px;
					}
				}
			}

			img {
				border-radius: 20px;
				width: 100%;
				height: 500px;
				object-fit: cover;
				object-position: center;

				@media (max-width: 1024px) {
					height: 300px;
				}
			}
		}

		.post-meta-wrapper {
			@media (max-width: 767px) {
				display: flex;
				flex-direction: column;
				align-items: flex-start;
			}

			.publish-date {
				color: var(--royal-electric);
			}
		}
	}
}