/* Book promo band ([cmath_book_promo]). */

.cmath-book-promo {
	padding: var(--space-250) var(--grid-margins);
}

/* Inside an Elementor container the page margins come from the container;
   the widget must span the container so the 1200px band centers like the
   other blocks (a centered flex container would otherwise shrink it). */
.elementor-widget:has(.cmath-book-promo) {
	width: 100%;
}

.elementor-widget-shortcode .cmath-book-promo {
	padding-inline: 0;
}

.cmath-book-promo__inner {
	position: relative;
	display: grid;
	/* Cover and the copy, with the button under the copy. The copy takes the
	   full width: the corner ellipses only show as a strip along the top. */
	grid-template-columns: 270px minmax(0, 1fr);
	align-items: center;
	gap: var(--space-250);
	max-width: var(--max-width-content);
	margin-inline: auto;
	padding: var(--space-75) 37px;
	overflow: hidden;
	background: var(--color-brand-teal-lighter);
}

.cmath-book-promo__deco {
	position: absolute;
	z-index: 0;
	pointer-events: none;
}

/* Only the bottom of the ellipses shows, about 196 × 46px, as in the layout. */
.cmath-book-promo__deco--ellipses {
	top: -331px;
	right: -280px;
	width: 496px;
}

.cmath-book-promo__deco--mandala {
	bottom: -184px;
	left: -157px;
	width: 386px;
}

.cmath-book-promo__cover,
.cmath-book-promo__body,
.cmath-book-promo__action {
	position: relative;
	z-index: 1;
}

.cmath-book-promo__cover img {
	width: 100%;
	height: auto;
}

/* With the band's own padding, keeps the copy 60px from the top and bottom
   when it is taller than the cover. */
.cmath-book-promo__body {
	padding-block: var(--space-300);
}

.cmath-book-promo__title {
	margin: 0 0 var(--space-100);
	font-family: var(--font-family-headers);
	font-weight: var(--font-h2-weight);
	font-size: var(--font-h2-size);
	line-height: 1.2;
	color: var(--color-text-default);
}

.cmath-book-promo__text {
	max-width: 90%;
	font-size: var(--font-body-size);
	color: var(--color-text-default);
}

.cmath-book-promo__text p {
	margin: 0;
}

.cmath-book-promo__text p + p {
	margin-top: var(--space-100);
}

.cmath-book-promo__action {
	margin-top: var(--space-200);
}

@media (max-width: 1024px) {
	.cmath-book-promo__inner {
		grid-template-columns: 200px minmax(0, 1fr);
	}
}

@media (max-width: 768px) {
	.cmath-book-promo__inner {
		grid-template-columns: 1fr;
		gap: var(--space-150);
		padding: var(--space-200) var(--space-125);
	}

	/* Stacked under the cover: the band's padding is enough. */
	.cmath-book-promo__body {
		padding-block: 0;
	}

	.cmath-book-promo__deco--ellipses {
		top: -140px;
		right: -170px;
		width: 340px;
	}

	.cmath-book-promo__deco--mandala {
		bottom: -240px;
		left: -143px;
		width: 320px;
	}
}