/**
 * B2B Pro — 区块级共享样式
 *
 * 只放跨区块复用的东西（背景变体、进场动画、区块通用修饰）。
 * 单个区块的私有样式放在 blocks/<slug>/style.css，便于子主题精准覆盖。
 */

/* ==========================================================================
   区块背景变体
   ========================================================================== */

.b2b-section--bg-white { background: var(--wp--preset--color--white); }
.b2b-section--bg-light { background: var(--wp--preset--color--light); }
.b2b-section--bg-dark  { background: var(--wp--preset--color--dark); }
.b2b-section--bg-primary { background: var(--wp--preset--gradient--hero-primary); }
.b2b-section--bg-accent   { background: linear-gradient(120deg, #FF6A00 0%, #FF8A2B 100%); }

/*
 * 【1.3.6 修复】浅底/深底区块的「大一点的上下面距」此前只写在
 * blocks/features/style.css 里，而 features 区块的样式表只在页面真的用了
 * 「核心优势」区块时才会被 WP 按需加载（wp_enqueue_block_style）。
 * 后果：同一个 .b2b-section--bg-light / --bg-dark 区块，
 *   - 页面上有 features 区块时 → 拿到 spacing--60 的宽松内边距；
 *   - 页面上没有 features 区块时 → 只剩 main.css 里 .b2b-section 的
 *     spacing--50，内边距变小。
 * 也就是「同样写法，不同页面上下留白不一致」这类飘忽的 UI 问题。
 * 这是全站共享的区块修饰类，必须放在始终加载的 blocks.css 里。
 */
.b2b-section--bg-light,
.b2b-section--bg-dark {
	padding-block: var(--wp--preset--spacing--60);
}

/* 深色底上的通用文字修正 */
.b2b-section--bg-dark .b2b-section__title,
.b2b-section--bg-primary .b2b-section__title {
	color: #fff;
}

/* 橙底(accent)用深色字，白字对比不足(2.6:1) */
.b2b-section--bg-accent .b2b-section__title {
	color: #2A1600;
}

.b2b-section--bg-dark .b2b-section__desc,
.b2b-section--bg-primary .b2b-section__desc {
	color: rgba(255, 255, 255, 0.72);
}

.b2b-section--bg-accent .b2b-section__desc {
	color: rgba(42, 22, 0, 0.78);
}

.b2b-section--bg-dark .b2b-section__eyebrow,
.b2b-section--bg-primary .b2b-section__eyebrow {
	color: rgba(255, 255, 255, 0.88);
}

.b2b-section--bg-accent .b2b-section__eyebrow {
	color: rgba(42, 22, 0, 0.85);
}

/* 深色底上的幽灵按钮要变白 */
.b2b-section--bg-dark .b2b-btn--ghost,
.b2b-section--bg-primary .b2b-btn--ghost {
	color: #fff;
	border-color: rgba(255, 255, 255, 0.4);
}

/* 橙底上的幽灵按钮用深色描边/深字 */
.b2b-section--bg-accent .b2b-btn--ghost {
	color: #2A1600;
	border-color: rgba(42, 22, 0, 0.4);
}

.b2b-section--bg-dark .b2b-btn--ghost:hover,
.b2b-section--bg-primary .b2b-btn--ghost:hover {
	background: rgba(255, 255, 255, 0.12);
	border-color: #fff;
	color: #fff;
}

.b2b-section--bg-accent .b2b-btn--ghost:hover {
	background: rgba(42, 22, 0, 0.1);
	border-color: #2A1600;
	color: #2A1600;
}

/* 深色底上的主按钮改白，否则和深色底对比不足 */
.b2b-section--bg-dark .b2b-btn--primary,
.b2b-section--bg-primary .b2b-btn--primary {
	background: #fff;
	color: var(--wp--preset--color--primary-dark);
}

.b2b-section--bg-dark .b2b-btn--primary:hover,
.b2b-section--bg-primary .b2b-btn--primary:hover {
	background: rgba(255, 255, 255, 0.9);
	color: var(--wp--preset--color--primary-dark);
}

/* ==========================================================================
   进场动画
   ========================================================================== */

[data-b2b-reveal] {
	opacity: 0;
	transform: translateY(20px);
	transition: opacity 600ms cubic-bezier(0.16, 1, 0.3, 1),
				transform 600ms cubic-bezier(0.16, 1, 0.3, 1);
}

[data-b2b-reveal].is-revealed {
	opacity: 1;
	transform: none;
}

@media (prefers-reduced-motion: reduce) {
	[data-b2b-reveal] {
		opacity: 1;
		transform: none;
		transition: none;
	}
}

/* ==========================================================================
   编辑器提示
   ========================================================================== */

.b2b-cats__notice {
	margin: 0 0 1.5rem;
	padding: 0.875rem 1.125rem;
	border-radius: var(--wp--custom--radius--md, 12px);
	background: var(--wp--preset--color--primary-light);
	color: var(--wp--preset--color--primary-dark);
	font-size: var(--wp--preset--font-size--x-small);
	line-height: 1.6;
}

/* ==========================================================================
   归档页 / 博客卡片
   ========================================================================== */

.b2b-post-list {
	display: grid;
	gap: clamp(1.5rem, 1.2rem + 1.5vw, 2.25rem);
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr));
}

.b2b-post-card__meta {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	margin-bottom: 0.75rem;
	font-size: var(--wp--preset--font-size--x-small);
	color: var(--wp--preset--color--text-muted);
}

.b2b-post-card__excerpt {
	margin: 0.75rem 0 0;
	font-size: var(--wp--preset--font-size--small);
	line-height: 1.7;
	color: var(--wp--preset--color--text-muted);
}

/* 归档页标题 */
.b2b-archive-head {
	padding-block: var(--wp--preset--spacing--50) var(--wp--preset--spacing--40);
	background: var(--wp--preset--color--light);
	text-align: center;
}

.b2b-archive-head__title {
	margin: 0 0 0.75rem;
	font-size: var(--wp--preset--font-size--xx-large);
}

.b2b-archive-head__count {
	margin: 0;
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--text-muted);
}

/* 分页 */
.b2b-pagination {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin-top: clamp(2.5rem, 2rem + 2vw, 4rem);
}

.b2b-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 42px;
	height: 42px;
	padding-inline: 0.75rem;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--wp--custom--radius--sm, 8px);
	color: var(--wp--preset--color--text);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 500;
	text-decoration: none;
	transition: background-color var(--wp--custom--transition--fast),
				border-color var(--wp--custom--transition--fast),
				color var(--wp--custom--transition--fast);
}

.b2b-pagination .page-numbers:hover {
	border-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--primary);
}

.b2b-pagination .page-numbers.current {
	background: var(--wp--preset--color--primary);
	border-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--white);
}

/* ==========================================================================
   文章页
   ========================================================================== */

.b2b-entry {
	max-width: var(--wp--custom--container--narrow, 760px);
	margin-inline: auto;
	padding-block: var(--wp--preset--spacing--50);
}

.b2b-entry__header {
	margin-bottom: clamp(2rem, 1.5rem + 2vw, 3rem);
}

.b2b-entry__title {
	margin: 0 0 1rem;
	font-size: clamp(1.5rem, 1.25rem + 1.5vw, 2.25rem);
	line-height: 1.15;
	letter-spacing: -0.03em;
}

.b2b-entry__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem 1.25rem;
	font-size: var(--wp--preset--font-size--x-small);
	color: var(--wp--preset--color--text-muted);
}

.b2b-entry__thumb {
	margin-bottom: clamp(2rem, 1.5rem + 1.5vw, 2.5rem);
	border-radius: var(--wp--custom--radius--xl, 28px);
	overflow: hidden;
}

.b2b-entry__content {
	font-size: var(--wp--preset--font-size--large);
	line-height: 1.8;
}

.b2b-entry__content > * + * {
	margin-top: 1.25em;
}

.b2b-entry__content h2 {
	margin-top: 2em;
	margin-bottom: 0.6em;
	font-size: var(--wp--preset--font-size--xx-large);
}

.b2b-entry__content h3 {
	margin-top: 1.6em;
	margin-bottom: 0.5em;
	font-size: var(--wp--preset--font-size--x-large);
}

.b2b-entry__content ul,
.b2b-entry__content ol {
	padding-left: 1.5rem;
}

.b2b-entry__content li + li {
	margin-top: 0.4em;
}

.b2b-entry__content img {
	border-radius: var(--wp--custom--radius--lg, 18px);
}

.b2b-entry__content pre {
	padding: 1.25rem;
	border-radius: var(--wp--custom--radius--md, 12px);
	background: var(--wp--preset--color--dark);
	color: #E2E8F0;
	overflow-x: auto;
	font-size: var(--wp--preset--font-size--small);
}

/* 文章底部 CTA */
.b2b-entry__footer {
	margin-top: clamp(2.5rem, 2rem + 2vw, 4rem);
	padding-top: 2rem;
	border-top: 1px solid var(--wp--preset--color--border);
}

/* ==========================================================================
   404 / 空状态
   ========================================================================== */

.b2b-empty {
	padding-block: var(--wp--preset--spacing--60);
	text-align: center;
}

.b2b-empty__code {
	font-family: var(--wp--preset--font-family--heading);
	font-size: clamp(4rem, 3rem + 5vw, 8rem);
	font-weight: 800;
	line-height: 1;
	letter-spacing: -0.05em;
	color: var(--wp--preset--color--primary-light);
}

.b2b-empty__title {
	margin: 0 0 0.75rem;
	font-size: var(--wp--preset--font-size--xx-large);
}

.b2b-empty__text {
	margin: 0 0 2rem;
	color: var(--wp--preset--color--text-muted);
}

/* ==========================================================================
   页面级（page-* 模板用）
   ========================================================================== */

/* 内容页大标题 */
.b2b-page-title {
	max-width: 900px;
	margin-block: clamp(2rem, 1.5rem + 2vw, 3.5rem) clamp(1.5rem, 1.2rem + 1.5vw, 2.5rem);
	font-size: clamp(1.75rem, 1.4rem + 1.6vw, 2.5rem);
	font-weight: 800;
	line-height: 1.12;
	letter-spacing: -0.03em;
}

/* 页面顶部封面图 */
.b2b-page-hero {
	margin-bottom: clamp(2rem, 1.5rem + 2vw, 3.5rem);
	border-radius: var(--wp--custom--radius--xl, 28px);
	overflow: hidden;
	max-height: 520px;
}

.b2b-page-hero img {
	width: 100%;
	height: 100%;
	max-height: 520px;
	object-fit: cover;
}

.b2b-page-hero:empty {
	display: none;
}

/* ---- 无特色图兜底（1.3.4） ------------------------------------------------
 * 页面/条目没有设置特色图时，由 inc/setup.php 的 render_block 过滤器输出
 * 带 .--fallback / .--placeholder 的 figure。设计成品牌调性，避免内页顶部
 * 一片空白（用户反馈 PC 端 about/contact 顶部像没做完）。
 * ------------------------------------------------------------------------- */

/* 页面顶部 hero：深色品牌横幅 + 精密齿轮标记 */
.b2b-page-hero--fallback {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: clamp(150px, 24vw, 260px);
	background:
		radial-gradient(120% 150% at 85% -30%, rgba(27, 105, 255, 0.50) 0%, transparent 55%),
		radial-gradient(120% 150% at 8% 135%, rgba(27, 105, 255, 0.28) 0%, transparent 50%),
		repeating-linear-gradient(-45deg, rgba(255, 255, 255, 0.04) 0 2px, transparent 2px 14px),
		var(--wp--preset--color--dark);
}

.b2b-page-hero--fallback::before {
	content: "";
	width: clamp(46px, 6vw, 64px);
	aspect-ratio: 1;
	opacity: 0.92;
	background: center / contain no-repeat
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FFFFFF' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3Cpath d='M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1 0 2.83 2 2 0 0 1-2.83 0l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-2 2 2 2 0 0 1-2-2v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83 0 2 2 0 0 1 0-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1-2-2 2 2 0 0 1 2-2h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 0-2.83 2 2 0 0 1 2.83 0l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 2-2 2 2 0 0 1 2 2v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 0 2 2 0 0 1 0 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 2 2 2 2 0 0 1-2 2h-.09a1.65 1.65 0 0 0-1.51 1z'/%3E%3C/svg%3E");
}

/* 产品卡/条目列表缩略图：浅色底 + 图片标记 */
.b2b-media--placeholder {
	display: flex;
	align-items: center;
	justify-content: center;
	aspect-ratio: 4 / 3;
	background:
		repeating-linear-gradient(-45deg, rgba(14, 20, 32, 0.035) 0 1px, transparent 1px 10px),
		var(--wp--preset--color--light);
}

.b2b-media--placeholder::after {
	content: "";
	width: clamp(34px, 5vw, 46px);
	aspect-ratio: 1;
	opacity: 0.45;
	background: center / contain no-repeat
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230E1420' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Ccircle cx='8.5' cy='10' r='1.5'/%3E%3Cpath d='m21 15-5-5L5 21'/%3E%3C/svg%3E");
}

/* 条目/产品单页大缩略图占位 */
.b2b-entry__thumb--placeholder {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: clamp(180px, 30vw, 340px);
	background:
		repeating-linear-gradient(-45deg, rgba(14, 20, 32, 0.035) 0 1px, transparent 1px 10px),
		var(--wp--preset--color--light);
}

.b2b-entry__thumb--placeholder::after {
	content: "";
	width: clamp(42px, 6vw, 60px);
	aspect-ratio: 1;
	opacity: 0.45;
	background: center / contain no-repeat
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230E1420' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Ccircle cx='8.5' cy='10' r='1.5'/%3E%3Cpath d='m21 15-5-5L5 21'/%3E%3C/svg%3E");
}

/* page.html 底部自动追加的 CTA 的间距 */
.b2b-after-content {
	margin-top: var(--wp--preset--spacing--50);
}

/* 空白画布模板 */
.b2b-blank {
	min-height: 60vh;
}

/* 页脚栏的列间距（小屏时也要断开） */
.b2b-footer__bar p {
	margin: 0;
}

.b2b-404-search {
	max-width: 420px;
	margin: 2.5rem auto 0;
}

/* ==========================================================================
   产品详情页（page-product 模板用）
   ========================================================================== */

.b2b-product-hero__grid {
	display: grid;
	gap: clamp(2rem, 1.5rem + 3vw, 4rem);
	align-items: center;
}

@media (min-width: 900px) {
	.b2b-product-hero__grid { grid-template-columns: 1fr 1fr; }
}

.b2b-product-hero__media {
	border-radius: var(--wp--custom--radius--xl, 28px);
	overflow: hidden;
	border: 1px solid var(--wp--preset--color--border);
}

.b2b-product-hero__title {
	margin: 0 0 1rem;
	font-size: clamp(1.5rem, 1.25rem + 1.5vw, 2.25rem);
	font-weight: 800;
	line-height: 1.12;
	letter-spacing: -0.03em;
}

.b2b-product-hero__lead {
	margin: 0 0 1.5rem;
	font-size: var(--wp--preset--font-size--large);
	line-height: 1.65;
	color: var(--wp--preset--color--text-muted);
}

.b2b-product-hero__tags {
	gap: 0.5rem;
	margin-bottom: 1.75rem;
}

.b2b-product-hero__tags p {
	margin: 0;
}

.b2b-product-hero__grid .wp-block-buttons {
	gap: 0.75rem;
}

/* ==========================================================================
   打印
   ========================================================================== */

@media print {
	.b2b-section { padding-block: 1rem; }
	.b2b-cta,
	.b2b-inq,
	.b2b-float { display: none !important; }
	.b2b-header,
	.b2b-footer { background: none; color: #000; }
}