.block-cookbook {
	--cookbook-corner: var(--wp--custom--layout--block-gap);
	font-size: var(--wp--preset--font-size--medium);
	line-height: var(--wp--custom--line-height--normal);
	/* Stepped corners from Cookbook 2. */
	clip-path: polygon(var(--cookbook-corner) 0, calc(100% - var(--cookbook-corner)) 0, calc(100% - var(--cookbook-corner)) var(--cookbook-corner), 100% var(--cookbook-corner), 100% calc(100% - var(--cookbook-corner)), calc(100% - var(--cookbook-corner)) calc(100% - var(--cookbook-corner)), calc(100% - var(--cookbook-corner)) 100%, var(--cookbook-corner) 100%, var(--cookbook-corner) calc(100% - var(--cookbook-corner)), 0 calc(100% - var(--cookbook-corner)), 0 var(--cookbook-corner), var(--cookbook-corner) var(--cookbook-corner));
}

.block-cookbook.has-background,
.editor-styles-wrapper .block-cookbook.has-background {
	padding: 0;
}

.block-cookbook.has-pattern-blue-speckle-background-color {
	color: var(--wp--preset--color--background);
}

.block-cookbook__wrap {
	display: grid;
	align-items: center;
	gap: var(--wp--custom--layout--block-gap);
	padding: calc(var(--wp--custom--layout--block-gap) * 2) calc(var(--wp--custom--layout--block-gap) * 1.5);
}

.block-cookbook__image {
	min-width: 0;
}

.block-cookbook__image img {
	display: block;
	width: 100%;
	height: auto;
	object-fit: contain;
}

.block-cookbook__content {
	min-width: 0;
}

.block-cookbook__content > * {
	max-width: none;
	margin-inline: 0;
}

/*
.block-cookbook__content::before {
	content: '';
	display: block;
	width: 24px;
	height: 24px;
	margin-bottom: var(--wp--custom--layout--block-gap);
	background: currentColor;
	mask: url('../../assets/icons/logo/supporting-nafas.svg') center / contain no-repeat;
}
*/

.block-cookbook__content :is(.is-style-heading, h2, h3) {
	font-size: var(--wp--preset--font-size--huge);
}

.block-cookbook__content .wp-element-button {
	background: var(--wp--preset--color--senary);
	color: var(--wp--preset--color--foreground);
}

.block-cookbook__content .wp-element-button:hover {
	background: var(--wp--preset--color--background);
	color: var(--wp--preset--color--primary);
}

@media (min-width: 768px) {
	.block-cookbook--has-image:not(.block-area-sidebar *, .cwp-editor-layout-sidebar *, .wp-block-column *) .block-cookbook__wrap {
		grid-template-columns: 311px minmax(0, 1fr);
		gap: var(--wp--custom--layout--block-gap-large);
		padding-inline: var(--wp--custom--layout--block-gap-large);
	}
}
