/* 首页第 4 至 6 屏（第三轮 U1，ART_DIRECTION 第五节第 4–6 行；结构在 inc/home/stories.php）：选购指南 / 关于我们 · 工坊（深色段）/ 音乐生活。
   手机先写（缩略图行列表、大图通栏、横滑），768 起改栅格；只用现有颜色令牌。 */

/* ---- 第 4 屏 选购指南：手机缩略图加标题的行，768 起三张文章卡 ---- */
.vz-home-guides__list { list-style: none; margin: 0; padding: 0; display: grid; border-top: 1px solid var(--vz-color-border-default); }
.vz-home-guides__item { position: relative; display: grid; grid-template-columns: 92px minmax(0, 1fr); gap: 14px; align-items: center; padding-block: 14px; border-bottom: 1px solid var(--vz-color-border-default); }
.vz-home-guides__item--text { grid-template-columns: minmax(0, 1fr); }
.vz-home-guides__media { aspect-ratio: 1; }
.vz-home-guides__media--empty { display: none; } /* 无图：手机行里省掉图位 */
.vz-home-guides__body { display: grid; gap: 4px; min-width: 0; }
.vz-home-guides__meta { color: var(--vz-color-text-muted); font-size: 13px; }
.vz-home-guides__title { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }
.vz-home-guides__title a { color: inherit; text-decoration: none; }
/* 整卡可点：标题链接铺满卡片，官方商城小链接压在上层 */
.vz-home-guides__title a::after { content: ""; position: absolute; inset: 0; z-index: 0; }
.vz-home-guides__more { display: none; }
.vz-home-guides__more .vz-v3-link { position: relative; z-index: 1; }
.vz-home-guides__item:hover .vz-home-guides__title a { text-decoration: underline; text-underline-offset: 3px; }
.vz-home-guides__item:hover .vz-v3-img img { transform: scale(1.03); }
@media (min-width: 768px) {
	.vz-home-guides__list { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px 24px; border-top: 0; }
	.vz-home-guides__item, .vz-home-guides__item--text { grid-template-columns: minmax(0, 1fr); align-items: start; align-content: start; gap: 16px; padding: 0; border: 0; }
	.vz-home-guides__media { aspect-ratio: 16 / 10; }
	.vz-home-guides__media--empty { display: block; } /* 无图：桌面留浅灰图位，三张卡顶部对齐 */
	.vz-home-guides__body { gap: 6px; }
	.vz-home-guides__title { -webkit-line-clamp: 3; }
	.vz-home-guides__more { display: block; margin-top: 2px; }
}
@media (min-width: 1024px) {
	.vz-home-guides__list { gap: 32px; }
}

/* ---- 第 5 屏 关于我们 · 工坊（深色段）：手机大图通栏在上、文字在下、工艺小图横滑；768 起左大图右文字 ---- */
/* 深色上文字反白，品牌红只做小标题短线、引语左线与链接箭头（红色小字在深色底对比度不够） */
.vz-home-craft .vz-eyebrow { color: var(--vz-color-text-inverse); }
.vz-home-craft a { color: inherit; text-decoration: none; }
.vz-home-craft__main { display: grid; gap: 28px; }
.vz-home-craft__media { aspect-ratio: 4 / 3; margin-inline: calc(-1 * var(--vz-layout-margin)); background: var(--vz-color-surface-dark-raised); }
.vz-home-craft__text { display: grid; gap: 16px; justify-items: start; min-width: 0; }
.vz-home-craft__lead { color: var(--vz-color-neutral-400); text-wrap: pretty; }
.vz-home-craft__quote { margin: 8px 0 0; padding-left: 18px; border-left: 2px solid var(--vz-color-brand-red); }
.vz-home-craft__quote blockquote { margin: 0; padding: 0; border: 0; }
.vz-home-craft__quote p { font-size: 15px; line-height: 1.8; color: var(--vz-color-text-inverse); text-wrap: pretty; }
.vz-home-craft__quote figcaption { margin-top: 6px; font-size: 13px; line-height: 1.5; color: var(--vz-color-neutral-400); }
.vz-home-craft__text > .vz-v3-link { margin-top: 4px; }
.vz-home-craft .vz-home-craft__items { --vz-rail-w: 64%; margin-top: 40px; padding-top: 24px; border-top: 1px solid var(--vz-color-neutral-800); list-style: none; }
.vz-home-craft__item { display: grid; gap: 12px; min-height: 44px; }
.vz-home-craft__thumb { aspect-ratio: 3 / 2; }
.vz-home-craft__thumb--empty { background: var(--vz-color-neutral-800); }
.vz-home-craft__item:hover h3 { text-decoration: underline; text-underline-offset: 3px; }
@media (min-width: 768px) {
	.vz-home-craft__main { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 40px; align-items: center; } /* 1280 以下对半，文字栏放得下两行标题 */
	.vz-home-craft__main--text { grid-template-columns: minmax(0, 1fr); }
	.vz-home-craft__main--text .vz-home-craft__text { max-width: 720px; }
	.vz-home-craft__media { margin-inline: 0; }
	.vz-home-craft__text { gap: 20px; }
	.vz-home-craft .vz-home-craft__items { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin: 56px 0 0; padding: 40px 0 0; }
	.vz-home-craft__item { gap: 14px; }
}
@media (min-width: 1024px) {
	.vz-home-craft__main { gap: 56px; }
	.vz-home-craft__quote p { font-size: 16px; }
	.vz-home-craft .vz-home-craft__items { gap: 32px; margin-top: 72px; }
}
@media (min-width: 1280px) {
	.vz-home-craft__main { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 72px; }
}

/* ---- 第 6 屏 音乐生活：手机竖图卡横滑（约 78%），768 起一大两小 ---- */
.vz-home-life__grid { --vz-rail-w: 78%; list-style: none; } /* 手机横滑的外边距与内边距由 .vz-v3-rail 给，这里不覆盖 */
.vz-home-life__grid--1 { --vz-rail-w: 100%; }
.vz-home-life__card { min-width: 0; }
.vz-home-life__link { display: grid; gap: 14px; color: inherit; text-decoration: none; }
.vz-home-life__fig { position: relative; aspect-ratio: 4 / 5; overflow: hidden; background: var(--vz-color-surface-subtle); }
.vz-home-life__img { position: absolute; inset: 0; }
.vz-home-life__tag { position: absolute; left: 10px; top: 10px; padding: 3px 10px; background: var(--vz-color-surface-page); color: var(--vz-color-brand-red); font-size: 12px; font-weight: 500; letter-spacing: 0.06em; line-height: 1.5; }
.vz-home-life__body { display: grid; gap: 6px; }
.vz-home-life__body > h3 { font-size: var(--vz-typography-h4-font-size); line-height: var(--vz-typography-h4-line-height); }
.vz-home-life__role { color: var(--vz-color-text-muted); font-size: 13px; }
.vz-home-life__link:hover h3 { text-decoration: underline; text-underline-offset: 3px; }
@media (min-width: 768px) {
	.vz-home-life__grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 32px 24px; align-content: start; align-items: start; margin: 0; padding: 0; }
	.vz-home-life__card:not(.vz-home-life__card--big) .vz-home-life__fig { aspect-ratio: 16 / 9; }
	/* 三篇：大卡跨两行，图位撑满右侧两张小卡的总高，左右底边对齐 */
	.vz-home-life__grid--3 .vz-home-life__card--big { grid-row: 1 / span 2; align-self: stretch; }
	.vz-home-life__grid--3 .vz-home-life__card--big .vz-home-life__link { height: 100%; grid-template-rows: minmax(0, 1fr) auto; }
	.vz-home-life__grid--3 .vz-home-life__card--big .vz-home-life__fig { aspect-ratio: auto; min-height: 320px; }
	/* 两篇：对半，同为 4 : 3 */
	.vz-home-life__grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.vz-home-life__grid--2 .vz-home-life__card .vz-home-life__fig, .vz-home-life__grid--1 .vz-home-life__card .vz-home-life__fig { aspect-ratio: 4 / 3; }
	.vz-home-life__tag { left: 16px; top: 16px; }
	.vz-home-life__grid--3 .vz-home-life__card--big .vz-home-life__body > h3, .vz-home-life__grid--1 .vz-home-life__body > h3 { font-size: var(--vz-typography-h3-font-size); line-height: var(--vz-typography-h3-line-height); }
	/* 只有一篇：左图右字 */
	.vz-home-life__grid--1 { grid-template-columns: minmax(0, 1fr); }
	.vz-home-life__grid--1 .vz-home-life__link { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 48px; align-items: center; }
}
@media (min-width: 1024px) {
	.vz-home-life__grid { gap: 32px; }
}

/* 横滑是 ul：通栏负边距再写一次（v3.css 段内清零已改 :where 不加优先级，这条与上面工艺小图一排的两个类写法只是保险） */
@media (max-width: 767px) {
	.vz-home-craft__items.vz-v3-rail, .vz-home-life__grid.vz-v3-rail { margin-inline: calc(-1 * var(--vz-layout-margin)); }
}

/* 标题分句：每句是一个不断行的整体，放不下时句内再断（inc/home/stories.php vz_home_stories_phrases） */
.vz-home-phrase { display: inline-block; max-width: 100%; }