/**
 * TAXSCO Blog Single — 前端样式  (CSS v1.0.0)
 *
 * 设计令牌与 taxesco-ceilings / txc-frontend.css 完全一致：
 *   #142B3D 藏青  #D12920 品牌红  #777777 正文灰  #F4F5F6 浅灰  #E8E9EA 边框
 *   字体：标题 Manrope 800 / 正文 Inter
 *
 * 选择器统一带 body.txb-single-post 前缀，用于压过 Minimog 主题的
 * 全局 h1-h6 / p / a / figure 等基础样式（主题加载在前，本表在后）。
 */

/* ============================================================
   1. 令牌与基础
   ============================================================ */
body.txb-single-post .txb-page {
	--txb-navy: #142B3D;
	--txb-red: #D12920;
	--txb-red-dark: #b82218;
	--txb-charcoal: #20252A;
	--txb-gray: #777777;
	--txb-body: #555555;
	--txb-light: #F4F5F6;
	--txb-offwhite: #FAFAF8;
	--txb-border: #E8E9EA;
	--txb-muted: #8fa5b5;
	/* 次要文字：与站点 #777777 视觉等效，但 4.54:1 达 WCAG AA（#777 为 4.48，#aaa 仅 2.32） */
	--txb-quiet: #767676;

	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
	font-size: 16px;
	line-height: 1.6;
	color: var(--txb-body);
	background: #fff;
	-webkit-font-smoothing: antialiased;
}

/* 容器：站点统一 boxed 1280px（内容 1232px） */
body.txb-single-post .txb-wrap,
body.txb-single-post .txb-wrap-read,
body.txb-single-post .txb-wrap-wide {
	width: 100%;
	max-width: 1280px;
	margin-left: auto;
	margin-right: auto;
	padding-left: 24px;
	padding-right: 24px;
	box-sizing: border-box;
}
body.txb-single-post .txb-wrap-read { max-width: 836px; }  /* 正文 788px */
body.txb-single-post .txb-wrap-wide { max-width: 1112px; } /* 特色图 1064px */

body.txb-single-post .txb-page *,
body.txb-single-post .txb-page *::before,
body.txb-single-post .txb-page *::after { box-sizing: border-box; }

/* ============================================================
   1.5 清掉主题在 </header> 之后留下的空壳元素
   Minimog 的 header.php 会在 </header> 之后输出一个空的
   #page-title-bar（minimal-01 变体带 margin-bottom: 60px）。
   本模板自带 Hero，不需要它 —— 不隐藏的话，导航栏与 Hero 之间
   会多出约 78px 的纯白空白（60px margin + 空壳自身高度）。
   ============================================================ */
body.txb-single-post #page-title-bar,
body.txb-single-post .page-title-bar {
	display: none !important;
	margin: 0 !important;
	padding: 0 !important;
}

/* ============================================================
   2. Hero（深藏青）
   ============================================================ */
body.txb-single-post .txb-hero {
	background: var(--txb-navy);
	padding-top: 72px;
	padding-bottom: 64px;
}
/* Hero 分类 pill（DESIGN INSPIRATION）已于 2026-10-09 移除。
   原 pill 占位 = padding 4px*2 + 行盒 17px = 25px，+ margin-bottom 20px ≈ 45px；
   标题若成了 hero 内首个子元素，补回 45px 顶部间距，避免标题贴到 hero 上沿。 */
body.txb-single-post .txb-hero .txb-wrap > .txb-hero-title:first-child {
	margin-top: 45px;
}
/* 备用：若日后恢复分类 pill，取消下面整段注释即可（与上方规则二选一，同时存在会多 45px 间距）
body.txb-single-post .txb-hero-cat {
	display: inline-block;
	padding: 4px 12px;
	background: var(--txb-light);
	color: var(--txb-red);
	font-family: 'Inter', sans-serif;
	font-size: 10px;
	font-weight: 700;
	line-height: 1.7;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	text-decoration: none;
	border-radius: 0;
	margin-bottom: 20px;
	transition: background-color .2s ease, color .2s ease;
}
body.txb-single-post .txb-hero-cat:hover,
body.txb-single-post .txb-hero-cat:focus,
body.txb-single-post .txb-hero-cat:active {
	background: #fff;
	color: var(--txb-red);
	text-decoration: none;
	box-shadow: none;
}
*/

body.txb-single-post .txb-hero-title {
	font-family: 'Manrope', 'Inter', sans-serif;
	font-size: 2.75rem;
	font-weight: 800;
	line-height: 1.16;
	letter-spacing: -0.01em;
	color: #fff;
	margin: 0 0 24px;
	max-width: 980px;
	text-wrap: balance;
}

body.txb-single-post .txb-hero-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	font-family: 'Inter', sans-serif;
	font-size: 13px;
	font-weight: 500;
	letter-spacing: 0.02em;
	color: var(--txb-muted);
}
body.txb-single-post .txb-hero-meta .txb-dot { color: rgba(255, 255, 255, 0.28); }

/* ============================================================
   3. 特色大图
   ============================================================ */
body.txb-single-post .txb-feature {
	margin: 0;
	padding: 56px 0 0;
	background: #fff;
}
body.txb-single-post .txb-feature-frame {
	aspect-ratio: 16 / 9;
	overflow: hidden;
	background: var(--txb-light);
	line-height: 0;
}
body.txb-single-post .txb-feature-frame img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	border-radius: 0;
}

/* ============================================================
   4. 正文（单栏居中，788px）
   ============================================================ */
body.txb-single-post .txb-article {
	background: #fff;
	padding: 64px 0 0;
}
body.txb-single-post .txb-content {
	font-family: 'Inter', sans-serif;
	font-size: 16px;
	line-height: 1.85;
	color: var(--txb-body);
}
body.txb-single-post .txb-content > *:first-child { margin-top: 0 !important; }
body.txb-single-post .txb-content > *:last-child { margin-bottom: 0 !important; }

/* --- 段落 --- */
body.txb-single-post .txb-content p,
body.txb-single-post .txb-content .wp-block-paragraph {
	font-family: 'Inter', sans-serif;
	font-size: 16px;
	line-height: 1.85;
	color: var(--txb-body);
	margin: 0 0 24px;
	padding: 0;
}

/* --- 标题 --- */
body.txb-single-post .txb-content h1,
body.txb-single-post .txb-content h2,
body.txb-single-post .txb-content h3,
body.txb-single-post .txb-content h4,
body.txb-single-post .txb-content h5,
body.txb-single-post .txb-content h6 {
	font-family: 'Manrope', 'Inter', sans-serif;
	font-weight: 800;
	letter-spacing: -0.01em;
	line-height: 1.3;
	color: var(--txb-navy);
	padding: 0;
}
body.txb-single-post .txb-content h2 { font-size: 1.75rem; margin: 56px 0 20px; }
body.txb-single-post .txb-content h3 { font-size: 1.3125rem; margin: 40px 0 16px; }
body.txb-single-post .txb-content h4 { font-size: 1.0625rem; margin: 32px 0 12px; }
body.txb-single-post .txb-content h5,
body.txb-single-post .txb-content h6 { font-size: 0.9375rem; margin: 24px 0 10px; letter-spacing: 0.06em; text-transform: uppercase; }

/* --- 链接 --- */
body.txb-single-post .txb-content a {
	color: var(--txb-red);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
	transition: color .2s ease;
}
body.txb-single-post .txb-content a:hover,
body.txb-single-post .txb-content a:focus { color: var(--txb-navy); }

/* --- 图片 / 图注 --- */
body.txb-single-post .txb-content img {
	max-width: 100%;
	height: auto;
	display: block;
	border-radius: 0;
	box-shadow: none;
}
body.txb-single-post .txb-content figure,
body.txb-single-post .txb-content .wp-block-image {
	margin: 40px 0;
	max-width: 100%;
}
body.txb-single-post .txb-content figure img { width: 100%; }
body.txb-single-post .txb-content figcaption {
	font-family: 'Inter', sans-serif;
	font-size: 12px;
	line-height: 1.6;
	color: var(--txb-quiet);
	text-align: center;
	margin-top: 12px;
}

/* --- 列表（红色短横 / 红色序号，对齐站点 dash 风格） --- */
body.txb-single-post .txb-content ul,
body.txb-single-post .txb-content ol {
	margin: 0 0 24px;
	padding: 0;
	list-style: none;
}
body.txb-single-post .txb-content li {
	position: relative;
	font-family: 'Inter', sans-serif;
	font-size: 16px;
	line-height: 1.8;
	color: var(--txb-body);
	margin-bottom: 12px;
	padding-left: 26px;
}
body.txb-single-post .txb-content li:last-child { margin-bottom: 0; }
body.txb-single-post .txb-content ul > li::before {
	content: '';
	position: absolute;
	left: 0;
	top: 0.78em;
	width: 10px;
	height: 2px;
	background: var(--txb-red);
}
body.txb-single-post .txb-content ol { counter-reset: txb-ol; }
body.txb-single-post .txb-content ol > li { counter-increment: txb-ol; padding-left: 32px; }
body.txb-single-post .txb-content ol > li::before {
	content: counter(txb-ol) '.';
	position: absolute;
	left: 0;
	top: 0;
	font-family: 'Manrope', sans-serif;
	font-size: 15px;
	font-weight: 800;
	line-height: 1.95;
	color: var(--txb-red);
}
body.txb-single-post .txb-content li > ul,
body.txb-single-post .txb-content li > ol { margin: 12px 0 0; }

/* --- 引用 --- */
body.txb-single-post .txb-content blockquote {
	margin: 40px 0;
	padding: 6px 0 6px 28px;
	border-left: 3px solid var(--txb-red);
	background: none;
	font-family: 'Manrope', 'Inter', sans-serif;
	font-size: 1.125rem;
	font-weight: 600;
	line-height: 1.6;
	color: var(--txb-navy);
}
body.txb-single-post .txb-content blockquote p {
	font-family: inherit;
	font-size: inherit;
	font-weight: inherit;
	line-height: inherit;
	color: inherit;
	margin: 0 0 12px;
}
body.txb-single-post .txb-content blockquote p:last-child { margin-bottom: 0; }
body.txb-single-post .txb-content blockquote cite {
	display: block;
	margin-top: 12px;
	font-family: 'Inter', sans-serif;
	font-size: 12px;
	font-weight: 500;
	font-style: normal;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--txb-quiet);
}

/* --- 表格（站点规格表风格） --- */
body.txb-single-post .txb-content .wp-block-table { overflow-x: auto; }
body.txb-single-post .txb-content table {
	width: 100%;
	border-collapse: collapse;
	border: 0;
	margin: 32px 0;
	font-size: 14px;
}
body.txb-single-post .txb-content th {
	background: var(--txb-navy);
	color: #fff;
	font-family: 'Manrope', sans-serif;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.15em;
	text-transform: uppercase;
	text-align: left;
	padding: 14px 20px;
	border: 0;
}
body.txb-single-post .txb-content td {
	padding: 14px 20px;
	font-size: 14px;
	color: var(--txb-body);
	border: 0;
	border-bottom: 1px solid var(--txb-border);
}
body.txb-single-post .txb-content tbody tr:nth-child(even) td { background: var(--txb-offwhite); }

/* --- 代码 --- */
body.txb-single-post .txb-content code {
	background: var(--txb-light);
	color: var(--txb-navy);
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	font-size: 0.875em;
	padding: 2px 6px;
	border-radius: 0;
}
body.txb-single-post .txb-content pre {
	background: var(--txb-navy);
	color: #dbe6ee;
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	font-size: 13px;
	line-height: 1.7;
	padding: 24px;
	margin: 32px 0;
	overflow-x: auto;
	border-radius: 0;
}
body.txb-single-post .txb-content pre code {
	background: none;
	color: inherit;
	padding: 0;
	font-size: inherit;
}

/* --- 分隔线 --- */
body.txb-single-post .txb-content hr {
	height: 0;
	border: 0;
	border-top: 1px solid var(--txb-border);
	background: none;
	margin: 48px 0;
}

/* --- 宽对齐：正文 788px 外扩到 1064px --- */
@media (min-width: 1100px) {
	body.txb-single-post .txb-content .alignwide,
	body.txb-single-post .txb-content .alignfull {
		width: auto;
		max-width: none;
		margin-left: -126px;
		margin-right: -126px;
	}
}

/* ============================================================
   5. 上 / 下篇导航
   ============================================================ */
body.txb-single-post .txb-pager {
	background: #fff;
	padding-top: 64px;
}
body.txb-single-post .txb-pager-grid {
	display: flex;
	gap: 20px;
	border-top: 1px solid var(--txb-border);
	padding-top: 40px;
}
body.txb-single-post .txb-pager-item {
	flex: 1 1 0;
	min-width: 0;
	display: block;
	padding: 24px;
	background: var(--txb-offwhite);
	border: 1px solid var(--txb-border);
	border-radius: 0;
	text-decoration: none;
	transition: border-color .2s ease, background-color .2s ease, box-shadow .2s ease;
}
body.txb-single-post .txb-pager-item:hover,
body.txb-single-post .txb-pager-item:focus {
	background: #fff;
	border-color: var(--txb-red);
	box-shadow: 0 10px 24px rgba(20, 43, 61, 0.08);
	text-decoration: none;
}
body.txb-single-post .txb-pager-item.is-prev { text-align: left; }
body.txb-single-post .txb-pager-item.is-next { text-align: right; }
body.txb-single-post .txb-pager-grid.is-single .txb-pager-item { flex: 0 1 50%; }
body.txb-single-post .txb-pager-grid.is-single .txb-pager-item.is-next { margin-left: auto; }

body.txb-single-post .txb-pager-label {
	display: block;
	font-family: 'Inter', sans-serif;
	font-size: 10px;
	font-weight: 700;
	line-height: 1.6;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--txb-red);
	margin-bottom: 10px;
}
body.txb-single-post .txb-pager-title {
	display: block;
	font-family: 'Manrope', sans-serif;
	font-size: 15px;
	font-weight: 700;
	line-height: 1.45;
	color: var(--txb-navy);
	transition: color .2s ease;
}
body.txb-single-post .txb-pager-item:hover .txb-pager-title { color: var(--txb-red); }

/* ============================================================
   6. 相关文章
   ============================================================ */
body.txb-single-post .txb-related {
	background: var(--txb-light);
	padding: 80px 0 96px;
	margin-top: 80px;
}
/* 无相关文章时的收尾留白（v1.0.3）。
   没有 .txb-related 时上/下篇导航会是 .txb-page 的最后一个元素，
   它自身无下内边距 → 卡片被页脚裁切。此处补回留白高度（80px 间距 + 96px 收尾）。
   注意：这里**只补白底留白、不加浅灰底** —— 浅灰底是 .txb-related 区块的背景色，
   没有相关文章时本就不该出现那一段灰色（用户反馈「多了灰色部分」即此）。
   所以 background 恒为纯白，与 .txb-page 白底无缝衔接。 */
body.txb-single-post .txb-pager + .txb-page-end-spacer {
	height: 176px; /* 80 + 96 */
	background: #fff;
}
body.txb-single-post .txb-related-head { margin-bottom: 40px; }
body.txb-single-post .txb-eyebrow {
	display: block;
	font-family: 'Inter', sans-serif;
	font-size: 11px;
	font-weight: 700;
	line-height: 1.6;
	letter-spacing: 0.35em;
	text-transform: uppercase;
	color: var(--txb-red);
	margin-bottom: 14px;
}
body.txb-single-post .txb-related-title {
	font-family: 'Manrope', sans-serif;
	font-size: 2rem;
	font-weight: 800;
	line-height: 1.2;
	letter-spacing: -0.01em;
	color: var(--txb-navy);
	margin: 0;
}
body.txb-single-post .txb-red-bar {
	display: block;
	width: 40px;
	height: 3px;
	background: var(--txb-red);
	margin-top: 20px;
}
body.txb-single-post .txb-related-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 24px;
}

body.txb-single-post .txb-card {
	background: #fff;
	border: 1px solid var(--txb-border);
	border-radius: 0;
	overflow: hidden;
	transition: box-shadow .25s ease, border-color .25s ease;
}
body.txb-single-post .txb-card:hover {
	box-shadow: 0 14px 30px rgba(20, 43, 61, 0.10);
}
body.txb-single-post .txb-card-link {
	display: block;
	text-decoration: none;
	color: inherit;
}
body.txb-single-post .txb-card-img {
	aspect-ratio: 16 / 9;
	overflow: hidden;
	background: var(--txb-light);
	line-height: 0;
}
body.txb-single-post .txb-card-img img,
body.txb-single-post .txb-card-img-ph {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform .5s ease;
}
body.txb-single-post .txb-card-img-ph { background: var(--txb-border); }
body.txb-single-post .txb-card:hover .txb-card-img img { transform: scale(1.05); }
body.txb-single-post .txb-card-body { padding: 20px; }
body.txb-single-post .txb-card-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin-bottom: 12px;
}
body.txb-single-post .txb-card-cat {
	padding: 2px 8px;
	background: var(--txb-light);
	color: var(--txb-red);
	font-family: 'Inter', sans-serif;
	font-size: 10px;
	font-weight: 700;
	line-height: 1.7;
	letter-spacing: 0.15em;
	text-transform: uppercase;
}
body.txb-single-post .txb-card-date {
	font-family: 'Inter', sans-serif;
	font-size: 11px;
	color: var(--txb-quiet);
}
body.txb-single-post .txb-card-title {
	font-family: 'Manrope', sans-serif;
	font-size: 14px;
	font-weight: 800;
	line-height: 1.45;
	color: var(--txb-navy);
	margin: 0;
	transition: color .2s ease;
}
body.txb-single-post .txb-card:hover .txb-card-title { color: var(--txb-red); }
body.txb-single-post .txb-card-more {
	display: inline-block;
	margin-top: 14px;
	font-family: 'Inter', sans-serif;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.15em;
	text-transform: uppercase;
	color: var(--txb-red);
}

/* ============================================================
   7. 响应式
   ============================================================ */
@media (max-width: 1024px) {
	body.txb-single-post .txb-hero { padding-top: 56px; padding-bottom: 48px; }
	body.txb-single-post .txb-hero-title { font-size: 2rem; }
	body.txb-single-post .txb-feature { padding-top: 40px; }
	body.txb-single-post .txb-article { padding-top: 48px; }
	body.txb-single-post .txb-related { padding: 64px 0 72px; margin-top: 64px; }
	body.txb-single-post .txb-related-title { font-size: 1.625rem; }
	body.txb-single-post .txb-related-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	body.txb-single-post .txb-content .alignwide,
	body.txb-single-post .txb-content .alignfull { margin-left: 0; margin-right: 0; }
}

@media (max-width: 640px) {
	body.txb-single-post .txb-wrap,
	body.txb-single-post .txb-wrap-read,
	body.txb-single-post .txb-wrap-wide { padding-left: 16px; padding-right: 16px; }

	body.txb-single-post .txb-hero { padding-top: 40px; padding-bottom: 36px; }
	body.txb-single-post .txb-hero-title { font-size: 1.625rem; line-height: 1.25; margin-bottom: 20px; }
	body.txb-single-post .txb-hero-meta { font-size: 12px; gap: 8px; }

	body.txb-single-post .txb-feature { padding-top: 32px; }
	body.txb-single-post .txb-feature-frame { aspect-ratio: 16 / 10; }

	body.txb-single-post .txb-article { padding-top: 40px; }
	body.txb-single-post .txb-content p,
	body.txb-single-post .txb-content .wp-block-paragraph,
	body.txb-single-post .txb-content li { font-size: 15px; }
	body.txb-single-post .txb-content h2 { font-size: 1.375rem; margin-top: 40px; margin-bottom: 16px; }
	body.txb-single-post .txb-content h3 { font-size: 1.125rem; margin-top: 32px; }
	body.txb-single-post .txb-content figure { margin: 32px 0; }
	body.txb-single-post .txb-content blockquote { font-size: 1rem; padding-left: 20px; }
	body.txb-single-post .txb-content .wp-block-table table { min-width: 480px; }
	body.txb-single-post .txb-content th { padding: 12px 14px; letter-spacing: 0.1em; }
	body.txb-single-post .txb-content td { padding: 12px 14px; }

	body.txb-single-post .txb-pager { padding-top: 48px; }
	body.txb-single-post .txb-pager-grid { flex-direction: column; padding-top: 32px; }
	body.txb-single-post .txb-pager-grid.is-single .txb-pager-item { flex: 1 1 auto; }
	body.txb-single-post .txb-pager-item.is-next { text-align: left; margin-left: 0; }

	body.txb-single-post .txb-related { padding: 48px 0 56px; margin-top: 56px; }
	body.txb-single-post .txb-related-grid { grid-template-columns: 1fr; }
}
