/* ====================================================================
   Đầu bài viết, tóm tắt, mục lục, CTA, tác giả, bài liên quan
   (DESIGN.md B7 — "Đầu bài viết", "Tóm tắt nhanh", "Mục lục",
   "Hộp tác giả", "CTA giữa bài / cuối bài")
   ==================================================================== */

.c-post-breadcrumb {
	font-family: 'Inter', sans-serif;
	font-size: 13px;
	color: var(--nh-muted);
	margin-bottom: var(--nh-space-12);
}
.c-post-breadcrumb a { color: var(--nh-muted); }
.c-post-breadcrumb .is-current { color: var(--nh-ink); }

.c-post-head__pills {
	display: flex;
	gap: var(--nh-space-8);
	margin-bottom: var(--nh-space-12);
	flex-wrap: wrap;
}

.c-post-meta {
	display: flex;
	align-items: center;
	gap: var(--nh-space-8);
	font-family: 'Inter', sans-serif;
	font-size: 14px;
	color: var(--nh-muted);
	margin: var(--nh-space-16) 0;
	flex-wrap: wrap;
}
.c-post-meta__avatar {
	width: 28px;
	height: 28px;
	border-radius: 50%;
	object-fit: cover;
}
.c-post-meta__author { color: var(--nh-ink); font-weight: 500; }
.c-post-meta__sep { opacity: .6; }

.c-post-featured-image {
	max-width: 960px;
	margin: var(--nh-space-16) 0;
}
.c-post-featured-image img {
	width: 100%;
	aspect-ratio: 16/9;
	object-fit: cover;
	border-radius: var(--nh-radius-image);
}

/* --- Tóm tắt nhanh -------------------------------------------------- */

.c-summary-box {
	background-color: var(--nh-card);
	border-left: 3px solid var(--nh-accent);
	border-radius: 0 var(--nh-radius-card) var(--nh-radius-card) 0;
	padding: var(--nh-space-20);
	margin: var(--nh-space-24) 0;
}
.c-summary-box ul {
	margin: var(--nh-space-8) 0 0;
	padding-left: 1.2em;
}
.c-summary-box li { margin-bottom: 4px; }

/* --- Mục lục ---------------------------------------------------------- */

.c-toc--inline {
	background-color: var(--nh-card);
	border: 1px solid var(--nh-line);
	border-radius: var(--nh-radius-card);
	padding: var(--nh-space-16);
	margin: var(--nh-space-24) 0;
}
.c-toc--inline summary {
	font-family: 'Inter', sans-serif;
	font-weight: 600;
	cursor: pointer;
}
.c-toc--inline ul,
.c-toc--sidebar ul {
	list-style: none;
	margin: var(--nh-space-12) 0 0;
	padding: 0;
}
.c-toc-item { margin-bottom: 6px; }
.c-toc-item--h3 { padding-left: var(--nh-space-16); }
.c-toc-item a {
	font-size: 14px;
	color: var(--nh-body);
	text-decoration: none;
}
.c-toc--sidebar {
	background-color: var(--nh-card);
	border: 1px solid var(--nh-line);
	border-radius: var(--nh-radius-card);
	padding: var(--nh-space-16);
}
.c-toc-item a.is-active {
	color: var(--nh-accent);
	font-weight: 600;
	text-decoration: underline;
	text-underline-offset: 3px;
}

@media (max-width: 781px) {
	.c-toc--sidebar { display: none; }
}
@media (min-width: 782px) {
	.c-toc--inline { display: none; }
}

/* --- Video facade --------------------------------------------------- */

.c-video-facade {
	position: relative;
	cursor: pointer;
	border-radius: var(--nh-radius-image);
	overflow: hidden;
	margin: var(--nh-space-24) 0;
}
.c-video-facade img { width: 100%; display: block; }
.c-video-facade__play {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 64px;
	height: 64px;
	border-radius: 50%;
	background-color: rgba(21, 24, 29, 0.75);
	color: #fff;
	border: none;
	font-size: 22px;
	cursor: pointer;
}

/* --- Hộp tác giả ------------------------------------------------------ */

.c-author-box {
	display: flex;
	gap: var(--nh-space-16);
	margin: var(--nh-space-32) 0;
	align-items: flex-start;
}
.c-author-box__avatar { border-radius: 50%; flex-shrink: 0; }
.c-author-box__name { font-family: 'Inter', sans-serif; font-weight: 600; margin: 0 0 4px; }
.c-author-box__bio { color: var(--nh-muted); font-size: 14px; margin: 0 0 8px; }

/* --- CTA giữa bài / cuối bài ------------------------------------------ */

.c-cta-box--audit,
.c-cta-box--newsletter {
	margin: var(--nh-space-32) 0;
	text-align: left;
}
.c-cta-box--newsletter form { margin-top: var(--nh-space-12); }

/* --- Bài liên quan ------------------------------------------------------ */

.c-related-posts { margin: var(--nh-space-32) 0; }
.c-related-posts__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--nh-space-16);
	margin-top: var(--nh-space-12);
}
@media (max-width: 781px) {
	.c-related-posts__grid { grid-template-columns: 1fr; }
}
.c-related-posts__card { text-decoration: none; overflow: hidden; }
.c-related-posts__img img { width: 100%; aspect-ratio: 16/9; object-fit: cover; }
.c-related-posts__body { padding: var(--nh-space-16); }
.c-related-posts__title {
	font-family: 'Inter', sans-serif;
	font-weight: 600;
	color: var(--nh-ink);
	margin: var(--nh-space-8) 0 4px;
}

/* --- Sidebar single post (thẻ mini audit) ------------------------------- */

.c-audit-mini-card { margin-top: var(--nh-space-16); padding: var(--nh-space-16); }
.c-audit-mini-card .c-heading-sm { margin: 0 0 4px; }
.c-audit-mini-card .c-small { color: var(--nh-muted); margin: 0 0 var(--nh-space-12); }
.c-toc-widget { margin-bottom: 0; }
