/* 系列页 /series/<代码>/（第三轮 U3，ART_DIRECTION 第七、八节；效果图 prototype/series.html 的 .hero .spec-split .points .craft .prods .guides .cards）。
   渲染在 inc/series-page.php；只在系列页加载（functions.php），在 v3.css 之后。颜色只用令牌。手机先写，断点：手机 < 768，平板 768–1023，桌面 ≥ 1024。 */

:where(.vz-series-page) :where(p, h1, h2, h3, ul, ol, dl, dd, figure) { margin: 0; } /* 不加优先级：横滑轨道、段标题行等自己的外边距照常生效 */
:where(.vz-series-page) :where(ul[role="list"]) { list-style: none; padding: 0; }
/* 段标题按中文逗号分句（vz_home_stories_phrases 的 span），每句不在中间断行；首页的同名规则只在首页加载 */
.vz-series-page .vz-home-phrase { display: inline-block; max-width: 100%; }

/* ---- 1 面包屑（只在桌面，.vz-v3-d-only） ---- */
.vz-series-crumbs { padding-block: 8px; }

/* ---- 2 首屏：手机图在上（方图）、字在下；768 起整幅照片、文字压在左下；无图为浅灰底文字版式 ---- */
/* base.css 的旧首屏规则（.vz-hero 栅格分屏、最小高度）不用：段本身用 .vz-hero.vz-series-hero 提高一级覆盖 */
.vz-hero.vz-series-hero { position: relative; display: block; grid-template-columns: none; min-height: 0; height: auto; max-height: none; margin: 0; padding: 0; background: var(--vz-color-surface-page); color: var(--vz-color-text-primary); overflow: hidden; }
.vz-series-hero__media { position: relative; display: block; aspect-ratio: 1 / 1; overflow: hidden; background: var(--vz-color-surface-subtle); }
.vz-series-hero__media img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 50%; }
.vz-series-hero__text { display: grid; justify-items: start; gap: 16px; padding-block: 24px 8px; }
/* 小标题 = 品类名：普通段落小标题（短红线 + 红字），不用首屏 VEAZEN / EST. 2016 的原设计样式（v3.css 的 .vz-hero .vz-eyebrow） */
.vz-hero.vz-series-hero .vz-eyebrow { display: flex; font-size: 13px; font-weight: 600; letter-spacing: 0.12em; text-transform: none; color: var(--vz-color-brand-red); }
.vz-hero.vz-series-hero .vz-eyebrow::before { content: ""; }
.vz-series-hero__title { color: inherit; overflow-wrap: anywhere; }
.vz-series-hero__lead { max-width: 34em; color: var(--vz-v3-ink-2); }
.vz-series-hero__actions { display: flex; flex-direction: column; align-items: stretch; gap: 12px; width: 100%; margin-top: 4px; }
.vz-series-hero__actions .vz-btn { width: 100%; } /* 手机通栏，高 48 来自 v3.css 的 .vz-btn（1024 起 52） */
.vz-hero.vz-series-hero.vz-hero--text { background: var(--vz-color-surface-subtle); }
.vz-series-hero.vz-hero--text .vz-series-hero__text { padding-block: 40px; }
@media (max-width: 767px) {
	.vz-series-hero--img:not(.vz-hero--text) .vz-series-hero__text { padding-bottom: 32px; }
}
@media (min-width: 768px) {
	.vz-series-hero__text { gap: 24px; max-width: 760px; padding-block: 72px; }
	.vz-series-hero__lead { word-break: keep-all; text-wrap: balance; } /* 中文只在标点处折行（手机不用：窄屏按字折行） */
	.vz-series-hero__actions { flex-direction: row; flex-wrap: wrap; align-items: center; gap: 14px 20px; width: auto; }
	.vz-series-hero__actions .vz-btn { width: auto; }
	.vz-series-hero.vz-hero--text .vz-series-hero__text { padding-block: 80px; }

	/* 有图：整幅照片（扣掉页头与面包屑，最高 760），底部与左侧渐变压暗，文字反白 */
	.vz-hero.vz-series-hero--img:not(.vz-hero--text) {
		display: flex; align-items: flex-end;
		height: calc(100vh - var(--vz-v3-hdr) - 64px); height: calc(100svh - var(--vz-v3-hdr) - 64px);
		min-height: 560px; max-height: 760px;
		background: var(--vz-color-surface-dark); color: var(--vz-color-text-inverse);
	}
	.vz-series-hero--img:not(.vz-hero--text) .vz-series-hero__media { position: absolute; inset: 0; aspect-ratio: auto; background: transparent; }
	.vz-series-hero--img:not(.vz-hero--text) .vz-series-hero__media::after {
		content: ""; position: absolute; inset: 0; pointer-events: none;
		background: linear-gradient(180deg, rgba(17, 17, 19, 0) 40%, rgba(17, 17, 19, 0.78) 100%), linear-gradient(90deg, rgba(17, 17, 19, 0.5) 0%, rgba(17, 17, 19, 0) 60%);
	}
	.vz-series-hero--img:not(.vz-hero--text) .vz-series-hero__inner { position: relative; z-index: 1; }
	.vz-series-hero--img:not(.vz-hero--text) .vz-series-hero__text { padding-block: 0 72px; }
	.vz-series-hero--img:not(.vz-hero--text) .vz-eyebrow, .vz-series-hero--img:not(.vz-hero--text) .vz-series-hero__lead { color: var(--vz-color-text-inverse); }
	.vz-series-hero--img:not(.vz-hero--text) .vz-series-hero__ghost { border-color: var(--vz-color-text-inverse); color: var(--vz-color-text-inverse); }
	.vz-series-hero--img:not(.vz-hero--text) .vz-series-hero__ghost:hover { background: var(--vz-color-neutral-0); color: var(--vz-color-text-primary); }
	.vz-series-hero--img:not(.vz-hero--text) :focus-visible { outline-color: var(--vz-color-focus-on-dark); }
}
@media (min-width: 1024px) {
	.vz-series-hero--img:not(.vz-hero--text) .vz-series-hero__text { padding-bottom: 80px; }
}

/* ---- 3 概览：小标题、H2、要点（方点 + 分隔线）、正文；单栏最宽 960 ---- */
.vz-series-overview__inner { max-width: 960px; }
.vz-series-points { border-top: 1px solid var(--vz-color-border-default); }
.vz-series-points li { display: flex; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--vz-color-border-default); color: var(--vz-v3-ink-2); font-size: 15px; line-height: 1.7; }
.vz-series-points li::before { content: ""; flex: none; width: 6px; height: 6px; margin-top: 0.7em; background: var(--vz-color-brand-red); }
.vz-series-overview__body { margin-top: 24px; color: var(--vz-v3-ink-2); }
.vz-series-overview__body > * + * { margin-top: 1em; }
.vz-series-overview__body img { max-width: 100%; height: auto; }
@media (min-width: 768px) {
	.vz-series-points li { padding: 14px 0; font-size: 16px; }
	.vz-series-overview__body { margin-top: 32px; }
}

/* ---- 4 木材与配置：手机图通栏在上（4:3）、参数在下；768 起左图（4:5）右参数；没有图参数占满（两列） ---- */
.vz-series-specs__grid { display: grid; gap: 24px; }
.vz-series-specs__media { aspect-ratio: 4 / 3; margin-inline: calc(-1 * var(--vz-layout-margin)); }
.vz-series-specs__text { min-width: 0; }
.vz-series-specs__text .vz-v3-head { margin-bottom: 20px; }
.vz-series-specs__list { border-top: 1px solid var(--vz-color-border-default); }
.vz-series-specs__row { position: relative; padding: 12px 0 12px 18px; border-bottom: 1px solid var(--vz-color-border-default); font-size: 15px; line-height: 1.6; }
.vz-series-specs__row::before { content: ""; position: absolute; left: 0; top: calc(12px + 0.8em - 3px); width: 6px; height: 6px; background: var(--vz-color-brand-red); } /* 方点与首行文字居中 */
.vz-series-specs__row dt, .vz-series-specs__row dd { display: inline; }
.vz-series-specs__row dt { color: var(--vz-v3-ink-2); }
.vz-series-specs__row dd { color: var(--vz-color-text-primary); overflow-wrap: anywhere; }
.vz-series-specs__sep { white-space: pre; } /* 英文页的 ": " 保留空格 */
.vz-series-specs__colors { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; margin-top: 20px; }
.vz-series-specs__colors-label { color: var(--vz-color-text-muted); font-size: 13px; }
.vz-series-specs__chips { display: flex; flex-wrap: wrap; gap: 8px; }
.vz-series-specs__chips li { padding: 6px 14px; border: 1px solid var(--vz-color-border-strong); background: var(--vz-color-surface-page); color: var(--vz-color-text-primary); font-size: 13px; line-height: 1.4; }
@media (min-width: 768px) {
	.vz-series-specs__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 40px; align-items: center; }
	.vz-series-specs__grid--text { grid-template-columns: minmax(0, 1fr); }
	.vz-series-specs__media { aspect-ratio: 4 / 5; margin-inline: 0; }
	.vz-series-specs__text .vz-v3-head { margin-bottom: 28px; }
	.vz-series-specs__row { padding-block: 13px; font-size: 16px; }
	.vz-series-specs__row::before { top: calc(13px + 0.8em - 3px); }
	.vz-series-specs__colors { margin-top: 28px; }
	.vz-series-specs__colors-label { font-size: 14px; }
	.vz-series-specs__chips li { font-size: 14px; }
	.vz-series-specs__grid--text .vz-series-specs__list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 40px; border-top: 0; }
	.vz-series-specs__grid--text .vz-series-specs__row:nth-child(-n+2) { border-top: 1px solid var(--vz-color-border-default); }
}
@media (min-width: 1024px) {
	.vz-series-specs__grid { gap: 72px; }
	.vz-series-specs__grid--text .vz-series-specs__list { column-gap: 72px; }
}

/* ---- 5 工艺（页面唯一深色段）：手机大图通栏在上、文字在下；768 起左大图右文字（1280 起 7 : 5） ---- */
.vz-series-craft .vz-eyebrow { color: var(--vz-color-text-inverse); } /* 品牌红小字在深色底对比度不够，短红线保留 */
.vz-series-craft__main { display: grid; gap: 28px; }
.vz-series-craft__media { aspect-ratio: 4 / 3; margin-inline: calc(-1 * var(--vz-layout-margin)); background: var(--vz-color-surface-dark-raised); }
.vz-series-craft__text { display: grid; gap: 16px; justify-items: start; min-width: 0; }
.vz-series-craft__body { color: var(--vz-color-neutral-400); text-wrap: pretty; }
.vz-series-craft__text > .vz-v3-link { margin-top: 4px; color: var(--vz-color-text-inverse); }
@media (min-width: 768px) {
	.vz-series-craft__main { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 40px; align-items: center; }
	.vz-series-craft__main--text { grid-template-columns: minmax(0, 1fr); }
	.vz-series-craft__main--text .vz-series-craft__text { max-width: 720px; }
	.vz-series-craft__media { margin-inline: 0; }
	.vz-series-craft__text { gap: 20px; }
}
@media (min-width: 1024px) {
	.vz-series-craft__main { gap: 56px; }
}
@media (min-width: 1280px) {
	.vz-series-craft__main { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 72px; }
	.vz-series-craft__main--text { grid-template-columns: minmax(0, 1fr); }
}

/* ---- 6 型号：型号卡与品类页同一渲染（vz_model_card）；手机两列，平板三列，桌面 3 或 4 列 ---- */
.vz-series-models__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 12px; }
.vz-series-models__grid .vz-card__media { background: var(--vz-color-surface-raised); }
@media (min-width: 768px) {
	.vz-series-models__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px 20px; }
}
@media (min-width: 1024px) {
	.vz-series-models__grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 48px 32px; }
	.vz-series-models__grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 40px 28px; }
}

/* ---- 7 选购指南与试听：手机缩略图加标题的行（试听卡通栏），768 起三张卡 ---- */
.vz-series-guides__list { display: grid; border-top: 1px solid var(--vz-color-border-default); }
.vz-series-guide { position: relative; display: grid; grid-template-columns: 88px minmax(0, 1fr); gap: 14px; align-items: center; padding-block: 14px; border-bottom: 1px solid var(--vz-color-border-default); }
.vz-series-guide--text { grid-template-columns: minmax(0, 1fr); }
.vz-series-guide__media { aspect-ratio: 1; }
.vz-series-guide__media--empty { display: none; background: var(--vz-color-neutral-200); } /* 无图：手机行里省掉图位；桌面的浅灰图位比段底色深一档，看得出卡片位置 */
.vz-series-guide__body { display: grid; gap: 4px; min-width: 0; }
.vz-series-guide__meta { color: var(--vz-color-text-muted); }
.vz-series-guide__title { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }
.vz-series-guide__title a { color: inherit; text-decoration: none; }
.vz-series-guide__title a::after { content: ""; position: absolute; inset: 0; z-index: 0; } /* 整卡可点：标题链接铺满卡片，商城小链接压在上层 */
.vz-series-guide__more { display: none; }
.vz-series-guide__more .vz-v3-link { position: relative; z-index: 1; }
.vz-series-guide:hover .vz-series-guide__title a { text-decoration: underline; text-underline-offset: 3px; }
.vz-series-guide:hover .vz-v3-img img { transform: scale(1.03); }
.vz-series-guide--video { grid-template-columns: minmax(0, 1fr); align-items: start; gap: 12px; }
.vz-series-guide__video { aspect-ratio: 16 / 9; }
.vz-series-guide__video .vz-video__overlay { gap: 10px; }
@media (min-width: 768px) {
	.vz-series-guides__list { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px 24px; border-top: 0; }
	.vz-series-guide, .vz-series-guide--text { grid-template-columns: minmax(0, 1fr); align-items: start; align-content: start; gap: 16px; padding: 0; border: 0; }
	.vz-series-guide__media, .vz-series-guide__video { aspect-ratio: 3 / 2; }
	.vz-series-guide__media--empty { display: block; } /* 无图：桌面留浅灰图位，卡片顶部对齐 */
	.vz-series-guide__body { gap: 6px; }
	.vz-series-guide__title { -webkit-line-clamp: 3; }
	.vz-series-guide__more { display: block; margin-top: 2px; }
}
@media (min-width: 1024px) {
	.vz-series-guides__list { gap: 32px; }
}

/* ---- 8 同品类其他系列：手机横滑（约 80%，露出下一张一角），768 起三列 ---- */
.vz-series-others__list { list-style: none; }
.vz-series-other { min-width: 0; }
.vz-series-other__link { display: grid; align-content: start; gap: 8px; color: inherit; text-decoration: none; }
.vz-series-other__media { aspect-ratio: 4 / 5; margin-bottom: 6px; }
.vz-series-other__media--empty { background: var(--vz-color-surface-subtle); } /* 同排有别的卡带图时才出，保持顶部对齐 */
.vz-series-other__lead { color: var(--vz-color-text-muted); }
.vz-series-others__list--text .vz-series-other__link { padding-top: 16px; border-top: 2px solid var(--vz-color-text-primary); } /* 三张都没有图：文字卡 */
.vz-series-other__link:hover .vz-series-other__title { text-decoration: underline; text-underline-offset: 4px; }
@media (max-width: 767px) {
	/* 段内 ul 的外边距清零（:where 规则）不压过横滑的负外边距；这里显式写回，保证通栏横滑 */
	.vz-series-others__list.vz-v3-rail { margin: 0 calc(-1 * var(--vz-layout-margin)); padding-top: 4px; }
}
@media (min-width: 768px) {
	.vz-series-others__list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
	.vz-series-other__link { gap: 10px; }
	.vz-series-other__media { margin-bottom: 10px; }
}
@media (min-width: 1024px) {
	.vz-series-others__list { gap: 32px; }
}
