.wp-block-acf-directory-department {
	margin: 0 !important;
	padding: var(--wp--preset--spacing--40) 0 !important;
}

	.wp-block-acf-directory-department-items {
		align-items: stretch !important;
		gap: var(--wp--style--block-gap) !important;
	}

		.wp-block-acf-directory-department-item {
			align-items: flex-end;
			display: flex;
			gap: 1rem;
			flex: 1 0 calc(50% - calc(2 * var(--wp--style--block-gap)));
			padding: 0 var(--wp--style--block-gap) var(--wp--style--block-gap) 0;
			text-align: left;
		}
		.wp-block-acf-directory-columns-1 .wp-block-acf-directory-department-item {
			flex: 1 0 100%;
		}
		.wp-block-acf-directory-columns-3 .wp-block-acf-directory-department-item {
			flex: 1 0 calc(33.333% - calc(3 * var(--wp--style--block-gap)));
		}
		
		.wp-block-acf-directory-department.no-photos .wp-block-acf-directory-department-item {
			align-items: flex-start;
			padding: 0 var(--wp--style--block-gap) 0 0;
		}

		.wp-block-acf-directory-department-image {
			border-radius: calc(var(--wp--style--block-gap) / 2);
			flex: 0 0 120px;
			overflow: hidden;
		}
		
			/* Needed to override display issues in Block Editor as of WP 7.1 -- STA -- 2026.08.31 */
			.wp-block-acf-directory-department-image img {
				display: block !important;
				height: auto !important;
				width: 120px !important;
			}
		
		.wp-block-acf-directory-department-details {
			font-size: var(--wp--preset--font-size--medium);
		}
		
@media screen and (min-width: 1025px) {

		.wp-block-acf-directory-department-item.full-width {
			flex: 1 0 100%;
			gap: 2rem;
		}
		
		.wp-block-acf-directory-department-item.full-width .wp-block-acf-directory-department-details h3 {
			font-size: var(--wp--preset--font-size--x-large) !important;
		}

		.wp-block-acf-directory-department-item.full-width .wp-block-acf-directory-department-details p {
			font-size: var(--wp--preset--font-size--large) !important;
		}

}

@media screen and (max-width: 1024px) {

	.wp-block-acf-directory-department-item {
		align-items: flex-end;
		display: flex;
		gap: 1rem;
		flex: 1 0 100%;
		padding: 0 var(--wp--style--block-gap) var(--wp--style--block-gap) 0;
		text-align: left;
	}
	.wp-block-acf-directory-columns-3 .wp-block-acf-directory-department-item {
		flex: 1 0 calc(50% - calc(2 * var(--wp--style--block-gap)));
	}

	.wp-block-acf-directory-department-item.full-width {
		flex: 1 0 100%;
		gap: 1rem;
	}
	
}

@media screen and (max-width: 768px) {

	.wp-block-acf-directory-columns-3 .wp-block-acf-directory-department-item {
		flex: 1 0 100%;
	}

}

@media screen and (max-width: 480px) {
	
}