/* ==================================================================
 *  Zuub Callout Blocks — front-end + editor styles
 *  Palette pulled from zuub.com (navy / mint / cyan / light-blue).
 * ================================================================== */

/* --- Callout boxes (unscoped so they also render inside the editor) --- */
.zuub-callout {
	margin: 1.75rem 0;
	padding: 1.5rem 1.75rem;
	border-radius: 20px;
	background: #fff;
	border: 1px solid rgba(0, 196, 232, 0.5);
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);
}
.zuub-callout > :first-child { margin-top: 0; }
.zuub-callout > :last-child { margin-bottom: 0; }
.zuub-callout ul { margin-bottom: 0; }

.zuub-callout__label {
	margin: 0 0 0.6rem;
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: #1870c9;
}

/* Key Definition — soft mint-tinted card */
.zuub-callout--definition {
	background: #f2fbfb;
	border-color: rgba(108, 220, 216, 0.75);
}

/* Pull-quote / emphasis — light-blue panel, bold navy */
.zuub-callout--quote {
	background: #e9f1fb;
	border-color: rgba(5, 55, 94, 0.12);
	box-shadow: none;
	font-size: 1.12rem;
	font-weight: 600;
	color: #05375e;
}

/* What to Evaluate / Questions / Takeaways — white feature-card look */
.zuub-callout--muted {
	background: #fff;
	border-color: rgba(0, 196, 232, 0.6);
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.02);
}

/* Checklist (☐ items) */
.zuub-checklist {
	list-style: none;
	padding-left: 0;
}
.zuub-checklist li {
	position: relative;
	padding-left: 1.8rem;
	margin-bottom: 0.5rem;
}
.zuub-checklist li::before {
	content: "\2610";
	position: absolute;
	left: 0;
	color: #00c4e8;
	font-weight: 700;
}

/* --- Front-end brand accents for the post body only --- */
.entry-content h2 { color: #05375e; }
.entry-content h3 { color: #05375e; }
.single .entry-content h2 { font-size: 32px; }
.single .entry-content h3 { font-size: 28px; }

/* Tables styled like the site's compare table */
.entry-content .table-responsive .table {
	table-layout: fixed;
	width: 100%;
	border-collapse: separate;
	border-spacing: 0;
}
.entry-content .table-responsive .table th {
	background: transparent;
	color: #6b7682;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	font-size: 0.8rem;
	font-weight: 700;
	padding: 14px 18px;
	border: none;
	text-align: left;
}
.entry-content .table-responsive .table td {
	background: #e9f1fb;
	color: #0c2f4d;
	padding: 16px 18px;
	border: none;
	white-space: normal;
	overflow-wrap: anywhere;
	word-break: break-word;
	vertical-align: top;
}
.entry-content .table-responsive .table tbody tr:not(:last-child) td { border-bottom: 2px solid #fff; }
.entry-content .table-responsive .table tbody tr:first-child td:first-child { border-top-left-radius: 12px; }
.entry-content .table-responsive .table tbody tr:first-child td:last-child { border-top-right-radius: 12px; }
.entry-content .table-responsive .table tbody tr:last-child td:first-child { border-bottom-left-radius: 12px; }
.entry-content .table-responsive .table tbody tr:last-child td:last-child { border-bottom-right-radius: 12px; }