Resources Block

.ResourcesBlock {
	.Block__title {
		@apply mb-6
			md:mb-8
			leading-tense;
	}

	.Block__copy {
		@apply mb-8
			md:mb-12;
	}

	.Block__items {
		@apply grid
			sm:grid-cols-2
			md:max-lg:grid-cols-3
			lg:max-xl:grid-cols-2
			xl:grid-cols-3
			2xl:grid-cols-4
			gap-x-4
			gap-y-8
			md:gap-8
			md:gap-y-10;
	}

	.Block__item {
		@apply border-t
			border-white
			border-opacity-20
	}

	.Block__action {
		@apply block
			min-h-[3rem]
			mt-6
			xs:pr-14
			text-base
			font-bold
			leading-snug
			break-words
			bg-[right_bottom]
      xs:bg-[right_top]
      bg-[length:45px_45px]
      bg-no-repeat;

		span {
			@apply inline-block
				py-1
				px-2
				text-xs
				rounded-xs;
		}
	}

	&.Theme {
    &:not(.Theme--none) {
			.Block__action {
				@apply bg-arrow-right-circle-white
					max-xs:pb-14;

				span {
					@apply opacity-50
						border
						border-white;
				}
			}
		}

		&--none {
			@apply border
				border-gray-400
				rounded-md;

			&.Block {
				.container {
					@apply pb-0;
				}
			}

			.Block__text, .Block__items {
				@apply px-5
					py-5
					md:px-10
					md:py-10;
			}

			.Block__text {
				@apply border-b
					border-gray-300;
			}

			.Block__copy {
				@apply mb-0;
			}

			.Block__items {
				@apply gap-7
					md:gap-10
					max-md:py-8;
			}

			.Block__action {
				@apply mt-0
					p-0;

				span {
					@apply text-white
						bg-blue;
				}
			}
		}
	}
}

.Layout--full {
	.ResourcesBlock {
		.Block__title {
			@apply 2xl:mb-12
				2xl:text-4xl;
		}

		.Block__items {
			@apply 2xl:gap-16;
		}

		.Block__action {
			@apply 2xl:text-lg;
		}
	}
}