.wp-block-hdc-latest-videos {
	--_default-lines: 0 0 0;
	--_dotted-lines: var(--_post-summary-lines, var(--_default-lines));
}

.wp-block-hdc-latest-videos__header {
	justify-content: space-between;
/*	margin-block-end: var(--wp--preset--spacing--medium);*/
}

.wp-block-hdc-latest-videos__heading {
	flex-basis: 0;
	flex-grow: 999;
	min-inline-size: 67%;
}

.wp-block-hdc-latest-videos__heading:where(:not(:has(*))) {
	display: none;
}

.wp-block-hdc-latest-videos__header .wp-block-hdc-latest-videos__button {
	display: none;
}

.wp-block-hdc-latest-videos__header:has(.wp-block-heading, .wp-block-buttons) {
    margin-bottom: var(--wp--preset--spacing--medium);
}

.wp-block-hdc-latest-videos__footer {
	margin-block-start: var(--wp--preset--spacing--medium);
}

.wp-block-hdc-latest-videos__button {
	flex-grow: 1;
}

.editor-styles-wrapper .wp-block-hdc-latest-videos a,
.editor-styles-wrapper .wp-block-hdc-latest-videos iframe {
	pointer-events: none;
}

.wp-block-hdc-latest-videos .post-summary__icon {
	block-size: 1em;
	inline-size: 1em;
	margin-inline-end: 0.5ex;
	transform: translateY(-0.125ex);
	vertical-align: middle;
}

.archive-posts {
	--_archive-columns: 1;
	align-items: start;
	gap: 1.25rem;
	grid-template-columns: repeat(var(--_archive-columns), 1fr);
	margin-block-start: var(--wp--preset--spacing--large);
}

.wp-block-hdc-latest-videos .archive-posts {
	gap: 1.25rem;
}

/*.featured-grid {
	gap: 2.5rem 1.25rem;
}*/

.wp-block-hdc-latest-videos .featured-grid-top {
	align-items: start;
	background-image: linear-gradient(90deg, rgb(var(--_dotted-lines) / 0.2) 25%, transparent 25%);
	background-position: 50% 100%;
	background-repeat: space no-repeat;
	background-size: 8px 2px;
	gap: 1.25rem 2.5rem;
	padding-block-end: 1.25rem;
}

.wp-block-hdc-latest-videos .featured-grid-top {
	background-image: none;
	gap: 1.25rem 2.5rem;
	padding-block-end: 0;
}

.post-summary {
	align-items: stretch;
	box-sizing: border-box;
	flex-direction: column;
	position: relative;
}

.wp-block-hdc-latest-videos .post-summary {
	align-items: stretch;
}

.post-summary__placeholder {
	aspect-ratio: 1920 / 1080;
	object-fit: cover;
}

.post-summary__video iframe {
	inline-size: 100%;
	max-inline-size: 100%;
}

.wp-block-hdc-latest-videos .post-summary__thumbnail {
	display: block;
	inline-size: 100%;
	position: relative;
}

.wp-block-hdc-latest-videos .post-summary__thumbnail::before {
	background-color: rgb(0 0 0 / 0.5);
	block-size: 100%;
	content: "";
	inline-size: 100%;
	inset-block-start: 0;
	inset-inline-start: 0;
	position: absolute;
	pointer-events: none;
}

.wp-block-hdc-latest-videos .post-summary__thumbnail::after {
	background-color: var(--wp--preset--color--base);
	content: "";
	inset: 0;
	mask-image: url("../../assets/elements/play-circle.svg");
	mask-position: 50% 50%;
	mask-repeat: no-repeat;
	mask-size: 4.375rem 4.375rem;
	position: absolute;
	pointer-events: none;
}

.post-summary__thumbnail img {
	border: 4px solid;
	border-radius: 10px;
	inline-size: 100%;
}

.post-summary__title {
	font-size: var(--wp--preset--font-size--large);
}

.post-summary__categories {
	--wp--custom--spacing--block-gap-override: var(--wp--preset--spacing--small);
}

.post-summary__category {
	--_border-color: var(--wp--preset--color--primary);
	border: 2px solid var(--_border-color);
	border-radius: 100vmax;
	display: inline-block;
	font-weight: 700;
	line-height: 1;
	padding: 0.25rem 0.5rem;
	text-decoration: none;
	text-transform: uppercase;
}

.post-summary__category:nth-child(even) {
	--_border-color: var(--wp--preset--color--quaternary);
}

.post-summary--featured .post-summary__title {
	font-size: var(--wp--preset--font-size--huge);
}

.post-summary__icon {
	transform: translateY(-0.125ex);
	margin-inline-end: 0.5ex;
}

.wp-block-hdc-latest-videos .featured-grid-top .post-summary:where(:not(.post-summary--featured)) {
	background-image: linear-gradient(90deg, rgb(var(--_dotted-lines) / 0.2) 25%, transparent 25%);
	background-position: 50% 0%;
	background-repeat: space no-repeat;
	background-size: 8px 2px;
	padding-block-start: 1.25rem;
}

@media ( width > 800px ) {
	:where(.archive, .blog) .archive-posts {
		--_archive-columns: 2;
	}

	:where(.archive, .blog) .featured-grid {
		--_archive-columns: 3;
	}

	.featured-grid-top {
		grid-auto-columns: 1fr;
		grid-column: 1 / -1;
	}

	.featured-grid-top .post-summary--featured {
		grid-area: featured;
		position: relative;
	}

	/*.featured-grid-top .post-summary:nth-child(2) {
		position: relative;
	}*/

	.wp-block-hdc-latest-videos .featured-grid-top .post-summary--featured::before {
		background-image: linear-gradient(0deg, rgb(var(--_dotted-lines) / 0.2) 25%, transparent 25%);
		background-position: 100% 0%;
		background-repeat: no-repeat space, no-repeat space;
		background-size: 2px 8px;
		block-size: 100%;
		content: "";
		display: block;
		inline-size: 2px;
		inset-block-start: 0;
		inset-inline-end: -1.25rem;
		position: absolute;
	}

	.wp-block-hdc-latest-videos__footer {
		display: none;
	}

	.wp-block-hdc-latest-videos__header .wp-block-hdc-latest-videos__button {
		display: flex;
	}

	.wp-block-hdc-latest-videos__heading:where(:not(:has(*))) + .wp-block-buttons {
		justify-content: end;
	}
}

@media ( 800px < width <= 1000px ) {
	:where(.featured-grid) .featured-grid-top {
/*		align-content: stretch;*/
		align-items: stretch;
		gap: 1rem 2.5rem;
		grid-template-areas:
			"featured post1"
			"featured post2"
			"featured post3"
			"featured post4";
/*			"featured .";*/
	}

	.wp-block-hdc-latest-videos :where(.featured-grid) .featured-grid-top {
		gap: 1rem 2.5rem;
	}

	.featured-grid-top .post-summary {
		align-items: start;
		flex-direction: row;
		flex-wrap: nowrap;
	}

	.wp-block-hdc-latest-videos .featured-grid-top .post-summary:where(:not(.post-summary--featured)) {
		background-image: none;
		padding-block-start: 0;
	}

	.featured-grid-top .post-summary__thumbnail {
		flex-basis: 50%;
		flex-shrink: 0;
	}
}

@media ( width > 1000px ) {
	:where(.archive, .blog) .archive-posts {
		--_archive-columns: 4;
		margin-inline: auto;
		max-inline-size: var(--wp--custom--layout--wide-size);
	}

	:where(.archive, .blog) .featured-grid {
		--_archive-columns: 3;
		gap: 2.5rem;
	}

	.wp-block-hdc-latest-videos .featured-grid {
		gap: 2.5rem;
	}

	:where(.featured-grid) .featured-grid-top {
		align-items: stretch;
		grid-template-areas:
			"featured featured post1 post2"
			"featured featured post3 post4";
/*			"featured featured . .";*/
		padding-block-end: 2.5rem;
		row-gap: 0;
	}

	.wp-block-hdc-latest-videos :where(.featured-grid) .featured-grid-top {
		grid-template-areas:
			"featured featured featured post1"
			"featured featured featured post2"
			"featured featured featured post3";
		row-gap: 0;
	}

	/*.featured-grid-top .post-summary:where(:not(.post-summary--featured)) {
		padding-block-end: 1.25rem;
	}*/

	.wp-block-hdc-latest-videos .featured-grid-top .post-summary:nth-child(even)::before {
		background-image: linear-gradient(0deg, rgb(var(--_dotted-lines) / 0.2) 25%, transparent 25%);
		background-position: 100% 0%;
		background-repeat: no-repeat space, no-repeat space;
		background-size: 2px 8px;
		block-size: 100%;
		content: "";
		display: block;
		inline-size: 2px;
		inset-block-start: 0;
		inset-inline-end: -1.25rem;
		position: absolute;
	}

	.wp-block-hdc-latest-videos .featured-grid-top .post-summary:nth-child(even)::before {
		content: none;
	}

	.wp-block-hdc-latest-videos .featured-grid-top .post-summary:where(:nth-child(n+2):nth-child(-n+3)) {
		background-image: none;
		padding-block-end: 1.25rem;
		padding-block-start: 0;
	}

	.wp-block-hdc-latest-videos .featured-grid-top .post-summary:where(:nth-child(n+3)) {
		background-image: linear-gradient(90deg, rgb(var(--_dotted-lines) / 0.2) 25%, transparent 25%);
		background-position: 50% 0%;
		background-repeat: space no-repeat;
		background-size: 8px 2px;
		padding-block-start: 1.25rem;
	}

	/*.wp-block-hdc-latest-videos .featured-grid .post-summary:where(:nth-child(n+4)) {
		padding-block-start: 0;
	}*/
}