.block-call-to-action {
	display: grid;
	padding: 0;
}

.block-call-to-action,
.full-width-content .block-call-to-action {
	max-width: var(--wp--custom--layout--content);
	margin-left: auto;
	margin-right: auto;
}

.block-call-to-action__image img {
	width: 100%;
}
@supports( aspect-ratio: 1) {
	.block-call-to-action__image img {
		aspect-ratio: 580 / 448;
		object-fit: cover;
	}
}
/* Call to Action (2026): a photo with a text card laid over its edge. The card is linen (ivory
   when the band around it is linen), softly lifted off the photo; the words are centred: small
   Brass Dark caps, a Fraunces title over a short brass rule, the line about it, then the button.
   Corners and the lift use the theme's tokens, like the opt-in card. A card given a dark
   background in the editor (Primary, Mid green, Green) takes ivory words and brass caps. */
.block-call-to-action__inner {
	font-size: 1.0625rem;
	line-height: 1.55;
	z-index: 1;
	background-color: var(--wp--preset--color--secondary);
}
.block-call-to-action:not(.is-style-product-card) > .block-call-to-action__inner {
	text-align: center;
	border-radius: var(--wp--custom--border-radius--small);
	box-shadow: var(--wp--custom--box-shadow--soft);
}
/* The card's default fill is linen (block.json; render.php leaves it to this file), so on a linen
   band it turns ivory to stand out */
.has-secondary-background-color .block-call-to-action__inner:not(.has-background) {
	background-color: var(--wp--preset--color--background);
}
.block-call-to-action__image img {
	border-radius: var(--wp--custom--border-radius--small);
}
.block-call-to-action__inner:is(.has-primary-background-color, .has-tertiary-background-color, .has-green-background-color) {
	--cta-ink: var(--wp--preset--color--background);
	--cta-caps: var(--wp--preset--color--quaternary);
	color: var(--cta-ink);
}
.block-call-to-action .block-call-to-action__inner,
.editor-styles-wrapper .block-call-to-action .block-call-to-action__inner {
	padding: 1.875rem;
}
.block-call-to-action__inner > *,
.editor-styles-wrapper .block-call-to-action__inner > * {
	margin: 0 auto;
}
.block-call-to-action__inner > * + *,
.editor-styles-wrapper .block-call-to-action__inner > * + * {
	margin-top: 1.25rem;
}
.block-call-to-action__inner > .block-call-to-action__subtitle + *,
.block-call-to-action__inner > .block-call-to-action__title + * {
	margin-top: 0.75rem;
}
.block-call-to-action__subtitle {
	font-family: var(--wp--preset--font-family--secondary);
	font-size: var(--wp--custom--caps--label);
	font-weight: 700;
	letter-spacing: var(--wp--custom--caps--tracking-label);
	line-height: var(--wp--custom--line-height--small);
	text-transform: uppercase;
	color: var(--cta-caps, var(--wp--preset--color--brass-dark));
}
.block-call-to-action .block-call-to-action__title {
	font-family: var(--wp--preset--font-family--heading);
	font-size: clamp(1.625rem, 1.2rem + 1.2vw, 2.125rem);
	font-weight: 700;
	letter-spacing: 0;
	line-height: 1.1;
	text-transform: none;
	color: var(--cta-ink, var(--wp--preset--color--black));
}
.block-call-to-action:not(.is-style-product-card) .block-call-to-action__title::after {
	content: "";
	display: block;
	width: var(--wp--custom--title-rule--width);
	height: 1px;
	margin: var(--wp--custom--title-rule--gap) auto 0;
	background: var(--wp--preset--color--quaternary);
}

.editor-styles-wrapper .wp-block.wp-block-cwp-call-to-action.has-background {
	background-color: transparent !important;
	padding: 0;
}

@media only screen and (max-width: 767px) {
	.wp-block-group.has-background:is(.alignwide, .alignfull) > .block-call-to-action:not(.is-style-product-card) .block-call-to-action__image {
		margin-left: calc(-1 * var(--wp--custom--layout--padding));
		margin-right: calc(-1 * var(--wp--custom--layout--padding));
	}
	.wp-block-group.has-background:is(.alignwide, .alignfull) > .block-call-to-action:not(.is-style-product-card):first-child .block-call-to-action__image {
		margin-top: calc(-1 * var(--wp--custom--layout--block-gap-large));
	}
	.wp-block-group.has-background.alignwide > .block-call-to-action:not(.is-style-product-card):first-child .block-call-to-action__image {
		margin-top: calc(-1 * var(--wp--custom--layout--block-gap));
	}
	.block-call-to-action:not(.is-style-product-card) .block-call-to-action__image img {
		min-height: 15rem;
	}
	.block-call-to-action__featured-image:not(.is-style-product-card) > .block-call-to-action__inner {
		align-self: end;
		margin: calc(-1 * 7.5rem) 1.875rem 0;
	}

	.wp-block-group.has-background:is(.alignwide, .alignfull) > .block-call-to-action__featured-image:not(.is-style-product-card) > .block-call-to-action__inner {
		margin-left: 0;
		margin-right: 0;
	}
}

@media only screen and (min-width: 768px) {
	.block-call-to-action:not(.is-style-product-card) {
		grid-template-areas: "stack";
		align-items: center;
	}
	.block-call-to-action:not(.is-style-product-card) > * {
		grid-area: stack;
	}
	.block-call-to-action:not(.is-style-product-card) > .block-call-to-action__image {
		margin-right: 32.5%;
	}
	.block-call-to-action__featured-image:not(.is-style-product-card) > .block-call-to-action__inner {
		margin-left: 43%;
	}
	.block-call-to-action:not(.is-style-product-card) .block-call-to-action__inner,
	.editor-styles-wrapper .block-call-to-action:not(.is-style-product-card) .block-call-to-action__inner {
		padding: 5.125rem 2.5rem;
	}
	.block-call-to-action__reverse > .block-call-to-action__image {
		order: 1;
	}

	.block-call-to-action__reverse.block-call-to-action__featured-image > .block-call-to-action__image {
		margin-right: 0;
		margin-left: 32.5%;
	}

	.block-call-to-action__reverse.block-call-to-action__featured-image > .block-call-to-action__inner {
		margin-right: 43%;
		margin-left: 0;
	}

	.block-area-sidebar .block-call-to-action > * {
		grid-area: unset;
	}

	.block-area-sidebar .block-call-to-action__reverse > .block-call-to-action__image {
		order: unset;
	}

	.block-area-sidebar .block-call-to-action .block-call-to-action__inner {
		padding: 1.875rem var(--wp--custom--layout--padding);
	}

	.block-area-sidebar .block-call-to-action .block-call-to-action__image {
		margin-right: 0;
		margin-left: 0;
		align-self: start;
	}

	.block-area-sidebar .block-call-to-action__image img {
		min-height: 15rem;
	}
	@supports( aspect-ratio: 1) {
		.block-area-sidebar .block-call-to-action__image img {
			aspect-ratio: auto;
		}
	}

	.block-area-sidebar .block-call-to-action__featured-image > .block-call-to-action__inner {
		align-self: end;
		margin: calc(-1 * 7.5rem) 1.875rem 0;
	}
}

/* Product card style (Call to Action > Styles > Product card)
   A shop card for a pair of products side by side in a Columns block - the two tools on the Soup
   Challenge thank-you page. Photo on the left filling the card's height, the words beside it on
   the card's fill, left-aligned: small caps brand, Fraunces name, a line, the button. No overlap
   and no title rule. Until the cards are wide enough to split (laptop up) the photo sits on top,
   cropped 4:3. Set Content Location to photo-left in the block's settings. */
.block-call-to-action.is-style-product-card {
	overflow: hidden;
	border-radius: var(--wp--custom--border-radius--small);
}
.block-call-to-action.is-style-product-card > .block-call-to-action__inner {
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: 1.75rem;
	font-size: 1rem;
	text-align: left;
}
.block-call-to-action.is-style-product-card .block-call-to-action__inner > * {
	margin-left: 0;
	margin-right: 0;
}
.block-call-to-action.is-style-product-card .block-call-to-action__image {
	position: relative; /* holds the shared brass hover frame (_blocks-core.scss) */
}
.block-call-to-action.is-style-product-card .block-call-to-action__image > a {
	display: block; /* the photo's link (render.php) fills the photo cell */
	height: 100%;
}
.block-call-to-action.is-style-product-card .block-call-to-action__image img {
	display: block;
	aspect-ratio: 4 / 3;
	border-radius: 0;
}
@media only screen and (min-width: 1024px) {
	.block-call-to-action.is-style-product-card {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	}
	.block-call-to-action.is-style-product-card .block-call-to-action__image img {
		height: 100%;
		min-height: 300px;
		aspect-ratio: auto;
	}
}