/* TM Post Body - ảnh đại diện, nội dung, ghi chú biên tập, bài tiếp theo */
.tm-post-body__thumb {
	margin: 0;
	overflow: hidden;
	border-radius: var(--tm-radius);
	box-shadow: var(--tm-shadow);
}

.tm-post-body__thumb img {
	display: block;
	width: 100%;
	height: auto;
	max-height: 520px;
	object-fit: cover;
}

.tm-post-content {
	color: var(--tm-slate);
	font-family: var(--tm-font);
	font-size: 16px;
	line-height: 1.8;
}

.tm-post-content > :first-child {
	margin-top: 0;
}

.tm-post-content h2 {
	margin: 2.2em 0 .8em;
	padding-bottom: 12px;
	border-bottom: 1px solid var(--tm-line);
	color: var(--tm-carbon);
	font-family: var(--tm-font-serif);
	font-size: clamp(22px, 2.2vw, 28px);
	font-weight: 700;
	line-height: 1.3;
	scroll-margin-top: calc(var(--tm-header-h, 80px) + 24px);
}

.tm-post-content h3 {
	margin: 1.8em 0 .6em;
	color: var(--tm-carbon);
	font-family: var(--tm-font-cond);
	font-size: 19px;
	font-weight: 700;
	letter-spacing: .04em;
	text-transform: uppercase;
}

.tm-post-content p,
.tm-post-content ul,
.tm-post-content ol {
	margin: 0 0 1.2em;
}

.tm-post-content ul,
.tm-post-content ol {
	padding-left: 1.3em;
}

.tm-post-content li {
	margin-bottom: .4em;
}

.tm-post-content li::marker {
	color: var(--tm-red);
}

.tm-post-content strong {
	color: var(--tm-carbon);
}

.tm-post-content a {
	color: var(--tm-red);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.tm-post-content blockquote {
	margin: 1.6em 0;
	padding: 16px 22px;
	border-left: 3px solid var(--tm-red);
	background: var(--tm-mist);
	color: var(--tm-carbon);
	font-style: italic;
}

.tm-post-content table {
	width: 100%;
	margin: 1.6em 0;
	border-collapse: collapse;
	font-size: 14px;
}

.tm-post-content th,
.tm-post-content td {
	padding: 10px 12px;
	border: 1px solid var(--tm-line);
	text-align: left;
}

.tm-post-content th {
	background: var(--tm-carbon);
	color: var(--tm-white);
	font-family: var(--tm-font-cond);
	letter-spacing: .06em;
	text-transform: uppercase;
}

.tm-post-content img {
	max-width: 100%;
	height: auto;
	border-radius: var(--tm-radius-sm);
}

.tm-post-body__note {
	display: flex;
	gap: 16px;
	margin-top: 48px;
	padding: 20px 22px;
	border: 1px solid var(--tm-line);
	border-radius: var(--tm-radius);
	background: #F8FAFC;
}

.tm-post-body__note .tm-icon-box {
	width: 38px;
	height: 38px;
	border-radius: 50%;
}

.tm-post-body__note strong {
	display: block;
	color: var(--tm-carbon);
	font-family: var(--tm-font-cond);
	font-size: 13px;
	letter-spacing: .1em;
	text-transform: uppercase;
}

.tm-post-body__note p {
	margin: 4px 0 0;
	color: var(--tm-steel);
	font-size: 13.5px;
	line-height: 1.6;
}

.tm-post-body__next {
	display: flex;
	justify-content: flex-end;
	margin-top: 32px;
	padding-top: 28px;
	border-top: 1px solid var(--tm-line);
}

.tm-post-body__next a {
	display: inline-flex;
	align-items: center;
	gap: 18px;
	max-width: 100%;
	padding: 14px 18px;
	border: 1px solid var(--tm-line);
	border-radius: var(--tm-radius);
	background: var(--tm-white);
	color: var(--tm-carbon);
	text-align: right;
	text-decoration: none;
	transition: border-color .2s, box-shadow .2s;
}

.tm-post-body__next a:hover {
	border-color: var(--tm-red);
	box-shadow: var(--tm-shadow-sm);
}

.tm-post-body__next small {
	display: block;
	color: var(--tm-steel);
	font-family: var(--tm-font-cond);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
}

.tm-post-body__next span {
	font-family: var(--tm-font-cond);
	font-size: 15px;
	font-weight: 700;
}

.tm-post-body__next .tm-icon {
	width: 18px;
	height: 18px;
	flex: none;
	color: var(--tm-red);
}

.tm-post-body__pages {
	display: flex;
	gap: 8px;
	margin-top: 24px;
}
