/* ============================================================
   C-TALK HOME · STEP 3 · M1 暗金大片 Cinema Atelier
   首屏 Minotti 暗调沉浸 · 内容区 Poltrona Frau 浅暖工程叙事
   案例/工艺页借用 M3 编号章节 · 双金色纪律
   内容可见性铁律：无 JS 全部内容完整可见（占位框纯 CSS 渲染）
   ============================================================ */

/* ---------- 字体 ---------- */
/* 字体改由 <head> 直接 <link> 引入（原 @import 造成 3 跳串行，拖慢 FCP/LCP） */

/* ---------- 设计令牌（M1 色板） ---------- */
:root {
  --black: #0D0B08;       /* 首屏近黑底 */
  --ivory: #F2ECDF;       /* 首屏象牙白文字 */
  --champagne: #C9A26B;   /* 香槟金：仅细线/小标/水印，永不做大面积、不做小字正文 */
  --paper: #F6F2EA;       /* 内容区暖纸底 */
  --surface: #FFFDF8;     /* 卡片面 */
  --ink: #211C14;         /* 墨色正文 */
  --soft: #6B6357;        /* 弱文 */
  --deep-brass: #7A5A2E;  /* 文字强调深铜（AA 实测） */
  --gold-stat: #AD8441;   /* 数字用香槟金（暖纸底 3.1:1，42px 大字过 AA 大文本线） */
  --img-filter: brightness(.82) saturate(.80) contrast(1.10);  /* v1.3 全站图片统一后期 */
  --hairline: #E3DCCC;    /* 发丝线 */
  --serif: 'Cormorant Garamond', 'Noto Serif SC', Georgia, serif;
  --sans: 'Jost', 'Noto Sans SC', 'Segoe UI', sans-serif;
  --content-visible: both; /* 单向入场：从透明播到显现 */
}
html[lang='zh'] { --serif: 'Noto Serif SC', 'Cormorant Garamond', serif; --sans: 'Noto Sans SC', 'Jost', sans-serif; }

/* ---------- 基础 ---------- */
* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01s !important; transition-duration: .01s !important; }
}
body {
  background: var(--paper); color: var(--ink);
  font-family: var(--sans); font-size: 16px; line-height: 1.75;
  -webkit-font-size-adjust: 100%;
}
img { max-width: 100%; display: block; }
a { color: inherit; }
.container { max-width: 1140px; margin: 0 auto; padding: 0 clamp(20px, 4vw, 44px); }
.narrow { max-width: 880px; }

/* ---------- 单向入场动画（铁律：both，无 JS 也播放完毕保持可见） ---------- */
.rise { animation: rise .8s var(--content-visible) ease-out; }
.rise-1 { animation: rise .8s var(--content-visible) .12s ease-out; }
.rise-2 { animation: rise .8s var(--content-visible) .24s ease-out; }
.rise-3 { animation: rise .8s var(--content-visible) .36s ease-out; }
@keyframes rise { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }

/* ---------- 导航 ---------- */
.nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 90;
  display: flex; align-items: center; justify-content: space-between;
  padding: 18px clamp(20px, 4vw, 44px);
  transition: background .35s, padding .35s, box-shadow .35s;
}
.nav.scrolled { background: rgba(13, 11, 8, .94); padding: 12px clamp(20px, 4vw, 44px); box-shadow: 0 1px 0 rgba(201, 162, 107, .25); }
.nav-logo { font-family: var(--serif); font-size: 21px; font-weight: 600; letter-spacing: .16em; color: var(--ivory); text-decoration: none; }
.nav-logo span { color: var(--champagne); }
.nav-links { display: flex; gap: clamp(16px, 2.6vw, 34px); align-items: center; }
.nav-links a {
  font-family: var(--sans); font-size: 12.5px; letter-spacing: .18em; text-transform: uppercase;
  color: rgba(242, 236, 223, .88); text-decoration: none; padding-bottom: 2px;
  border-bottom: 1px solid transparent; transition: border-color .25s, color .25s;
}
.nav-links a:hover, .nav-links a[aria-current='page'] { color: var(--champagne); border-bottom-color: var(--champagne); }
.nav-links a.lang { color: var(--champagne); }
@media (max-width: 820px) { .nav-links a.opt { display: none; } }

/* ---------- Hero（首屏恒暗：M1 居中镇场） ---------- */
.hero {
  position: relative; min-height: 100vh; display: flex; align-items: center; justify-content: center;
  background: var(--black); color: var(--ivory); text-align: center; overflow: hidden;
}
.hero .slot-dark { position: absolute; inset: 0; z-index: 0; }
.hero-inner { position: relative; z-index: 2; padding: 130px clamp(20px, 5vw, 60px) 120px; max-width: 900px; }
.hero-eyebrow { font-size: 12px; letter-spacing: .5em; text-transform: uppercase; color: var(--champagne); margin-bottom: 26px; }
.hero h1 {
  font-family: var(--serif); font-weight: 500; font-style: italic;
  font-size: clamp(34px, 6.2vw, 64px); line-height: 1.18; letter-spacing: .01em;
}
/* v1.3：首屏字标错落排版（Minotti 不对称字标）——第二行整体右移，形成阅读节奏
   同时加一条 60% 宽、opacity .4 的香槟金细线，压在 Slogan 上方 20px，暗示"精密工程" */
.hero .h1-l1, .hero .h1-l2 { display: inline-block; }
.hero .h1-l2 { transform: translateX(clamp(20px, 7vw, 112px)); }
.hero-line {
  width: min(60vw, 620px); height: 1px; background: var(--champagne);
  opacity: .4; margin: 0 auto 20px;
}
.hero .hero-eyebrow { margin-bottom: 16px; }
@media (max-width: 480px) { .hero .hero-eyebrow { letter-spacing: .28em; font-size: 11px; } }
.hero .hero-cta-row { margin-top: 34px; }
.hero .hero-sub { text-wrap: balance; max-width: 760px; letter-spacing: .04em; }
.hero .hero-sub {
  margin: 22px auto 0; max-width: 640px;
  font-family: var(--sans); font-weight: 300; font-size: clamp(15px, 1.8vw, 18px);
  color: rgba(242, 236, 223, .85); letter-spacing: .06em;
}
.hero-rule { width: 56px; height: 1px; background: var(--champagne); margin: 30px auto; }
.hero-cta-row { display: flex; gap: 16px; justify-content: center; flex-wrap: wrap; }
.btn {
  display: inline-block; font-family: var(--sans); font-size: 12.5px; letter-spacing: .24em; text-transform: uppercase;
  padding: 15px 34px; text-decoration: none;
  transition: background .3s, color .3s, border-color .3s, box-shadow .35s;
}
/* v1.3：CTA hover 加香槟金描边 + 外发光（暗底浅底都成立，纯装饰不抢主按钮） */
.btn-gold { background: var(--champagne); color: #14100A; border: 1px solid var(--champagne); }
.btn-gold:hover { background: #D8B47E; border-color: #E9CE9E; box-shadow: 0 0 0 1px var(--champagne), 0 10px 30px rgba(201, 162, 107, .32); }
.btn-line { border: 1px solid rgba(242, 236, 223, .55); color: var(--ivory); }
.btn-line:hover { border-color: var(--champagne); color: var(--champagne); box-shadow: 0 0 0 1px rgba(201, 162, 107, .55), 0 0 24px rgba(201, 162, 107, .22); }
/* v1.6：浅底（暖纸）上的次按钮 —— 象牙白描边在暖纸上不可见，改用深铜 */
.btn-outline { border: 1px solid rgba(122, 90, 46, .5); color: var(--deep-brass); }
.btn-outline:hover { border-color: var(--deep-brass); background: rgba(122, 90, 46, .06); box-shadow: 0 0 0 1px rgba(122, 90, 46, .3), 0 8px 22px rgba(122, 90, 46, .12); }
/* 双按钮行（工艺摘要区：主 + 次） */
.btn-row { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; align-items: center; }
.hero-scroll { position: absolute; bottom: 30px; left: 50%; transform: translateX(-50%); z-index: 2; font-size: 10.5px; letter-spacing: .4em; color: rgba(242, 236, 223, .55); text-transform: uppercase; }
/* 子页 Hero（次级暗屏） */
.subhero { position: relative; background: var(--black); color: var(--ivory); text-align: center; padding: 150px 20px 90px; overflow: hidden; }
.subhero .slot-dark { position: absolute; inset: 0; z-index: 0; }
.subhero-inner { position: relative; z-index: 2; max-width: 820px; margin: 0 auto; }
.subhero .kicker { font-size: 11.5px; letter-spacing: .44em; text-transform: uppercase; color: var(--champagne); margin-bottom: 18px; }
.subhero h1 { font-family: var(--serif); font-weight: 500; font-size: clamp(30px, 4.6vw, 50px); line-height: 1.2; }
.subhero .lede { margin: 18px auto 0; max-width: 640px; color: rgba(242, 236, 223, .85); font-weight: 300; font-size: clamp(14.5px, 1.7vw, 17px); letter-spacing: .05em; }
.subhero .lede-note { margin: 22px auto 0; max-width: 640px; font-size: 11.5px; letter-spacing: .22em; text-transform: uppercase; color: rgba(201, 162, 107, .8); font-weight: 400; }
.subhero .lede-note::before { content: '◦ '; }

/* v1.4 最终：Contact 首屏纯色化——墨底 #0D0B08 + 1px 香槟金发丝线（替代与 collections-hero 同源的图片）
   无图即无暗角/压暗叠层，故 ::before/::after 一并关闭，避免空叠层占用层叠上下文 */
.subhero.subhero-flat {
  background: #0D0B08;
  padding: 150px 20px 96px;
  border-bottom: 1px solid rgba(201, 162, 107, .4);
}
.subhero.subhero-flat::before,
.subhero.subhero-flat::after { display: none; }
.subhero.subhero-flat h1 { text-shadow: none; }

/* ---------- 数字带 ---------- */
.stats { background: var(--paper); border-bottom: 1px solid var(--hairline); }
.stats-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; padding: 44px 0; text-align: center; }
@media (max-width: 720px) { .stats-row { grid-template-columns: repeat(2, 1fr); } }
.stat b { display: block; font-family: var(--serif); font-size: clamp(30px, 3.6vw, 42px); font-weight: 600; color: var(--gold-stat); }
.stat span { font-size: 12px; letter-spacing: .18em; text-transform: uppercase; color: var(--soft); }
.stat .zh { display: block; font-size: 12.5px; color: var(--soft); letter-spacing: .08em; margin-top: 2px; }

/* ---------- 章节头 ---------- */
.section { padding: clamp(60px, 9vw, 100px) 0; }
.section-head { margin-bottom: clamp(28px, 4vw, 46px); }
.sec-tag { font-size: 11.5px; letter-spacing: .4em; text-transform: uppercase; color: var(--deep-brass); margin-bottom: 12px; }
.section-head h2 { font-family: var(--serif); font-size: clamp(26px, 3.6vw, 38px); font-weight: 600; line-height: 1.25; letter-spacing: .01em; }
.section-head .lede { margin-top: 14px; max-width: 660px; color: var(--soft); font-size: 15.5px; }
.hairline { border: 0; border-top: 1px solid var(--hairline); margin: 0; }

/* M3 编号章节头（案例页/工艺页）：01 — 03
   v1.3：编号段落头部加香槟金短线（左侧 76px 金，其余发丝线），强化"章节编号"的精密感 */
.chapter { padding: clamp(60px, 9vw, 100px) 0; }
.chapter-head { position: relative; display: flex; align-items: baseline; gap: 18px; padding-bottom: 18px; margin-bottom: clamp(28px, 4vw, 44px); }
.chapter-head::after {
  content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 1px;
  background: linear-gradient(90deg, var(--champagne) 0 76px, var(--hairline) 76px 100%);
}
.chapter-no { font-family: var(--sans); font-weight: 300; font-size: clamp(30px, 4vw, 44px); letter-spacing: .1em; color: var(--champagne); }
.chapter-head h2 { font-family: var(--serif); font-size: clamp(26px, 3.4vw, 36px); font-weight: 600; }
.chapter-head .en-note { margin-left: auto; font-size: 11.5px; letter-spacing: .28em; text-transform: uppercase; color: var(--soft); white-space: nowrap; }
@media (max-width: 640px) { .chapter-head .en-note { display: none; } }

/* ---------- 占位框系统（核心：纯 CSS 渲染，无 JS 完整可见） ---------- */
.slot {
  position: relative; display: grid; place-items: center;
  background:
    repeating-linear-gradient(45deg, rgba(160, 146, 116, .10) 0 8px, rgba(160, 146, 116, 0) 8px 16px),
    #E4DCCC;
  border: 1.5px dashed #B0A184; overflow: hidden;
}
/* 有图时隐藏占位装饰（边框/斜纹/槽位标签），避免压在照片上 */
.slot.has-img { background: none; border-color: transparent; }
.slot.has-img::before, .slot.has-img::after { display: none; }
.slot::before {
  content: attr(data-slot);
  font-family: Consolas, 'Courier New', monospace; font-size: clamp(11px, 1.4vw, 13.5px);
  letter-spacing: .08em; color: #6F6045; font-weight: 600; text-align: center; padding: 0 10px;
}
.slot::after {
  content: attr(data-size) " · " attr(data-priority);
  position: absolute; bottom: 10px; left: 0; right: 0; text-align: center;
  font-family: Consolas, 'Courier New', monospace; font-size: 10.5px; color: #8A7A5E; letter-spacing: .12em;
}
.slot img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.slot-dark { background: #2B2620; border: 1.5px dashed #544A38; }
.slot-dark::before { color: #8F8370; position: absolute; top: 14px; left: 16px; text-align: left; padding: 0; opacity: .6; }
.slot-dark::after { color: #6E6455; position: absolute; bottom: 14px; left: 16px; right: auto; text-align: left; opacity: .6; }

/* ---------- 图片三段兜底全部失败时的降级 ----------
   普通槽位：去掉 .has-img 后自动回到命名占位框（设计内状态，看得出是待补图）
   首屏/尾屏：退为纯深色，既不露槽位名，也不露浏览器破图图标 */
.slot.img-fail { background: #E4DCCC; }
.slot.img-fail::before, .slot.img-fail::after { display: block; }
.hero .slot-dark.img-fail,
.subhero .slot-dark.img-fail,
.final-cta .slot-dark.img-fail,
.hero .slot.img-fail,
.subhero .slot.img-fail,
.final-cta .slot.img-fail {
  background: #0D0B08;
  border-color: transparent;
}
.hero .slot-dark.img-fail::before, .hero .slot-dark.img-fail::after,
.subhero .slot-dark.img-fail::before, .subhero .slot-dark.img-fail::after,
.final-cta .slot-dark.img-fail::before, .final-cta .slot-dark.img-fail::after,
.hero .slot.img-fail::before, .hero .slot.img-fail::after,
.subhero .slot.img-fail::before, .subhero .slot.img-fail::after,
.final-cta .slot.img-fail::before, .final-cta .slot.img-fail::after { display: none; }
.slot figcaption, .slot .cap {
  position: absolute; left: 0; right: 0; bottom: 0; z-index: 3;
  background: linear-gradient(180deg, transparent, rgba(13, 11, 8, .78));
  color: var(--ivory); font-size: 12.5px; letter-spacing: .16em; text-transform: uppercase;
  padding: 34px 16px 12px; text-align: left;
}

/* ---------- 通用网格 ---------- */
.grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(18px, 3vw, 34px); }
.grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(16px, 2.6vw, 28px); }
.grid-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(14px, 2.2vw, 24px); }
@media (max-width: 900px) { .grid-4 { grid-template-columns: repeat(2, 1fr); } .grid-3 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 620px) { .grid-2, .grid-3, .grid-4 { grid-template-columns: 1fr; } }

/* 图文对排（内容区：Molteni&C 纪律——70% 给图，30% 给文字） */
.feature { display: grid; grid-template-columns: 2.35fr 1fr; gap: clamp(26px, 5vw, 64px); align-items: center; }
.feature.flip { grid-template-columns: 1fr 2.35fr; }
.feature .slot { order: 0; }
.feature.flip .slot { order: 2; }
@media (max-width: 820px) { .feature, .feature.flip { grid-template-columns: 1fr; } .feature.flip .slot { order: 0; } }
.feature h3 { font-family: var(--serif); font-size: clamp(22px, 2.6vw, 28px); font-weight: 600; margin-bottom: 12px; }
.feature p { color: var(--soft); font-size: 15.5px; margin-bottom: 12px; }
.feature ul { margin: 0 0 16px 18px; color: var(--soft); font-size: 15px; }
.feature ul li { margin-bottom: 6px; }
.feature .kw { color: var(--deep-brass); font-weight: 500; }

/* 场景卡 */
.card { background: var(--surface); border: 1px solid var(--hairline); border-radius: 10px; overflow: hidden; text-decoration: none; display: block; transition: transform .3s, box-shadow .3s; }
.card:hover { transform: translateY(-4px); box-shadow: 0 14px 34px rgba(42, 37, 28, .12); }
.card .slot { border: none; border-radius: 10px 10px 0 0; }
.card-body { padding: 18px 20px 20px; }
.card-body b { font-family: var(--serif); font-size: 19px; font-weight: 600; display: block; margin-bottom: 4px; }
.card-body span { font-size: 13.5px; color: var(--soft); line-height: 1.65; display: block; }

/* 案例条（首页精选案例） */
.case-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(16px, 2.6vw, 28px); }
@media (max-width: 900px) { .case-row { grid-template-columns: 1fr; } }
.case { text-decoration: none; color: inherit; }
.case .slot { border-radius: 10px; }
.case figcaption { font-family: var(--sans); font-size: 13px; color: var(--deep-brass); letter-spacing: .14em; text-transform: uppercase; margin-top: 12px; }
.case .zh-cap { display: block; font-size: 12.5px; color: var(--soft); letter-spacing: .05em; margin-top: 2px; }

/* ---------- 时间线（七节点流程） ---------- */
.timeline { border-left: 1px solid var(--hairline); margin: 8px 0 0 6px; padding: 0 0 0 30px; }
.timeline-item { position: relative; padding: 0 0 26px; }
/* v1.3：香槟金实心圆 + 外圈光晕，让七节点在浅底上"跳"出来 */
.timeline-item::before {
  content: ''; position: absolute; left: -35px; top: 7px; width: 10px; height: 10px;
  border-radius: 50%; background: var(--champagne);
  box-shadow: 0 0 0 1px rgba(168, 129, 63, .55), 0 0 0 5px rgba(201, 162, 107, .13);
}
.timeline-item b { font-family: var(--sans); font-size: 14.5px; letter-spacing: .12em; text-transform: uppercase; color: var(--deep-brass); display: block; }
.timeline-item span { font-size: 14px; color: var(--soft); }

/* ---------- 矩阵表（产品页：定制能力矩阵） ---------- */
.matrix-wrap { overflow-x: auto; border: 1px solid var(--hairline); border-radius: 10px; background: var(--surface); }
table.matrix { width: 100%; border-collapse: collapse; min-width: 720px; font-size: 14px; }
.matrix th { font-family: var(--sans); font-size: 12px; letter-spacing: .16em; text-transform: uppercase; text-align: left; padding: 14px 16px; color: var(--deep-brass); border-bottom: 1.5px solid var(--hairline); background: rgba(138, 106, 59, .06); }
.matrix td { padding: 14px 16px; border-bottom: 1px solid #EEE8DA; vertical-align: top; color: var(--soft); }
.matrix tr:last-child td { border-bottom: none; }
.matrix td:first-child { font-family: var(--serif); font-size: 16.5px; font-weight: 600; color: var(--ink); white-space: nowrap; }
.matrix td .zh-sub { display: block; font-size: 12px; color: var(--soft); letter-spacing: .06em; }

/* ---------- 钩子条 ---------- */
.hook {
  background: var(--black); color: var(--ivory); border-radius: 12px;
  padding: clamp(30px, 5vw, 52px); position: relative; overflow: hidden;
}
.hook::after { content: '※'; position: absolute; right: 22px; bottom: 6px; font-size: 120px; color: rgba(201, 162, 107, .12); font-family: var(--serif); line-height: 1; }
.hook .hook-tag { font-size: 11px; letter-spacing: .4em; text-transform: uppercase; color: var(--champagne); margin-bottom: 14px; }
.hook h3 { font-family: var(--serif); font-size: clamp(22px, 3vw, 30px); font-weight: 600; line-height: 1.3; max-width: 640px; }
.hook p { color: rgba(242, 236, 223, .78); font-size: 15px; max-width: 620px; margin: 12px 0 24px; }
.hook .btn-gold { border-color: transparent; }
.hook-form { display: flex; gap: 10px; flex-wrap: wrap; }
.hook-form input {
  flex: 1 1 220px; background: rgba(242, 236, 223, .07); border: 1px solid rgba(201, 162, 107, .4);
  color: var(--ivory); padding: 13px 16px; font-family: var(--sans); font-size: 14px; letter-spacing: .04em;
}
.hook-form input::placeholder { color: rgba(242, 236, 223, .45); }
.hook-form input:focus { outline: none; border-color: var(--champagne); }

/* ---------- 表单（联系页 5 字段） ---------- */
.form-card { background: var(--surface); border: 1px solid var(--hairline); border-radius: 12px; padding: clamp(24px, 4vw, 42px); }
.form-card h3 { font-family: var(--serif); font-size: 24px; font-weight: 600; margin-bottom: 6px; }
.form-card .form-sub { font-size: 13.5px; color: var(--soft); margin-bottom: 22px; }
.f-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
@media (max-width: 620px) { .f-row { grid-template-columns: 1fr; } }
.f-field { margin-bottom: 16px; }
.f-field label { display: block; font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--deep-brass); margin-bottom: 7px; }
.f-field input, .f-field select, .f-field textarea {
  width: 100%; border: 1px solid var(--hairline); background: var(--paper);
  padding: 13px 15px; font-family: var(--sans); font-size: 15px; color: var(--ink); border-radius: 4px;
}
.f-field input:focus, .f-field select:focus, .f-field textarea:focus { outline: none; border-color: var(--champagne); }
.f-field textarea { min-height: 110px; resize: vertical; }
.form-note { font-size: 12.5px; color: var(--soft); margin-top: 10px; }
.wa-card { background: var(--black); color: var(--ivory); border-radius: 12px; padding: clamp(24px, 4vw, 36px); }
.wa-card .tag { font-size: 11px; letter-spacing: .38em; color: var(--champagne); text-transform: uppercase; margin-bottom: 12px; }
.wa-card h3 { font-family: var(--serif); font-size: 22px; font-weight: 600; margin-bottom: 10px; }
.wa-card p { color: rgba(242, 236, 223, .75); font-size: 14px; margin-bottom: 20px; }
.wa-card .num { font-family: var(--sans); font-size: 19px; letter-spacing: .1em; color: var(--champagne); font-weight: 500; }

/* ---------- 尾屏 CTA ---------- */
.final-cta { position: relative; background: var(--black); color: var(--ivory); text-align: center; padding: clamp(70px, 10vw, 120px) 20px; overflow: hidden; }
.final-cta .slot-dark { position: absolute; inset: 0; z-index: 0; }
.final-cta-inner { position: relative; z-index: 2; max-width: 760px; margin: 0 auto; }
.final-cta h2 { font-family: var(--serif); font-size: clamp(28px, 4.4vw, 44px); font-weight: 500; line-height: 1.25; }
.final-cta p { color: rgba(242, 236, 223, .8); margin: 18px 0 30px; font-weight: 300; font-size: 16px; letter-spacing: .04em; }
.final-cta .hero-rule { margin: 26px auto; }

/* ---------- 悬浮 WhatsApp ---------- */
.wa-float {
  position: fixed; right: 22px; bottom: 22px; z-index: 80;
  display: flex; align-items: center; gap: 10px; text-decoration: none;
  background: var(--black); color: var(--ivory); border: 1px solid rgba(201, 162, 107, .5);
  border-radius: 999px; padding: 11px 20px 11px 14px;
  font-family: var(--sans); font-size: 12.5px; letter-spacing: .14em; text-transform: uppercase;
  box-shadow: 0 10px 30px rgba(13, 11, 8, .35); transition: border-color .3s, transform .3s;
}
.wa-float:hover { border-color: var(--champagne); transform: translateY(-2px); }
.wa-float .dot { width: 9px; height: 9px; border-radius: 50%; background: #4CAF50; }
@media (max-width: 520px) { .wa-float span.txt { display: none; } .wa-float { padding: 13px; } }

/* ---------- 页脚 ---------- */
.footer { background: #0A0906; color: rgba(242, 236, 223, .72); padding: 54px 0 30px; }
.footer-grid { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 34px; }
@media (max-width: 820px) { .footer-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 540px) { .footer-grid { grid-template-columns: 1fr; } }
.footer .f-logo { font-family: var(--serif); font-size: 22px; color: var(--ivory); letter-spacing: .14em; }
.footer .f-slogan { font-family: var(--serif); font-style: italic; font-size: 15px; color: var(--champagne); margin: 10px 0 14px; letter-spacing: .04em; }
.footer p { font-size: 13px; line-height: 1.9; }
.footer h4 { font-size: 11.5px; letter-spacing: .3em; text-transform: uppercase; color: var(--champagne); margin-bottom: 12px; font-weight: 500; }
.footer ul { list-style: none; }
.footer ul li { margin-bottom: 8px; }
.footer ul a { font-size: 13.5px; color: rgba(242, 236, 223, .72); text-decoration: none; }
.footer ul a:hover { color: var(--champagne); }
.footer .f-bottom { border-top: 1px solid rgba(201, 162, 107, .18); margin-top: 38px; padding-top: 18px; font-size: 12px; color: rgba(242, 236, 223, .45); display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; }

/* ---------- 通用小件 ---------- */
.note { font-size: 13px; color: var(--soft); }
.gold { color: var(--deep-brass); font-weight: 500; }
.divider-star { text-align: center; color: var(--champagne); font-size: 18px; letter-spacing: .8em; padding: 6px 0 0; }
.badge { display: inline-block; font-size: 11px; letter-spacing: .2em; text-transform: uppercase; border: 1px solid var(--hairline); border-radius: 999px; padding: 4px 14px; color: var(--soft); margin: 0 6px 8px 0; }

/* ============================================================
   v1.1 修订（对标 6 条落地）
   AQuest 压暗+渐变 / Baxter 70-30 拼贴 / P-F Contract 案例故事
   Molteni&C 极简 / fade-up + scale 呼吸（渐进增强，无 JS 全可见）
   ============================================================ */

/* A · 首屏图片压暗 + 底部加深渐变（AQuest "Take Your Time"）
   v1.3 统一调色：全站图片走同一套 filter（brightness .82 / saturate .80 / contrast 1.10）
   压暗层用「乘算」叠加，不改变调色基准：.82×.5=.41、.82×.68=.56 */
.slot img { filter: var(--img-filter); }
.hero .slot img, .subhero .slot img { filter: brightness(.41) saturate(.80) contrast(1.10); }
.final-cta .slot img { filter: brightness(.56) saturate(.80) contrast(1.10); }
.hero::after, .subhero::after {
  content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 46%;
  background: linear-gradient(180deg, transparent, rgba(13, 11, 8, .82));
  z-index: 1; pointer-events: none;
}
/* 文字区径向压暗：保证标题/副文不论压在照片任何亮部都保持可读（2026-10-21 修） */
.hero::before, .subhero::before {
  content: ''; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: radial-gradient(ellipse 78% 58% at 50% 52%,
              rgba(13, 11, 8, .55) 0%, rgba(13, 11, 8, .34) 55%, rgba(13, 11, 8, 0) 100%);
}
.hero h1, .hero .hero-sub, .subhero h1, .subhero .lede,
.final-cta h2, .final-cta p { text-shadow: 0 2px 20px rgba(0, 0, 0, .6); }

/* B · 案例拼贴：1 主图 70% + 2 竖图 30% 错位（Baxter 编辑感） */
.collage { display: grid; grid-template-columns: 2.35fr 1fr; gap: clamp(14px, 2.4vw, 26px); align-items: start; }
.collage-sub { display: grid; gap: clamp(14px, 2.4vw, 26px); }
.collage-sub .slot:last-child { margin-top: clamp(22px, 4vw, 52px); }  /* 错位下移 */
.collage-sub .slot:first-child { margin-top: 0; }
@media (max-width: 820px) { .collage { grid-template-columns: 1fr; } .collage-sub { grid-template-columns: 1fr 1fr; } .collage-sub .slot:last-child { margin-top: clamp(22px, 4vw, 52px); } }
@media (max-width: 540px) { .collage-sub { grid-template-columns: 1fr; } .collage-sub .slot:last-child { margin-top: 0; } }

/* C · 案例项目元信息（Poltrona Frau Contract：项目名/地点/年份/角色/难点） */
.case-meta { display: grid; gap: 3px; margin: 0 0 clamp(22px, 3vw, 34px); padding: 18px 22px; background: var(--surface); border: 1px solid var(--hairline); border-radius: 10px; }
.case-meta b { font-family: var(--serif); font-size: 19px; font-weight: 600; color: var(--ink); }
.case-meta span { font-size: 12.5px; letter-spacing: .12em; text-transform: uppercase; color: var(--soft); }
.case-meta .case-diff { color: var(--deep-brass); font-weight: 500; text-transform: none; letter-spacing: .04em; border-top: 1px dashed var(--hairline); padding-top: 9px; margin-top: 6px; }

/* D · 案例三段式 01 Brief / 02 Process / 03 Outcome */
.case-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(16px, 2.6vw, 28px); margin-top: clamp(24px, 4vw, 40px); }
.case-step { border-top: 1px solid var(--champagne); padding-top: 14px; }
.case-step b { display: block; font-family: var(--sans); font-size: 12px; letter-spacing: .22em; text-transform: uppercase; color: var(--deep-brass); margin-bottom: 8px; }
.case-step span { font-size: 13.5px; color: var(--soft); line-height: 1.75; }
@media (max-width: 820px) { .case-steps { grid-template-columns: 1fr; } }

/* E · 案例类型 tab（渐进增强：无 JS 时 tab 隐藏、全部章节直接展示）
   v1.3：选中态改为香槟金 1px 下划线（替代原黑底胶囊），更贴 M3 编辑感 */
.ptabs { display: none; gap: clamp(18px, 3vw, 34px); justify-content: center; margin-bottom: clamp(8px, 2vw, 18px); }
html.js .ptabs { display: flex; flex-wrap: wrap; }
.ptab {
  font-family: var(--sans); font-size: 12px; letter-spacing: .2em; text-transform: uppercase;
  background: transparent; color: var(--soft); border: 0; border-bottom: 1px solid transparent;
  border-radius: 0; padding: 8px 2px 9px; cursor: pointer; transition: color .25s, border-color .25s;
}
.ptab:hover { color: var(--deep-brass); border-bottom-color: rgba(201, 162, 107, .45); }
.ptab.active { color: var(--ink); border-bottom-color: var(--champagne); }
.ptab:focus-visible { outline: 1px solid var(--champagne); outline-offset: 4px; }
/* JS 模式下未激活章节隐藏（无 JS 时永远可见——内容可见性铁律） */
html.js .chapter[data-panel].hidden-panel { display: none; }
html.js .hairline.orphan { display: none; }

/* F · 滚动入场 fade-up + 图片 scale 呼吸（html.js 渐进增强；无 JS 全静态可见） */
html.js .io { opacity: 0; transform: translateY(26px); transition: opacity .7s ease-out, transform .7s ease-out; }
html.js .io.in { opacity: 1; transform: none; }
html.js .breathe .slot img, html.js .slot.breathe img { transform: scale(1.02); transition: transform 2.4s cubic-bezier(.22,.61,.36,1); }
html.js .breathe.in .slot img, html.js .slot.breathe.in img { transform: scale(1); }

/* ---------- 404 页面 ---------- */
.err-page { min-height: calc(100vh - 380px); display: flex; align-items: center; padding: clamp(70px, 12vw, 140px) 0; }
.err-inner { text-align: center; }
.err-code {
  font-family: var(--serif); font-size: clamp(72px, 14vw, 148px); line-height: 1;
  color: transparent; -webkit-text-stroke: 1px var(--champagne); opacity: .75;
  letter-spacing: .04em;
}
.err-page h1 {
  font-family: var(--serif); font-weight: 500; font-style: italic;
  font-size: clamp(26px, 4.2vw, 40px); line-height: 1.25; color: var(--ink);
  margin: 22px 0 16px;
}
.err-lede { max-width: 560px; margin: 0 auto 30px; color: var(--soft); font-size: 15.5px; line-height: 1.85; }
.err-links { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; }
.err-line { border-color: rgba(33, 28, 20, .32); color: var(--ink); }
.err-line:hover { border-color: var(--deep-brass); color: var(--deep-brass); }
.err-hint { margin-top: 28px; font-size: 13px; color: var(--soft); }
.err-hint a { color: var(--deep-brass); text-decoration: none; border-bottom: 1px solid var(--hairline); }
.err-hint a:hover { border-color: var(--deep-brass); }

/* ============================================================
   v1.5 · 产品册 Catalogue（A/B 双方案并行，2026-10-22）
   A = 大图氛围网格（Minotti/Baxter）· B = 分类 Pill + 产品卡片
   两方案共用 .slot 槽位与 --img-filter 统一调色
   ============================================================ */

/* ---------- 导航：5 项，Catalogue 直连（A/B 下拉已于 v1.5 定稿时移除） ---------- */


/* ---------- 产品占位框（产品照未到位：纯灰底 + 一句说明） ---------- */
.slot-prod { background: #DAD2C2; border: 0; }
.slot-prod::before {
  content: 'Product photography in progress';
  font-family: var(--sans); font-size: 10.5px; letter-spacing: .2em;
  text-transform: uppercase; color: #7E6F52; font-weight: 500;
  text-align: center; padding: 0 14px; line-height: 1.7;
}
.slot-prod::after { font-size: 9.5px; color: #98886A; opacity: .8; }
html[lang='zh'] .slot-prod::before { content: '产品实拍照待补' ; letter-spacing: .16em; }

/* ---------- 方案 A：大图氛围网格 ---------- */
.catA-hero-line { margin-top: 26px; }
.catA-sec { padding: clamp(44px, 7vw, 76px) 0; }
.catA-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.catA-item {
  position: relative; display: block; text-decoration: none; color: var(--ivory);
  overflow: hidden; background: var(--black);
}
.catA-item .slot { position: absolute; inset: 0; width: 100%; height: 100%; aspect-ratio: auto; }
.catA-item::before { content: ''; display: block; padding-top: 66.6667%; }  /* 3:2 占位，无 JS 也撑住版式 */
.catA-item .slot img { transition: filter .5s ease, transform .8s ease; }
.catA-item:hover .slot img { filter: brightness(.96) saturate(.9) contrast(1.08); transform: scale(1.025); }
.catA-cap {
  position: absolute; left: 0; right: 0; bottom: 0; z-index: 3;
  padding: 44px 22px 20px; text-align: left;
  background: linear-gradient(180deg, rgba(13,11,8,0) 0%, rgba(13,11,8,.42) 46%, rgba(13,11,8,.86) 100%);
}
.catA-num {
  display: block; font-family: var(--sans); font-size: 10.5px; letter-spacing: .34em;
  color: rgba(201, 162, 107, .9); margin-bottom: 8px;
}
.catA-cap h3 {
  font-family: var(--serif); font-weight: 500; font-size: clamp(19px, 2.3vw, 27px);
  line-height: 1.2; color: var(--ivory); letter-spacing: .01em;
}
.catA-sub {
  display: block; margin-top: 6px; font-size: 11.5px; letter-spacing: .12em;
  color: rgba(242, 236, 223, .66); text-transform: uppercase;
}
.catA-go {
  display: inline-block; margin-top: 12px; font-size: 11px; letter-spacing: .26em;
  text-transform: uppercase; color: var(--champagne);
  opacity: 0; transform: translateY(6px);
  transition: opacity .34s ease, transform .34s ease;
}
.catA-item:hover .catA-go, .catA-item:focus-visible .catA-go { opacity: 1; transform: none; }
/* 触屏无 hover：直接常显，否则等于没有可见操作提示 */
@media (hover: none) { .catA-go { opacity: 1; transform: none; } }
@media (max-width: 760px) {
  .catA-grid { gap: 10px; }
  .catA-cap { padding: 34px 14px 14px; }
  .catA-sub { display: none; }
}

/* A 方案：分类内的产品大图网格（无卡片、无边框、纯图说话） */
.catA-grid-prod .catA-item::before { padding-top: 66.6667%; }
.catA-grid-prod .catA-cap h3 { font-size: clamp(15px, 1.5vw, 19px); }
.catA-grid-prod .catA-num { display: none; }
.catA-grid-prod .catA-sub { display: none; }
.catA-grid-prod .catA-go { margin-top: 8px; font-size: 10px; }

/* 分类章节头（沿用 M3 编号头，A/B 共用） */
.cat-head-note { margin-left: auto; font-size: 11.5px; letter-spacing: .26em; text-transform: uppercase; color: var(--soft); white-space: nowrap; }
@media (max-width: 640px) { .cat-head-note { display: none; } }

/* ---------- 方案 B：分类 Pill + 产品卡片 ---------- */
.catB-bar { padding: clamp(26px, 4vw, 40px) 0 clamp(20px, 3vw, 30px); }
.catB-pills {
  display: flex; flex-wrap: wrap; gap: 10px; justify-content: center;
  list-style: none; margin: 0; padding: 0;
}
.pill {
  font-family: var(--sans); font-size: 11.5px; letter-spacing: .18em; text-transform: uppercase;
  padding: 10px 20px; cursor: pointer; background: transparent;
  color: var(--deep-brass); border: 1px solid var(--champagne); border-radius: 999px;
  transition: background .26s, color .26s, border-color .26s;
}
.pill:hover { background: rgba(201, 162, 107, .12); }
/* 选中态：香槟金实底——文字用近黑（#C9A26B 上白字仅 2.2:1，不过 AA） */
.pill.is-on { background: var(--champagne); color: #14100A; border-color: var(--champagne); font-weight: 500; }
.pill:focus-visible { outline: 2px solid var(--deep-brass); outline-offset: 2px; }
/* 双按钮在手机上竖排等宽（否则中英文按钮宽度不等，看起来参差） */
@media (max-width: 620px) {
  .btn-row { flex-direction: column; align-items: stretch; gap: 10px; }
  .btn-row .btn { text-align: center; }
}

/* 3 列时最后一行只剩一张卡 → 放中间列（由 JS 在筛选后打 .is-solo，DOM 顺序不再参与判断） */
@media (min-width: 981px) {
  .catB-grid > .catB-card.is-solo { grid-column: 2 / span 1; }
}

/* 6 颗在窄屏排不下 → 折成两行（不做横滑）；选中的那颗用 order 提到最前，保证落在第一行 */
@media (max-width: 620px) {
  .catB-pills { flex-wrap: wrap; justify-content: center; gap: 5px; }
  .pill { padding: 7px 5px; font-size: 9.5px; letter-spacing: .06em; }
  .pill.is-on { order: -1; }
}

.catB-sec { padding: 0 0 clamp(50px, 8vw, 84px); }
.catB-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
@media (max-width: 980px) { .catB-grid { grid-template-columns: repeat(2, 1fr); gap: 20px; } }
@media (max-width: 620px) { .catB-grid { grid-template-columns: 1fr; gap: 16px; } }

.catB-card {
  display: flex; flex-direction: column; background: var(--surface);
  border: 1px solid #E8E4DC; border-radius: 4px; overflow: hidden;
  transition: box-shadow .3s, border-color .3s;
}
.catB-card:hover { border-color: #DCD2BE; box-shadow: 0 16px 36px rgba(42, 37, 28, .09); }
.catB-card .slot { aspect-ratio: 1 / 1; border-radius: 0; }
.catB-card .slot img { transition: transform .6s ease, filter .5s ease; }
.catB-card:hover .slot img { transform: scale(1.03); filter: brightness(.9) saturate(.86) contrast(1.09); }
.catB-body { padding: 18px 20px 22px; display: flex; flex-direction: column; flex: 1; }
.catB-body h3 {
  font-family: var(--serif); font-size: 18px; font-weight: 600;
  color: #1A1611; letter-spacing: .01em; margin-bottom: 6px; line-height: 1.3;
}
.catB-body p { font-size: 14px; line-height: 1.62; color: #6B6560; margin-bottom: 16px; }
.catB-cta {
  align-self: flex-start; margin-top: auto; text-decoration: none;
  font-family: var(--sans); font-size: 10.5px; letter-spacing: .22em; text-transform: uppercase;
  padding: 9px 18px; border: 1px solid var(--champagne); color: var(--deep-brass);
  background: transparent; transition: background .26s, color .26s, border-color .26s;
}
/* hover 实底金：文字用近黑保证对比度（白字在 #C9A26B 上仅 2.2:1） */
.catB-cta:hover { background: var(--champagne); color: #14100A; border-color: var(--champagne); }
.catB-card.is-off { display: none; }
.catB-card.pop { animation: cardIn .34s both ease-out; }
@keyframes cardIn { from { opacity: 0; transform: translateY(10px) scale(.995); } to { opacity: 1; transform: none; } }
.catB-empty { text-align: center; color: var(--soft); font-size: 14px; padding: 40px 0; }

/* A/B 互切提示条（仅对比期存在，定稿后删除） */
.ab-switch {
  display: inline-flex; align-items: center; gap: 10px; margin-top: 30px;
  font-size: 10.5px; letter-spacing: .26em; text-transform: uppercase;
  color: rgba(242, 236, 223, .55); position: relative; z-index: 3;
}
.ab-switch a { color: var(--champagne); text-decoration: none; border-bottom: 1px solid rgba(201, 162, 107, .4); padding-bottom: 2px; }
.ab-switch a:hover { border-bottom-color: var(--champagne); }

/* A 方案：奇数个产品时最后一件通栏（避免 2 列网格末尾留下空档） */
.catA-item.is-wide { grid-column: 1 / -1; }
.catA-item.is-wide::before { padding-top: 38%; }
@media (max-width: 620px) {
  .catA-grid { grid-template-columns: 1fr; }
  .catA-item.is-wide::before { padding-top: 66.6667%; }
}
/* 导航在窄屏的密度收敛（5 项后横向更吃紧） */
@media (max-width: 480px) {
  .nav { padding: 14px 16px; }
  .nav.scrolled { padding: 10px 16px; }
  .nav-logo { font-size: 18px; letter-spacing: .12em; }
  .nav-links { gap: 12px; }
  .nav-links a { font-size: 10.5px; letter-spacing: .12em; }
}

/* 产品册首屏：比常规子页更高（"全屏暗调氛围图"要求），竖构图源图也能吃到合适裁切 */
.subhero.cat-hero {
  min-height: min(80vh, 720px);
  display: flex; align-items: center; justify-content: center;
  padding: 150px 20px 84px;
}
.subhero.cat-hero .subhero-inner { width: 100%; }

/* 产品占位框的副标改为槽位名（与全站占位框一致，方便对照补拍；尺寸/优先级在报告里） */
.slot-prod::after { content: attr(data-slot); font-family: Consolas, 'Courier New', monospace; letter-spacing: .1em; }
/* A 方案：缺图格不加压暗渐变，否则米灰占位框上会糊成一片 */
.catA-item.is-gap .slot { background: #DAD2C2; }
.catA-item.is-gap .catA-cap { background: none; padding-bottom: 18px; }
.catA-item.is-gap .catA-cap h3 { color: #4E4330; }
.catA-item.is-gap .catA-go { color: var(--deep-brass); opacity: 1; transform: none; }
.catA-item .slot-prod::after { display: none; }

/* ============================================================
   v2.0 · Catalogue 伪三级（2026-10-24）
   ① 分类筛选后显示品类标题 ② 无实拍产品的命名占位框 ③ 产品灯箱
   ============================================================ */

/* ---------- ① 品类标题（点 pill 后出现） ---------- */
.catB-cathead {
  display: flex; align-items: baseline; justify-content: space-between; gap: 16px;
  margin: 0 0 clamp(18px, 2.6vw, 26px); padding-bottom: 14px;
  border-bottom: 1px solid var(--hairline);
}
.catB-cathead[hidden] { display: none; }
.catB-cathead h2 {
  font-family: var(--serif); font-weight: 600;
  font-size: clamp(22px, 2.8vw, 30px); line-height: 1.2; color: #1A1611;
}
.catB-cathead .cat-head-note { color: var(--soft); font-size: 11.5px; letter-spacing: .22em; text-transform: uppercase; }

/* 卡片可点开灯箱：给光标与键盘焦点 */
.catB-card { cursor: pointer; }
.catB-card:focus-visible { outline: 2px solid var(--deep-brass); outline-offset: 3px; }

/* ---------- ② 无实拍：命名占位框（灰底 + 产品名） ---------- */
.slot-prod.ph {
  background:
    repeating-linear-gradient(45deg, rgba(160, 146, 116, .10) 0 8px, rgba(160, 146, 116, 0) 8px 16px),
    #E7DFCF;
  border: 1.5px dashed #C3B79A;
}
.slot-prod.ph::before {
  content: attr(data-name);
  font-family: var(--serif); font-size: clamp(15px, 1.6vw, 18px); font-weight: 600;
  letter-spacing: .01em; text-transform: none; color: #5C5142;
  padding: 0 16px; line-height: 1.35; text-align: center;
}
.slot-prod.ph::after { content: none; }
.slot-prod.ph .ph-note {
  position: absolute; left: 0; right: 0; bottom: 13px; text-align: center;
  font-family: var(--sans); font-size: 9.5px; letter-spacing: .2em; text-transform: uppercase;
  color: #8A7A5E; opacity: .85;
}
/* A 归档页的占位框不显示角标（深色遮罩下看不清） */
.catA-item .slot-prod.ph .ph-note { display: none; }

/* ---------- ③ 产品灯箱 ---------- */
html.pd-open, html.pd-open body { overflow: hidden; }

.pd {
  position: fixed; inset: 0; z-index: 300;
  display: flex; align-items: center; justify-content: center;
  padding: clamp(10px, 3vw, 44px);
}
.pd[hidden] { display: none; }
.pd-backdrop {
  position: absolute; inset: 0;
  background: rgba(9, 7, 5, .84);
  -webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px);
  animation: pdFade .28s both ease-out;
}
@keyframes pdFade { from { opacity: 0; } to { opacity: 1; } }

.pd-panel {
  position: relative; display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(330px, 1fr);
  grid-template-rows: minmax(0, 1fr);
  width: min(1180px, 96vw); height: min(86vh, 830px); max-height: min(86vh, 830px);
  background: var(--paper); color: var(--ink);
  box-shadow: 0 40px 100px rgba(0, 0, 0, .5);
  animation: pdIn .34s both cubic-bezier(.22, .61, .36, 1);
  overflow: hidden;
}
@keyframes pdIn { from { opacity: 0; transform: translateY(14px) scale(.99); } to { opacity: 1; transform: none; } }

.pd-close {
  position: absolute; top: 12px; right: 12px; z-index: 6;
  width: 40px; height: 40px; border: 0; border-radius: 999px; cursor: pointer;
  background: rgba(13, 11, 8, .55); color: var(--ivory);
  font-size: 24px; line-height: 1; display: grid; place-items: center;
  transition: background .24s, color .24s;
}
.pd-close:hover { background: var(--champagne); color: #14100A; }
.pd-close:focus-visible { outline: 2px solid var(--champagne); outline-offset: 2px; }

/* 左：轮播 */
.pd-media { position: relative; background: #14110D; overflow: hidden; min-height: 0; }
.pd-track { display: flex; height: 100%; transition: transform .46s cubic-bezier(.22, .61, .36, 1); will-change: transform; }
.pd-slide { flex: 0 0 100%; position: relative; margin: 0; overflow: hidden; }
.pd-slide img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pd-slide figcaption {
  position: absolute; left: 0; bottom: 0; z-index: 3;
  padding: 34px 18px 14px; width: 100%;
  background: linear-gradient(180deg, rgba(13, 11, 8, 0), rgba(13, 11, 8, .74));
  color: rgba(242, 236, 223, .9);
  font-family: var(--sans); font-size: 10px; letter-spacing: .26em; text-transform: uppercase;
}
.pd-slide-ph {
  display: grid; place-items: center; gap: 10px;
  background:
    repeating-linear-gradient(45deg, rgba(160, 146, 116, .08) 0 10px, rgba(160, 146, 116, 0) 10px 20px),
    #2B2620;
}
.pd-slide-ph .pd-ph-name { font-family: var(--serif); font-size: clamp(20px, 2.4vw, 28px); color: rgba(242, 236, 223, .82); text-align: center; padding: 0 20px; }
.pd-slide-ph .pd-ph-note { font-family: var(--sans); font-size: 10px; letter-spacing: .28em; text-transform: uppercase; color: rgba(201, 162, 107, .75); }

.pd-arrow {
  position: absolute; top: 50%; z-index: 5; transform: translateY(-50%);
  width: 42px; height: 42px; border-radius: 999px; cursor: pointer;
  background: rgba(13, 11, 8, .5); color: var(--ivory);
  border: 1px solid rgba(242, 236, 223, .28);
  font-size: 22px; line-height: 1; display: grid; place-items: center;
  transition: background .24s, color .24s, border-color .24s, opacity .24s;
}
.pd-arrow:hover { background: var(--champagne); color: #14100A; border-color: var(--champagne); }
.pd-prev { left: 14px; }
.pd-next { right: 14px; }
.pd-arrow:disabled { opacity: .28; cursor: default; }
.pd-arrow:disabled:hover { background: rgba(13, 11, 8, .5); color: var(--ivory); border-color: rgba(242, 236, 223, .28); }

.pd-dots { position: absolute; left: 0; right: 0; bottom: 44px; z-index: 4; display: flex; gap: 8px; justify-content: center; }
.pd-dot {
  width: 7px; height: 7px; padding: 0; border-radius: 999px; cursor: pointer;
  border: 1px solid rgba(242, 236, 223, .6); background: transparent;
  transition: background .24s, border-color .24s;
}
.pd-dot.is-on { background: var(--champagne); border-color: var(--champagne); }
.pd-dot:focus-visible { outline: 2px solid var(--champagne); outline-offset: 3px; }

.pd-counter {
  position: absolute; top: 14px; left: 16px; z-index: 4;
  font-family: var(--sans); font-size: 10.5px; letter-spacing: .22em;
  color: rgba(242, 236, 223, .72);
}

/* 右：信息 */
.pd-info {
  padding: clamp(24px, 3.2vw, 42px); overflow-y: auto; min-height: 0;
  display: flex; flex-direction: column; background: var(--paper);
}
.pd-cat { font-family: var(--sans); font-size: 10.5px; letter-spacing: .3em; text-transform: uppercase; color: var(--deep-brass); margin-bottom: 12px; }
.pd-name { font-family: var(--serif); font-weight: 600; font-size: clamp(26px, 3.4vw, 38px); line-height: 1.16; color: #14110D; margin-bottom: 12px; }
.pd-desc { font-size: 14.5px; line-height: 1.7; color: var(--soft); margin-bottom: 22px; }
.pd-spec { width: 100%; border-collapse: collapse; margin-bottom: 24px; }
.pd-spec tr { border-top: 1px solid var(--hairline); }
.pd-spec tr:last-child { border-bottom: 1px solid var(--hairline); }
.pd-spec th {
  text-align: left; vertical-align: top; white-space: nowrap;
  padding: 11px 14px 11px 0;
  font-family: var(--sans); font-weight: 400; font-size: 10.5px;
  letter-spacing: .16em; text-transform: uppercase; color: #8A7F6B;
}
.pd-spec td { padding: 11px 0; font-size: 13.5px; line-height: 1.55; color: #2A241C; }
.pd-quote { align-self: flex-start; margin-top: 2px; }
.pd-pager {
  display: flex; justify-content: space-between; gap: 12px;
  margin-top: 22px; padding-top: 16px; border-top: 1px solid var(--hairline);
}
.pd-pager button {
  border: 0; background: transparent; cursor: pointer; padding: 4px 0;
  font-family: var(--sans); font-size: 10.5px; letter-spacing: .18em; text-transform: uppercase;
  color: var(--deep-brass); transition: opacity .2s, color .2s;
}
.pd-pager button:hover { color: #14110D; }
.pd-pager button:disabled { opacity: .3; cursor: default; }
.pd-pager button:focus-visible { outline: 2px solid var(--deep-brass); outline-offset: 3px; }

/* ---------- 移动端：全屏，图在上 58%，信息在下 ---------- */
@media (max-width: 860px) {
  .pd { padding: 0; }
  .pd-panel {
    grid-template-columns: 1fr; grid-template-rows: 58vh minmax(0, 1fr);
    width: 100vw; height: 100vh; max-height: none;
  }
  .pd-media { min-height: 0; }
  .pd-info { padding: 20px 20px 32px; }
  .pd-close { top: 10px; right: 10px; width: 36px; height: 36px; font-size: 21px; }
  .pd-arrow { width: 36px; height: 36px; font-size: 19px; }
  .pd-prev { left: 8px; }
  .pd-next { right: 8px; }
  .pd-dots { bottom: 40px; }
  .pd-desc { margin-bottom: 18px; }
  .pd-spec { margin-bottom: 18px; }
  .pd-quote { align-self: stretch; text-align: center; }
  .catB-cathead { flex-wrap: wrap; gap: 4px; }
}

@media (prefers-reduced-motion: reduce) {
  .pd-backdrop, .pd-panel { animation: none; }
  .pd-track { transition: none; }
}

/* ============================================================
   v2.1 · 移动端汉堡菜单（2026-10-24）
   ≤820px：桌面 5 项收进右侧抽屉。
   纯 CSS（checkbox + label）即可开合，JS 只补 Esc / 滚动锁 / aria / 宽度回桌面自动收起。
   ============================================================ */

/* 视觉隐藏但可读（汉堡按钮的可读名称） */
.sr-only {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

/* 开关：保留在文档里（不 display:none，避免部分浏览器 label 点击失效） */
.nav-toggle {
  position: absolute; width: 1px; height: 1px; margin: 0;
  opacity: 0; pointer-events: none; clip: rect(0 0 0 0);
}

/* 桌面端不显示汉堡 */
.nav-burger { display: none; }

/* ---------- 遮罩 ---------- */
.nav-scrim {
  position: fixed; inset: 0; z-index: 1;
  background: rgba(6, 5, 3, .68);
  opacity: 0; visibility: hidden;
  transition: opacity .3s ease-out, visibility .3s ease-out;
  -webkit-backdrop-filter: blur(1.5px); backdrop-filter: blur(1.5px);
  cursor: pointer;
}

/* ---------- 抽屉 ---------- */
.nav-drawer {
  position: fixed; top: 0; right: 0; bottom: 0; z-index: 2;
  width: min(84vw, 420px);
  padding: clamp(96px, 20vh, 168px) 30px 44px;
  overflow-y: auto; -webkit-overflow-scrolling: touch;
  background:
    radial-gradient(120% 68% at 100% 0%, rgba(201, 162, 107, .15), rgba(201, 162, 107, 0) 62%),
    repeating-linear-gradient(90deg, rgba(242, 236, 223, .026) 0 1px, rgba(242, 236, 223, 0) 1px 4px),
    linear-gradient(180deg, #13110C 0%, #0D0B08 56%, #0A0906 100%);
  box-shadow: -26px 0 70px rgba(0, 0, 0, .58);
  transform: translateX(101%);
  visibility: hidden;
  transition: transform .3s ease-out, visibility .3s ease-out;
}
/* 抽屉顶部一条香槟金发丝线，呼应站内分隔语言 */
.nav-drawer::before {
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: 1px;
  background: linear-gradient(90deg, rgba(201, 162, 107, 0), rgba(201, 162, 107, .55) 30%, rgba(201, 162, 107, .12));
}

.nav-drawer a {
  display: block; padding: 13px 0;
  font-family: var(--serif); font-size: clamp(20px, 5.6vw, 24px); font-weight: 500;
  letter-spacing: .1em; text-transform: uppercase;
  color: var(--ivory); text-decoration: none;
  opacity: 0; transform: translateX(16px);
  transition: color .22s, opacity .3s ease-out, transform .3s ease-out;
}
/* 中文菜单：字面更方，字重与字距单独收一点，避免比英文显小显挤 */
html[lang="zh"] .nav-drawer a { font-size: clamp(19px, 5vw, 22px); letter-spacing: .16em; font-weight: 500; }
html[lang="zh"] .nav-drawer a.lang { font-size: clamp(14px, 3.6vw, 16px); letter-spacing: .2em; }
.nav-drawer a:hover { color: var(--champagne); }
.nav-drawer a[aria-current='page'] { color: var(--champagne); }
.nav-drawer a.lang { color: var(--champagne); letter-spacing: .18em; font-size: clamp(15px, 4vw, 17px); }
.nav-drawer a:focus-visible { outline: 2px solid var(--champagne); outline-offset: 4px; }

.nav-drawer-rule {
  display: block; height: 1px; margin: 24px 0 18px;
  background: linear-gradient(90deg, rgba(201, 162, 107, .85), rgba(201, 162, 107, .10));
}

/* ---------- 汉堡图标 ---------- */
.nav-burger { position: relative; width: 44px; height: 44px; z-index: 3; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.nav-burger i {
  position: absolute; left: 50%; top: 50%; width: 23px; height: 2px; margin-left: -11.5px;
  background: var(--champagne); border-radius: 2px;
  transition: transform .3s ease-out, opacity .2s ease-out;
}
.nav-burger i:nth-child(1) { transform: translateY(-8px); }
.nav-burger i:nth-child(2) { transform: translateY(0); }
.nav-burger i:nth-child(3) { transform: translateY(8px); }

/* ---------- 展开状态 ---------- */
.nav-toggle:checked ~ .nav-scrim { opacity: 1; visibility: visible; }
.nav-toggle:checked ~ .nav-drawer { transform: translateX(0); visibility: visible; }
.nav-toggle:checked ~ .nav-drawer a { opacity: 1; transform: none; }
.nav-toggle:checked ~ .nav-drawer a:nth-child(1) { transition-delay: .04s; }
.nav-toggle:checked ~ .nav-drawer a:nth-child(2) { transition-delay: .08s; }
.nav-toggle:checked ~ .nav-drawer a:nth-child(3) { transition-delay: .12s; }
.nav-toggle:checked ~ .nav-drawer a:nth-child(4) { transition-delay: .16s; }
.nav-toggle:checked ~ .nav-drawer a:nth-child(5) { transition-delay: .20s; }
.nav-toggle:checked ~ .nav-drawer a:nth-child(6) { transition-delay: .24s; }
.nav-toggle:checked ~ .nav-drawer a:nth-child(7) { transition-delay: .28s; }
.nav-toggle:checked ~ .nav-burger i:nth-child(1) { transform: rotate(45deg); }
.nav-toggle:checked ~ .nav-burger i:nth-child(2) { opacity: 0; }
.nav-toggle:checked ~ .nav-burger i:nth-child(3) { transform: rotate(-45deg); }

/* 打开时锁住页面滚动（JS 加类；无 JS 时仅不锁，不影响可用） */
html.nav-open, html.nav-open body { overflow: hidden; }

/* Logo 与汉堡保持在遮罩之上 */
.nav-logo { position: relative; z-index: 3; }

/* ---------- 断点：与既有 .opt 隐藏点一致（820px）---------- */
@media (max-width: 820px) {
  .nav-links { display: none; }
  .nav-burger { display: block; margin-right: -8px; }
}

@media (prefers-reduced-motion: reduce) {
  .nav-scrim, .nav-drawer, .nav-drawer a, .nav-burger i { transition: none; }
}