@use "../tools/mixins";

/*-------------------------------------------------------
Section "Keep reading" (style 1)
-------------------------------------------------------*/

.section--keep-reading-1 {

	.section__header {

		@include mixins.media("break-mobile", max) {
			flex-direction: column;
  			align-items: flex-start;
  			row-gap: 0.25rem;
		}
	}

	.wp-block-post-template.wp-block-post-template-is-layout-grid.columns-4 {
		row-gap: var(--wp--preset--spacing--20);

		@include mixins.media("break-small", max) {
			grid-template-columns: 1fr;
		}

		@include mixins.media("break-small") {
			grid-template-columns: repeat(2, minmax(0, 1fr));
		}

		@include mixins.media("break-wide") {
			grid-template-columns: repeat(4, minmax(0, 1fr));
		}
	}

	.wp-block-post {

		&:nth-child(3n-2) {

			.wp-block-post-featured-image {
				aspect-ratio: 1 !important;
			}
		}

		&:nth-child(3n) {

			.wp-block-post-featured-image {
				aspect-ratio: 4/3 !important;
			}
		}
	}
}
