.cmath-blog-listing__inner {
	width: min(var(--max-width-content), calc(100% - 2 * var(--grid-margins)));
	margin-inline: auto;
	padding-block: var(--block-padding-m);
}

.cmath-blog-listing__head {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--space-75);
	margin-bottom: var(--space-300);
	text-align: center;
}

.cmath-blog-listing__title {
	margin: 0;
	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-alt);
}

.cmath-blog-listing__subtitle {
	margin: 0;
	max-width: 700px;
	font-family: var(--font-family-paragraph);
	font-size: var(--font-body-size);
	line-height: 1.3;
	color: var(--color-text-default);
}

.cmath-single__article {
	width: min(var(--max-width-text), calc(100% - 2 * var(--grid-margins)));
	margin-inline: auto;
	padding-block: var(--block-padding-m);
	display: flex;
	flex-direction: column;
	gap: var(--space-162);
}

.cmath-single__header {
	display: flex;
	flex-direction: column;
	gap: var(--space-100);
}

.cmath-single__media {
	width: 100%;
	aspect-ratio: 16 / 9;
	overflow: hidden;
}

.cmath-single__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.cmath-single__meta {
	display: flex;
	flex-direction: column;
	gap: var(--space-100);
}

.cmath-single__date {
	margin: 0;
	font-family: var(--font-family-paragraph);
	font-size: var(--font-body-size);
	line-height: 1.3;
	color: var(--color-text-accent);
}

.cmath-single__category {
	color: inherit;
	text-decoration: none;
}

.cmath-single__category:hover,
.cmath-single__category:focus-visible {
	color: inherit;
	text-decoration: underline;
	text-underline-offset: 0.15em;
}

.cmath-single__title {
	margin: 0;
	font-family: var(--font-family-headers);
	font-weight: var(--font-h4-weight);
	font-size: var(--font-h4-size);
	line-height: 1.2;
	color: var(--color-text-default);
}

.cmath-single__lead {
	margin: 0;
	font-family: var(--font-family-paragraph);
	font-weight: 500;
	font-size: var(--space-113);
	line-height: 1.4;
	color: var(--color-text-default);
}

.cmath-single__content {
	font-family: var(--font-family-paragraph);
	font-size: var(--font-body-size);
	line-height: 1.3;
	color: var(--color-text-default);
}

.cmath-single__content > * + * {
	margin-top: var(--space-100);
}

.cmath-related {
	background: var(--color-brand-light-blue);
	padding-block: var(--block-padding-m);
}

.cmath-related__inner {
	width: min(var(--max-width-content), calc(100% - 2 * var(--grid-margins)));
	margin-inline: auto;
}

.cmath-related__title {
	margin: 0 0 var(--space-300);
	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-alt);
	text-align: center;
}

.cmath-related__more {
	display: flex;
	justify-content: center;
	margin-top: var(--space-300);
}

.cmath-blog-grid {
	display: grid;
	grid-template-columns: repeat(var(--cmath-cols, 3), minmax(0, 1fr));
	grid-auto-rows: 1fr;
	gap: var(--space-200);
	width: 100%;
}

@media (max-width: 1024px) {
	.cmath-blog-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 680px) {
	.cmath-blog-grid { grid-template-columns: 1fr; }
}

.cmath-blog-card {
	display: flex;
	flex-direction: column;
	gap: var(--space-150);
	padding: var(--space-125);
	background-image: url("../img/blog-card.svg?v=4");
	background-size: 100% 100%;
	background-repeat: no-repeat;
	background-position: center;
}

.cmath-blog-card--service {
	background-image: url("../img/service-card.svg?v=1");
}

.cmath-blog-card__media { display: block; }

.cmath-blog-card__media img {
	width: 100%;
	aspect-ratio: 352 / 222;
	object-fit: cover;
	display: block;
}

.cmath-blog-card__body {
	display: flex;
	flex-direction: column;
	gap: var(--space-100);
	flex: 1 0 auto;
}

.cmath-blog-card__title {
	margin: 0;
	font-family: var(--font-family-headers);
	font-weight: 700;
	font-size: var(--font-h5-size);
	line-height: 1.2;
	color: var(--color-text-default);
}

.cmath-blog-card__title a { color: inherit; text-decoration: none; }
.cmath-blog-card__title a:hover { color: var(--color-text-accent); }

.cmath-blog-card__excerpt {
	font-family: var(--font-family-paragraph);
	font-weight: 400;
	font-size: var(--font-body-size);
	line-height: 1.3;
	color: var(--color-text-default);
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 6;
	line-clamp: 6;
	overflow: hidden;
}

.cmath-blog-card__excerpt p { margin: 0; }

.cmath-blog-card__actions {
	margin-top: auto;
	display: flex;
	justify-content: flex-end;
}

.cmath-blog-card__more {
	display: inline-block;
	width: 100%;
	text-align: center;
	font-family: var(--font-family-paragraph);
	font-size: var(--font-body-size);
	line-height: 1.3;
	color: var(--color-text-default);
	text-decoration: none;
	padding: var(--space-50) var(--space-100);
	border: var(--border-width-default) solid var(--color-border-accent);
	border-radius: var(--radius-full);
	background: transparent;
	transition: background-color 0.2s ease, color 0.2s ease;
}

.cmath-blog-card__more:hover,
.cmath-blog-card__more:focus {
	background: var(--color-brand-blue);
	color: var(--color-text-dark);
	border: var(--border-width-default) solid var(--color-brand-blue);
}

/* Testimonials */
.cmath-testimonials { width: 100%; }

.cmath-testimonials__title {
	text-align: center;
	margin: 0 0 var(--space-300);
	font-family: var(--font-family-headers);
	font-weight: 700;
	font-size: var(--font-h3-size);
	color: var(--color-text-default);
}

.cmath-testimonials__viewport {
	overflow-x: auto;
	scroll-behavior: smooth;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none;
	padding-bottom: var(--space-50);
	/* First card aligned to the content grid; the row bleeds to the right. */
	padding-inline-start: max(var(--grid-margins), calc((100% - var(--max-width-content)) / 2));
}
.cmath-testimonials__viewport::-webkit-scrollbar { display: none; }
.cmath-testimonials__viewport.is-draggable { cursor: grab; }
.cmath-testimonials__viewport.is-dragging {
	cursor: grabbing;
	scroll-snap-type: none;
	scroll-behavior: auto;
	user-select: none;
}

.cmath-testimonials__track {
	display: flex;
	gap: var(--space-200);
	align-items: stretch;
}

/* Scrolled to the end, the last card keeps the same gutter as the first one
   (testimonials.js sets --cmath-testimonials-gutter; scroll containers ignore
   padding at the end). */
.cmath-testimonials__track::after {
	content: "";
	flex: 0 0 var(--cmath-testimonials-gutter, 0px);
	margin-inline-start: calc(-1 * var(--space-200));
}

.cmath-testimonial {
	flex: 0 0 clamp(260px, 30%, 380px);
	scroll-snap-align: start;
	display: flex;
	flex-direction: column;
	gap: var(--space-100);
	padding: var(--space-150);
	background-image: url("../img/testimonial-card.svg?v=1");
	background-size: 100% 100%;
	background-repeat: no-repeat;
}

.cmath-testimonial__quote { width: 64px; height: auto; display: block; }

.cmath-testimonial__text {
	margin: 0;
	font-family: var(--font-family-paragraph);
	font-size: var(--font-h6-size);
	line-height: 1.4;
	color: var(--color-text-default);
	flex: 1 0 auto;
}
.cmath-testimonial__text p { margin: 0 0 0.5em; }

.cmath-testimonial__author {
	display: flex;
	align-items: center;
	gap: var(--space-100);
	margin-top: auto;
}
.cmath-testimonial__avatar {
	flex: 0 0 auto;
	width: 56px; height: 56px;
	border-radius: var(--radius-full);
	overflow: hidden;
	background: #fff;
	display: grid; place-items: center;
}
.cmath-testimonial__avatar img { width: 100%; height: 100%; object-fit: cover; border-radius: var(--radius-full); }
.cmath-testimonial__meta { display: flex; flex-direction: column; }
.cmath-testimonial__role {
	font-family: var(--font-family-headers);
	font-weight: 700;
	font-size: var(--font-h6-size);
	color: var(--color-text-default);
}
.cmath-testimonial__org {
	font-family: var(--font-family-paragraph);
	font-size: var(--font-body-size);
	color: var(--color-text-default);
}

/* Dots */
.cmath-testimonials__dots {
	display: flex; justify-content: center; align-items: center;
	gap: var(--space-75);
	margin-top: var(--space-200);
}
.cmath-testimonials__dot {
	width: 16px; height: 16px; padding: 0; border: 0; cursor: pointer;
	background: transparent center / contain no-repeat url("../img/dot-inactive.svg");
}
.cmath-testimonials__dot.is-active {
	width: 18px; height: 19px;
	background-image: url("../img/dot-active.svg");
}

/* See more */
.cmath-testimonials__more-wrap { display: flex; justify-content: center; margin-top: var(--space-200); }
.cmath-testimonials__more {
	display: inline-block;
	font-family: var(--font-family-paragraph);
	font-size: var(--font-body-size);
	color: var(--color-text-default);
	text-decoration: none;
	padding: var(--space-50) var(--space-100);
	border-radius: var(--radius-full);
	background: var(--color-brand-blue);
	transition: background-color 0.2s ease, color 0.2s ease;
}
.cmath-testimonials__more:hover,
.cmath-testimonials__more:focus-visible { background: var(--color-brand-light-blue); color: var(--color-text-default); }

/* Testimonials band */
.cmath-testimonials-band {
	background: var(--color-brand-teal-original);
	padding: var(--block-padding-m) 0;
}

.cmath-testimonials__title,
.cmath-testimonials__dots,
.cmath-testimonials__more-wrap {
	padding-inline: var(--grid-margins);
}

.cmath-testimonials-band .cmath-testimonials__title {
	color: var(--color-text-inverse);
}

.cmath-testimonials-band .cmath-testimonials__viewport {
	scroll-snap-type: none;
}

.cmath-testimonials-band--cream {
	background: var(--color-brand-samon);
}

.cmath-testimonials-band--cream .cmath-testimonials__title {
	color: var(--color-text-default);
}

@media (max-width: 768px) {
	.cmath-testimonial {
		flex: 0 0 86%;
	}

	.cmath-blog-grid {
		display: flex;
		flex-wrap: nowrap;
		grid-template-columns: none;
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
		/* Full-bleed: carousel extends to viewport edge; cards are clipped by
		   the screen, not section margins. 20px = mobile padding used by
		   Elementor containers in these sections; padding restores first-card
		   alignment and scroll-padding aligns snap with the margin. */
		/* --cmath-bleed is measured by main.js (distance from the grid's
		   container to the viewport edge), so the bleed is exact whatever
		   padding the surrounding Elementor containers have. */
		width: calc(100% + 2 * var(--cmath-bleed, 20px));
		margin-inline: calc(-1 * var(--cmath-bleed, 20px));
		padding-inline: var(--cmath-bleed, 20px);
		scroll-padding-inline: var(--cmath-bleed, 20px);
	}

	.cmath-blog-grid::-webkit-scrollbar {
		display: none;
	}

	.cmath-blog-card {
		flex: 0 0 86%;
		scroll-snap-align: start;
	}

	.cmath-blog-listing .cmath-blog-grid {
		display: grid;
		grid-template-columns: 1fr;
		overflow: visible;
		width: auto;
		margin-inline: 0;
		padding-inline: 0;
	}
}
