/* Blog post content styling. Loaded on single posts only by cc-blog-style.php. */
.single-post .crm_post_content {
	--cc-accent: #443696;
	--cc-accent-dark: #342980;
	--cc-tint: #f4f2fb;
	--cc-amber: #ffc46b;
	--cc-amber-tint: #fff7ea;
	--cc-line: #e4e2ee;
	--cc-ink: #17152b;
	line-height: 1.7;
}
.single-post .crm_post_content h2 { margin-top: 48px; margin-bottom: 16px; color: var(--cc-ink); }
.single-post .crm_post_content h3 { margin-top: 32px; margin-bottom: 10px; color: var(--cc-ink); }

/* Tables */
.single-post .crm_post_content .cc-table-wrap {
	margin: 28px 0;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	border: 1px solid var(--cc-line);
	border-radius: 12px;
}
.single-post .crm_post_content table { width: 100%; margin: 0; border-collapse: collapse; font-size: 15px; line-height: 1.5; }
.single-post .crm_post_content th {
	padding: 14px 18px;
	border: 0;
	background: var(--cc-accent);
	color: #fff;
	font-weight: 600;
	font-size: 15px;
	text-align: left;
	text-transform: none;
	white-space: nowrap;
}
.single-post .crm_post_content td {
	padding: 13px 18px;
	border: 0;
	border-top: 1px solid var(--cc-line);
	color: #000;
	vertical-align: top;
	text-align: left;
}
.single-post .crm_post_content tbody tr:nth-child(even) td { background: var(--cc-tint); }
.single-post .crm_post_content tbody tr:first-child td { border-top: 0; }

/* Quotes */
.single-post .crm_post_content blockquote {
	margin: 28px 0;
	padding: 20px 24px;
	border-left: 4px solid var(--cc-accent);
	border-radius: 0 12px 12px 0;
	background: var(--cc-tint);
	font-size: 16px;
	color: var(--cc-ink);
}
.single-post .crm_post_content blockquote p:last-child { margin-bottom: 0; }
.single-post .crm_post_content blockquote cite { color: var(--cc-accent); }

/* Callouts: <div class="cc-callout"> for notes, add cc-takeaway for the main point */
.single-post .crm_post_content .cc-callout {
	margin: 28px 0;
	padding: 20px 24px;
	border: 1px solid var(--cc-line);
	border-left: 4px solid var(--cc-accent);
	border-radius: 12px;
	background: var(--cc-tint);
}
.single-post .crm_post_content .cc-takeaway {
	border-color: #f5dcae;
	border-left-color: var(--cc-amber);
	background: var(--cc-amber-tint);
}
.single-post .crm_post_content .cc-callout-label {
	display: block;
	margin-bottom: 6px;
	color: var(--cc-accent);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: .06em;
	text-transform: uppercase;
}
.single-post .crm_post_content .cc-takeaway .cc-callout-label { color: #8a5a00; }
.single-post .crm_post_content .cc-callout p:last-child { margin-bottom: 0; }

/* CTA box and buttons */
.single-post .crm_post_content .cc-cta {
	margin: 40px 0;
	padding: 32px;
	border-radius: 16px;
	background: linear-gradient(100deg, #0d141d, var(--cc-accent));
	color: #fff;
}
.single-post .crm_post_content .cc-cta h2,
.single-post .crm_post_content .cc-cta h3 { margin-top: 0; color: #fff; }
.single-post .crm_post_content .cc-cta p { color: #fff; }
.single-post .crm_post_content .cc-cta .cc-btns { margin-bottom: 0; }
.single-post .crm_post_content .cc-btns { display: flex; flex-wrap: wrap; gap: 12px; margin: 20px 0 0; }
.single-post .crm_post_content a.cc-btn,
.single-post .crm_post_content a.cc-btn:hover {
	display: inline-block;
	padding: 12px 24px;
	border: 2px solid var(--cc-accent);
	border-radius: 8px;
	background: var(--cc-accent);
	color: #fff !important;
	font-weight: 600;
	font-size: 15px;
	line-height: 1.3;
	text-decoration: none;
}
.single-post .crm_post_content a.cc-btn:hover { border-color: var(--cc-accent-dark); background: var(--cc-accent-dark); }
.single-post .crm_post_content .cc-cta a.cc-btn { border-color: var(--cc-amber); background: var(--cc-amber); color: var(--cc-ink) !important; }
.single-post .crm_post_content .cc-cta a.cc-btn:hover { border-color: #ffd695; background: #ffd695; color: var(--cc-ink) !important; }
.single-post .crm_post_content .cc-cta a.cc-btn-ghost { background: transparent; border-color: #fff; color: #fff !important; }
.single-post .crm_post_content .cc-cta a.cc-btn-ghost:hover { background: #fff; border-color: #fff; color: var(--cc-ink) !important; }

/* Screenshots: <figure class="cc-shot"><img><figcaption> */
.single-post .crm_post_content .cc-shot { margin: 28px 0; }
.single-post .crm_post_content .cc-shot img {
	display: block;
	width: 100%;
	height: auto;
	border: 1px solid var(--cc-line);
	border-radius: 12px;
	box-shadow: 0 8px 24px rgba(23, 21, 43, .1);
}
.single-post .crm_post_content .cc-shot figcaption { margin-top: 10px; color: #555; font-size: 14px; text-align: center; }

@media (max-width: 767px) {
	.single-post .crm_post_content .cc-cta { padding: 24px 20px; }
	.single-post .crm_post_content .cc-btns a.cc-btn { width: 100%; text-align: center; }
	.single-post .crm_post_content th { white-space: normal; }
}
