@layer views {
	main > header{
		padding-block: calc(var(--spacer) * 3) calc(var(--spacer) * 2);

		h1{
			font-size: 2.25em;

			@container content (max-width: 768px){
				font-size: 1.333em;

				br{
					display: none;
				}
			}
		}

		.editor-content{
			margin-bottom: var(--spacer);
		}
	}

	.featured-content{
		--column-gap: 0;

		padding-bottom: var(--section-padding);

		@container content (max-width: 768px){
			padding-bottom: 0;
		}
	}

	.primary-featured{
		position: relative;
		height: 100%;

		a{
			color: rgba(var(--color-white));
		}

		img{
			display: block;
			height: 100%;
			width: 100%;
			object-fit: cover;
			object-position: center;

			@container content (max-width: 768px){
				min-height: 50vh;
			}
		}

		h3{
			font-size: 2em;
			font-weight: 500;

			@container content (max-width: 768px){
				font-size: 1.555em;
			}
		}

		> div{
			padding: calc(var(--spacer) * 1.5) calc(var(--spacer) * 2.2) calc(var(--spacer) * 3);
			position: absolute;
			inset: auto 0 0;

			@container content (max-width: 768px){
				padding: calc(var(--spacer) * .777) var(--container-padding);
			}
		}
	}

	.secondary-featured{
		height: 100%;
		padding: calc(var(--spacer) * 1.8) calc(var(--spacer) * 2);
		display: flex;
		flex-direction: column;
		justify-content: space-around;

		 @container content (max-width: 768px){
			padding: calc(var(--spacer) * .777) var(--container-padding) calc(var(--spacer) * 1.5);

			h3{
				font-size: 1.111em;
			}
		 }

		hr{
			border-color: rgba(var(--color-white), .4);
		}

		.secondary-featured-item{
			 &:not(:first-child){
				@container content (max-width: 1024px){
					padding-top: calc(var(--spacer) * 1.8);
				}

				@container content (max-width: 768px){
					padding-top: calc(var(--spacer) * .777);
				}
			 }

			&:not(:last-child){
				@container content (max-width: 1024px){
					padding-bottom: calc(var(--spacer) * 1.8);
				}

				@container content (max-width: 768px){
					padding-bottom: calc(var(--spacer) * .777);
				}
			}
		}
	}

	.latest-alerts{
		--arrow-nudge: 74px;
		--container-max-width: min(calc(var(--root-width) - var(--arrow-nudge)), calc(100vw - var(--arrow-nudge)));

		padding-block: calc(var(--spacer) * 2.25) calc(var(--spacer) * 2.5);

		@container content (max-width: 768px){
			padding-block: var(--spacer);
		}

		h2{
			font-size: .888em;
			font-weight: 600;
			text-transform: uppercase;
			color: rgba(var(--color-dark-blue));
			margin-bottom: var(--spacer);

			@container content (max-width: 768px){
				margin-bottom: calc(var(--spacer) * .5);
			}
		}

		.glide__slides{
			align-items: center;
		}
	}

	.alert-item{
		--color-link: var(--color-text);
		--color-link-hover: var(--color-text);
		--color-link-visited: var(--color-text);

		display: flex;
		gap: calc(var(--spacer) * 1.75);
		flex-wrap: nowrap;
		align-items: center;
		padding-inline: calc(var(--spacer) * 1.4);

		&:not(:last-child){
			border-right: 1px solid rgba(var(--color-gray-25));

			@container content (max-width: 768px){
				border: none;
			}
		}

		@container content (max-width: 768px){
			padding-inline: 0;
			border: none;
		}

		h3{
			font-size: 1em;
			line-height: 1.333;
		}

		span{
			text-transform: uppercase;
		}

		.date{
			text-transform: uppercase;
			font-size: .777em;
			letter-spacing: 1.4px;
			text-align: center;

			div{
				color: rgba(var(--color-secondary));
				font-size: 2rem;
				font-weight: 700;
				letter-spacing: unset;
				line-height: 1;
			}
		}
	}

	.featured-stories{
		padding-block: var(--section-padding);

		@container content (max-width: 768px){
			padding-bottom: 0;
		}

		h2{
			color: rgba(var(--color-secondary));
		}

		h3{
			font-size: 1.8em;
			font-weight: 400;
			margin-bottom: 1.8rem;

			@container content (max-width: 768px){
				font-size: 1.555em;
			}
		}

		.story-item{
			@container content (max-width: 1024px){
				min-height: 100%;
				height: auto !important;

				> .row{
					height: 100%;
				}
			}

			@container content (max-width: 768px){
				height: 100% !important;
			}

			> .row{
				@container content (max-width: 768px){
					flex-direction: column-reverse;
				}
			}
		}

		.author{
			--color-link: var(--color-text);
			--color-link-hover: var(--color-text);
			--color-link-visited: var(--color-text);

			display: flex;
			column-gap: var(--column-gap);
			align-items: center;
			font-size: .888em;
			font-weight: 600;
			margin-bottom: var(--spacer);

			@container content (max-width: 768px){
				font-size: .777em;
			}

			img{
				border: 1px solid rgba(var(--color-gray-5));
				border-radius: 50%;
				width: 54px;
				height: 54px;
			}
		}

		.featured-story-content{
			padding: calc(var(--spacer) * 2) 0 calc(var(--spacer) * 2) calc(var(--spacer) * 3.333);

			@container content (min-width: 769px) and (max-width: 900px){
				--flex-width: 100%;

				+ div{
					--flex-width: 100%;

					order: -1;
				}
			}

			@container content (max-width: 768px){
				padding: var(--spacer) calc(var(--container-padding) + 7px);
			}
		}

		.featured-story-image{
			display: block;
			width: 100%;
			height: 510px;
			object-fit: cover;

			@container content (max-width: 1024px){
				height: 100%;
			}

			@container content (min-width: 769px) and (max-width: 900px){
				--flex-width: 100%;
			}

			@container content (max-width: 768px){
				max-height: 300px;
			}
		}

		.article-actions{
			display: flex;
			align-items: center;
			gap: var(--spacer);
			margin-top: var(--spacer);

			@container content (max-width: 768px){
				flex-direction: column;
				row-gap: var(--column-gap);
				align-items: stretch;
				text-align: center;
			}
		}
	}

	.mobility{
		.block-actions{
			display: flex;
			align-items: center;
			column-gap: var(--column-gap);

			@container content (max-width: 1024px){
				flex-direction: column;
				row-gap: var(--column-gap);
				align-items: stretch;
				text-align: center;
			}
		}

		.background-image-caption{
			left: 0;
			right: 66vw;
			text-align: right;

			@container content (max-width: 768px){
				left: 0;
				right: 50vw;
			}
		}
	}
}