/* ============================================================
   JUE 珏 — 木质道馆独立排版 (hall-wood.css)
   年轮 · 岁月 —— 同心圆年轮贯穿全页，暖木色（米黄/红木/深棕）
   仅在 data-theme="wood" 时由 header 引入；完全独立于玉的布局骨架。
   ============================================================ */

/* ================= Hero · 杉林晚照 + 年轮背景 ================= */
.hw-hero {
  position: relative;
  min-height: 100svh; min-height: 100vh;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  text-align: center; overflow: hidden;
  padding: calc(var(--nav-h) + 3rem) 1.5rem 4rem;
}
/* 背景视频/图片：cover 铺满整个首屏 */
.hw-hero-video {
  position: absolute; inset: 0; z-index: 0;
  width: 100%; height: 100%; object-fit: cover;
  display: block;
  pointer-events: none;
}
/* 极浅遮罩：只微微压暗保证文字可读 */
.hw-hero::after {
  content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background:
    linear-gradient(180deg, rgba(20,14,6,.3) 0%, rgba(20,14,6,.08) 40%, rgba(16,11,5,.44) 100%),
    radial-gradient(ellipse at 50% 45%, rgba(20,14,6,.1), transparent 70%);
}
/* 装饰层隐藏：不再盖视频 */
.hw-hero .hw-ring-bg, .hw-hero .hw-forest { opacity: 0; }
.hw-hero .hw-hero-inner { z-index: 2; }
.hw-hero .hall-picker { z-index: 3; }
.hw-hero .hw-scroll { z-index: 3; }
.hw-hero .hw-title { text-shadow: 0 2px 18px rgba(0,0,0,.6); }
.hw-hero .hw-lead { text-shadow: 0 1px 12px rgba(0,0,0,.55); }
/* 巨型年轮（同心圆环，岁月的签名） */
.hw-ring-bg {
  position: absolute; left: 50%; top: 50%; z-index: 0;
  width: 120vmax; height: 120vmax; transform: translate(-50%, -50%);
  opacity: .55; pointer-events: none;
  background:
    radial-gradient(circle at 50% 50%,
      transparent 0 9%,
      rgba(216,168,92,.28) 9% 10%,
      transparent 10% 20%,
      rgba(216,168,92,.2) 20% 21%,
      transparent 21% 30%,
      rgba(216,168,92,.16) 30% 31%,
      transparent 31% 40%,
      rgba(216,168,92,.12) 40% 41%,
      transparent 41% 50%,
      rgba(216,168,92,.09) 50% 51%,
      transparent 51% 60%,
      rgba(216,168,92,.07) 60% 61%,
      transparent 61% 70%,
      rgba(216,168,92,.05) 70% 71%,
      transparent 71% 100%);
}
.hw-forest {
  position: absolute; inset: 0; z-index: 0; opacity: .9;
  background:
    radial-gradient(60% 44% at 50% 20%, rgba(216,168,92,.20), transparent 62%),
    radial-gradient(70% 55% at 78% 88%, rgba(96,58,28,.55), transparent 66%),
    radial-gradient(60% 50% at 14% 84%, rgba(122,74,36,.4), transparent 62%),
    linear-gradient(180deg, #3a2c18 0%, #241a0e 42%, #171109 78%, #120d07 100%);
}
/* 杉林剪影（纯 CSS 三角杉，重复平铺） */
.hw-forest::before {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 62%;
  background:
    linear-gradient(115deg, transparent 55%, #0e0a05 56%) 0 100% / 9% 34% no-repeat,
    linear-gradient(115deg, transparent 55%, #0e0a05 56%) 6% 100% / 7% 30% no-repeat,
    linear-gradient(115deg, transparent 55%, #100b06 56%) 12% 100% / 10% 38% no-repeat,
    linear-gradient(115deg, transparent 55%, #0e0a05 56%) 20% 100% / 8% 32% no-repeat,
    linear-gradient(115deg, transparent 55%, #120d07 56%) 27% 100% / 11% 40% no-repeat,
    linear-gradient(115deg, transparent 55%, #0e0a05 56%) 36% 100% / 9% 30% no-repeat,
    linear-gradient(115deg, transparent 55%, #100b06 56%) 44% 100% / 12% 36% no-repeat,
    linear-gradient(115deg, transparent 55%, #0e0a05 56%) 54% 100% / 8% 34% no-repeat,
    linear-gradient(115deg, transparent 55%, #120d07 56%) 62% 100% / 10% 40% no-repeat,
    linear-gradient(115deg, transparent 55%, #0e0a05 56%) 71% 100% / 9% 30% no-repeat,
    linear-gradient(115deg, transparent 55%, #100b06 56%) 79% 100% / 12% 38% no-repeat,
    linear-gradient(115deg, transparent 55%, #0e0a05 56%) 90% 100% / 9% 32% no-repeat,
    linear-gradient(115deg, transparent 55%, #120d07 56%) 97% 100% / 8% 36% no-repeat;
  opacity: .8;
}
.hw-forest::after {
  content: ""; position: absolute; top: 16%; left: 50%; width: 46%; height: 22%;
  transform: translateX(-50%);
  background: radial-gradient(50% 100% at 50% 100%, rgba(230,196,120,.35), transparent 70%);
  filter: blur(6px);
}
.hw-hero-inner { position: relative; z-index: 1; max-width: 44rem; }
.hw-char {
  font-family: var(--serif); font-size: clamp(4.5rem, 12vw, 9rem); line-height: 1;
  color: #e0b877;
  text-shadow: 0 0 40px rgba(216,168,92,.45), 0 0 80px rgba(216,168,92,.2);
  margin-bottom: .6rem;
}
.hw-title {
  font-family: var(--zh); font-size: clamp(1.6rem, 3.4vw, 2.6rem);
  letter-spacing: .34em; color: var(--ink-text); margin: 1rem 0 .4rem;
}
.hw-lead { color: var(--muted); font-size: 1.06rem; line-height: 1.9; margin: .8rem auto 2rem; max-width: 34rem; }
.hw-cta { margin-top: .6rem; }
.hw-scroll {
  position: absolute; bottom: 1.4rem; left: 50%; transform: translateX(-50%);
  color: var(--muted-2); font-size: var(--fs-micro); letter-spacing: .3em;
}
.hw-hero .hall-picker { position: relative; z-index: 2; margin-top: 2.6rem; padding-top: 0; }

/* ================= 通用分区 ================= */
.hw-section { padding: var(--space-6) 0; }
.hw-h2 { font-family: var(--serif); font-size: clamp(1.9rem, 4vw, 2.8rem); color: var(--ink-text); line-height: 1.15; }
.hw-titleEn { font-family: var(--serif); font-style: italic; color: var(--accent-soft); font-size: 1.2rem; margin: .6rem 0 1rem; }

/* ================= 理念 · 年轮圆章 ================= */
.hw-split { display: grid; grid-template-columns: minmax(0, .7fr) minmax(0, 1.3fr); gap: 3rem; align-items: center; }
@media (max-width: 1080px) { .hw-split { grid-template-columns: 1fr; gap: 2rem; } }
.hw-ring-seal-wrap { display: flex; justify-content: center; }
.hw-ring-seal {
  position: relative; width: 17rem; height: 17rem; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background:
    radial-gradient(circle at 50% 50%,
      #3a2a16 0 16%,
      rgba(216,168,92,.22) 16% 18%,
      #2c2012 18% 30%,
      rgba(216,168,92,.16) 30% 32%,
      #241a0e 32% 44%,
      rgba(216,168,92,.12) 44% 46%,
      #1d150b 46% 100%);
  border: 1px solid rgba(216,168,92,.5);
  box-shadow: 0 0 50px rgba(216,168,92,.28), inset 0 0 40px rgba(216,168,92,.14);
}
.hw-ring-seal::before {
  content: ""; position: absolute; inset: 7%;
  border: 1px dashed rgba(216,168,92,.35); border-radius: 50%;
}
.hw-ring-seal-center {
  font-family: var(--serif); font-size: 6.5rem; line-height: 1; color: #e0b877;
  text-shadow: 0 0 34px rgba(216,168,92,.5);
}
.hw-split-body .lead { margin-top: 1rem; }

/* ================= 木材谱系 · 六木年轮盘 ================= */
.hw-disks { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.6rem; margin-top: 2.6rem; }
@media (max-width: 1080px) { .hw-disks { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .hw-disks { grid-template-columns: 1fr; } }
.hw-disk { text-align: center; padding: 2.2rem 1.4rem 1.9rem; border: 1px solid var(--line-soft); background: var(--bg); transition: transform .6s var(--ease-lux), border-color .6s var(--ease-lux), box-shadow .6s var(--ease-lux); }
.hw-disk:hover { transform: translateY(-6px); border-color: rgba(216,168,92,.5); box-shadow: 0 24px 50px -24px rgba(216,168,92,.35); }
/* 木的年轮横截面：中心深色髓心，向外一圈圈年轮 */
.hw-disk-ring {
  position: relative; width: 8.6rem; height: 8.6rem; margin: 0 auto 1.2rem;
  border-radius: 50%;
  background:
    radial-gradient(circle at 50% 50%,
      color-mix(in srgb, var(--wood) 82%, #f4e6cf 18%) 0 12%,
      var(--wood) 12% 18%,
      color-mix(in srgb, var(--wood) 70%, #e8d4b6 30%) 18% 25%,
      var(--wood) 25% 31%,
      color-mix(in srgb, var(--wood) 60%, #f0dfc2 40%) 31% 38%,
      var(--wood) 38% 45%,
      color-mix(in srgb, var(--wood) 78%, #e0c9a6 22%) 45% 52%,
      var(--wood) 52% 60%,
      color-mix(in srgb, var(--wood) 66%, #f4e6cf 34%) 60% 68%,
      var(--wood) 68% 76%,
      color-mix(in srgb, var(--wood) 82%, #e8d4b6 18%) 76% 100%);
  box-shadow: inset 0 0 0 2px rgba(216,168,92,.3), 0 10px 26px -12px rgba(0,0,0,.6);
}
.hw-disk-ring::before {
  content: ""; position: absolute; inset: 12%; border-radius: 50%;
  background: rgba(0,0,0,.16);
}
.hw-disk-char {
  position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
  font-family: var(--serif); font-size: 2.6rem; color: #f6ead6; z-index: 1;
  text-shadow: 0 1px 4px rgba(0,0,0,.6);
}
.hw-disk-name { font-family: var(--zh); font-size: 1.35rem; color: var(--ink-text); letter-spacing: .12em; margin-bottom: .3rem; }
.hw-disk-en { font-family: var(--serif); font-style: italic; color: var(--accent-soft); font-size: .92rem; margin-bottom: .8rem; }
.hw-disk-text { color: var(--muted); font-size: var(--fs-small); line-height: 1.85; }

/* ================= 纹理百科 · 木纹横带 ================= */
.hw-bands { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.4rem; margin-top: 2.6rem; }
@media (max-width: 1080px) { .hw-bands { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .hw-bands { grid-template-columns: 1fr; } }
.hw-band { border: 1px solid var(--line-soft); background: var(--bg); overflow: hidden; transition: border-color .5s var(--ease-lux), transform .5s var(--ease-lux); }
.hw-band:hover { border-color: rgba(216,168,92,.5); transform: translateY(-4px); }
/* 木纹横带：横向重复的深浅纹路 */
.hw-band-grain {
  height: 4.4rem; width: 100%;
  background:
    repeating-linear-gradient(92deg,
      rgba(216,168,92,.18) 0 6px,
      rgba(150,96,52,.22) 6px 10px,
      rgba(216,168,92,.12) 10px 16px,
      rgba(120,70,36,.2) 16px 21px,
      rgba(216,168,92,.16) 21px 27px,
      rgba(140,86,44,.18) 27px 31px);
}
.hw-band-body { padding: 1.3rem 1.4rem 1.5rem; }
.hw-band-zh { font-family: var(--zh); font-size: 1.25rem; color: var(--ink-text); letter-spacing: .1em; margin-right: .5rem; }
.hw-band-en { font-family: var(--serif); font-style: italic; color: var(--accent-soft); font-size: .9rem; }
.hw-band-text { color: var(--muted); font-size: var(--fs-small); line-height: 1.85; margin-top: .6rem; }

/* ================= 木艺四步 · 年轮四弧 ================= */
.hw-craft-ring {
  position: relative; display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.4rem;
  margin-top: 2.6rem; padding: 2.6rem 1rem;
}
@media (max-width: 560px) { .hw-craft-ring { grid-template-columns: 1fr; } }
.hw-craft-ring::before {
  content: ""; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
  width: min(30rem, 74vw); height: min(30rem, 74vw); border-radius: 50%;
  border: 1px dashed rgba(216,168,92,.22); pointer-events: none;
}
.hw-craft-ring::after {
  content: ""; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
  width: min(22rem, 56vw); height: min(22rem, 56vw); border-radius: 50%;
  border: 1px solid rgba(216,168,92,.14); pointer-events: none;
}
.hw-craft-arc { position: relative; z-index: 1; text-align: center; padding: 1.7rem 1.3rem; border: 1px solid var(--line-soft); background: var(--bg); }
.hw-craft-num { font-family: var(--zh); font-size: 1.4rem; color: var(--accent); }
.hw-craft-name { font-family: var(--zh); font-size: 1.15rem; color: var(--ink-text); letter-spacing: .14em; margin: .6rem 0; }
.hw-craft-name em { font-family: var(--serif); font-style: italic; color: var(--accent-soft); font-size: .8rem; letter-spacing: .05em; margin-left: .4rem; }
.hw-craft-text { color: var(--muted); font-size: var(--fs-small); line-height: 1.85; }
/* 中央"艺"字（年轮核心） */
.hw-craft-core {
  position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 2;
  display: flex; align-items: center; justify-content: center;
  width: 5.6rem; height: 5.6rem; border-radius: 50%;
  font-family: var(--serif); font-size: 2.4rem; color: #e0b877;
  background: #1d150b; border: 1px solid rgba(216,168,92,.5);
  box-shadow: 0 0 34px rgba(216,168,92,.4);
}
@media (max-width: 560px) { .hw-craft-core { width: 4.6rem; height: 4.6rem; font-size: 1.9rem; } }

/* ================= 念珠 · 一珠一念（双轨年轮） ================= */
.hw-beads { position: relative; overflow: hidden; padding: 6rem 0; text-align: center; background: linear-gradient(180deg, #241a0e, #171109 60%, #120d07); }
.hw-beads-orbit {
  position: absolute; left: 50%; top: 50%; width: 70vmin; height: 70vmin;
  transform: translate(-50%, -50%);
  border: 1px dashed rgba(216,168,92,.18); border-radius: 50%;
}
.hw-beads-orbit::before, .hw-beads-orbit::after {
  content: ""; position: absolute; border-radius: 50%; border: 1px dashed rgba(216,168,92,.12);
}
.hw-beads-orbit::before { inset: 12%; }
.hw-beads-orbit::after { inset: 26%; }
.hw-beads-orbit--2 { width: 84vmin; height: 84vmin; border-color: rgba(216,168,92,.1); }
.hw-beads-inner { position: relative; z-index: 1; }
.hw-beads-seal {
  display: inline-flex; align-items: center; justify-content: center;
  width: 5.5rem; height: 5.5rem; border-radius: 50%;
  font-family: var(--zh); font-size: 2.2rem; color: #e0b877;
  border: 1px solid rgba(216,168,92,.4);
  box-shadow: 0 0 30px rgba(216,168,92,.3);
  margin-bottom: 1.4rem;
}
.hw-beads-lead { color: var(--muted); max-width: 30rem; margin: 1.2rem auto 0; line-height: 1.9; }

/* ================= 木雕 · 以刀写木（年轮板） ================= */
.hw-carve { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); gap: 3rem; align-items: center; }
@media (max-width: 1080px) { .hw-carve { grid-template-columns: 1fr; gap: 2rem; } }
.hw-carve-plank {
  position: relative; padding: 2rem; overflow: hidden;
  background:
    radial-gradient(circle at 50% 50%,
      transparent 0 14%, rgba(216,168,92,.14) 14% 15%,
      transparent 15% 28%, rgba(216,168,92,.11) 28% 29%,
      transparent 29% 42%, rgba(216,168,92,.08) 42% 43%,
      transparent 43% 56%, rgba(216,168,92,.06) 56% 57%,
      transparent 57% 100%),
    #1a130a;
  border: 1px solid rgba(216,168,92,.25);
}
.hw-carve-mark {
  display: block; font-family: var(--zh); font-size: clamp(5rem, 12vw, 8rem); text-align: center; line-height: 1;
  color: transparent;
  -webkit-background-clip: text; background-clip: text;
  background-image: linear-gradient(160deg, #e8c488, #a46a3a 55%, #5d3a1e);
  filter: drop-shadow(0 0 24px rgba(216,168,92,.3));
}

/* ================= 木史编年 · 年轮时间轴 ================= */
.hw-ring-timeline { margin-top: 2.6rem; }
.hw-rt-row {
  position: relative; display: grid; grid-template-columns: 5.5rem minmax(0, 1fr); gap: 1.4rem;
  align-items: start; padding: 1.4rem 0;
  border-bottom: 1px solid rgba(216,168,92,.12);
}
.hw-rt-row:last-child { border-bottom: 0; }
/* 每史一枚年轮（环径随序号递增，表久远） */
.hw-rt-ring {
  position: relative; width: 4.2rem; height: 4.2rem; border-radius: 50%;
  background:
    radial-gradient(circle at 50% 50%,
      #2c2012 0 20%, rgba(216,168,92,.34) 20% 23%, #2c2012 23% 38%,
      rgba(216,168,92,.26) 38% 41%, #241a0e 41% 56%,
      rgba(216,168,92,.18) 56% 59%, #1d150b 59% 100%);
  border: 1px solid rgba(216,168,92,.4);
  box-shadow: 0 0 20px rgba(216,168,92,.2);
  transform: scale(calc(1 + var(--ring, 0) * .12));
  transform-origin: left center;
}
@media (max-width: 560px) {
  .hw-rt-row { grid-template-columns: 3.6rem minmax(0, 1fr); gap: 1rem; }
  .hw-rt-ring { width: 3rem; height: 3rem; }
}
.hw-rt-era { display: inline-block; font-family: var(--zh); font-size: 1.1rem; color: #e0b877; letter-spacing: .12em; }
.hw-rt-zh { font-family: var(--zh); font-size: 1.25rem; color: var(--ink-text); margin: .2rem 0 .35rem; }
.hw-rt-zh em { font-family: var(--serif); font-style: italic; color: var(--accent-soft); font-size: .82rem; margin-left: .4rem; }
.hw-rt-text { color: var(--muted); font-size: var(--fs-small); line-height: 1.85; }

/* ================= 木集市 · 年轮标签 + 年轮卡片 ================= */
.hw-ring-tags { display: flex; gap: .6rem; flex-wrap: wrap; justify-content: center; margin: 1.6rem 0 2.4rem; }
/* 年轮刻度标签：圆角胶囊带细环 */
.hw-ring-tag {
  position: relative; padding: .5rem 1.2rem;
  border: 1px solid rgba(216,168,92,.4); border-radius: 2rem;
  color: var(--muted); font-size: var(--fs-small); letter-spacing: .1em;
  transition: all .4s var(--ease-lux);
}
.hw-ring-tag::before {
  content: ""; position: absolute; inset: 3px; border-radius: 2rem;
  border: 1px dashed rgba(216,168,92,.2); pointer-events: none;
}
.hw-ring-tag:hover { color: var(--ink-text); border-color: var(--accent); box-shadow: 0 0 20px rgba(216,168,92,.22); }
.hw-ring-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.4rem; }
@media (max-width: 1080px) { .hw-ring-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .hw-ring-grid { grid-template-columns: 1fr; } }
/* 年轮卡片：圆角 + 年轮描边装饰 */
.hw-ring-card { position: relative; overflow: hidden; border: 1px solid rgba(216,168,92,.2); border-radius: 14px; transition: transform .5s var(--ease-lux), box-shadow .5s var(--ease-lux), border-color .5s var(--ease-lux); }
.hw-ring-card::before {
  content: ""; position: absolute; right: -3.2rem; top: -3.2rem; width: 6.4rem; height: 6.4rem;
  border-radius: 50%; pointer-events: none; z-index: 2;
  background:
    radial-gradient(circle at 50% 50%,
      transparent 0 24%, rgba(216,168,92,.22) 24% 27%, transparent 27% 46%,
      rgba(216,168,92,.16) 46% 49%, transparent 49% 100%);
}
.hw-ring-card:hover { transform: translateY(-6px); border-color: rgba(216,168,92,.5); box-shadow: 0 24px 50px -24px rgba(216,168,92,.35); }

/* ================= 六式养木 · 养木六环 ================= */
.hw-care-ring {
  position: relative; display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.4rem;
  margin-top: 2.6rem; padding: 2.4rem 1rem;
}
@media (max-width: 560px) { .hw-care-ring { grid-template-columns: 1fr; } }
.hw-care-ring::before {
  content: ""; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
  width: min(34rem, 82vw); height: min(34rem, 82vw); border-radius: 50%;
  border: 1px dashed rgba(216,168,92,.18); pointer-events: none;
}
.hw-care-cell { position: relative; z-index: 1; text-align: center; padding: 1.6rem 1.2rem; border: 1px solid var(--line-soft); background: var(--bg); }
.hw-care-zh { font-family: var(--zh); font-size: 1.3rem; color: #e0b877; display: block; }
.hw-care-en { display: inline-block; margin: .35rem 0 .6rem; font-family: var(--serif); font-style: italic; color: var(--accent-soft); font-size: .82rem; }
.hw-care-text { color: var(--muted); font-size: var(--fs-small); line-height: 1.85; }
.hw-care-core {
  position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 2;
  display: flex; align-items: center; justify-content: center;
  width: 4.8rem; height: 4.8rem; border-radius: 50%;
  font-family: var(--serif); font-size: 2rem; color: #e0b877;
  background: #1d150b; border: 1px solid rgba(216,168,92,.5);
  box-shadow: 0 0 30px rgba(216,168,92,.35);
}
@media (max-width: 560px) { .hw-care-core { width: 3.8rem; height: 3.8rem; font-size: 1.6rem; } }

/* ================= 盘玩仪式 · 四象限环 ================= */
.hw-ritual { position: relative; overflow: hidden; padding: 6rem 0; text-align: center; background: linear-gradient(180deg, #241a0e, #171109 60%, #120d07); }
.hw-ritual-ring {
  position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
  width: min(46rem, 96vw); height: min(46rem, 96vw); border-radius: 50%;
  border: 1px solid rgba(216,168,92,.12); pointer-events: none;
}
.hw-ritual-ring::before {
  content: ""; position: absolute; inset: 10%; border-radius: 50%;
  border: 1px dashed rgba(216,168,92,.16);
}
.hw-ritual-ring::after {
  content: ""; position: absolute; inset: 22%; border-radius: 50%;
  border: 1px solid rgba(216,168,92,.1);
}
.hw-ritual-inner { position: relative; z-index: 1; }
.hw-ritual-seal {
  display: inline-flex; align-items: center; justify-content: center;
  width: 5.2rem; height: 5.2rem; border-radius: 50%;
  font-family: var(--zh); font-size: 2rem; color: #e0b877;
  border: 1px solid rgba(216,168,92,.4);
  box-shadow: 0 0 30px rgba(216,168,92,.3);
  margin-bottom: 1.2rem;
}
.hw-ritual-lead { color: var(--muted); max-width: 32rem; margin: 1.2rem auto 0; line-height: 1.9; }
.hw-ritual-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.4rem; margin-top: 2.8rem; }
@media (max-width: 1080px) { .hw-ritual-steps { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .hw-ritual-steps { grid-template-columns: 1fr; } }
.hw-ritual-step { border: 1px solid rgba(216,168,92,.24); background: rgba(255,255,255,.02); padding: 2rem 1.5rem; border-radius: 50% 50% 12px 12px; }
.hw-ritual-num { font-family: var(--zh); font-size: 1.3rem; color: #e0b877; }
.hw-ritual-name { font-family: var(--zh); font-size: 1.1rem; color: var(--ink-text); letter-spacing: .16em; margin: .6rem 0; }
.hw-ritual-name em { font-family: var(--serif); font-style: italic; color: var(--accent-soft); font-size: .78rem; margin-left: .4rem; }
.hw-ritual-text { color: var(--muted); font-size: var(--fs-small); line-height: 1.85; }

/* ================= 木德五性 · 五环交叠 ================= */
.hw-virtue-ring { display: grid; grid-template-columns: repeat(5, 1fr); gap: 1.2rem; margin-top: 2.6rem; }
@media (max-width: 1080px) { .hw-virtue-ring { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 560px) { .hw-virtue-ring { grid-template-columns: 1fr; } }
.hw-virtue-cell { text-align: center; padding: 1.7rem 1rem; }
/* 环状剪影 */
.hw-virtue-zh {
  display: flex; align-items: center; justify-content: center;
  width: 4.6rem; height: 4.6rem; margin: 0 auto .8rem; border-radius: 50%;
  font-family: var(--zh); font-size: 2.2rem; color: #e0b877;
  border: 1px solid rgba(216,168,92,.45);
  box-shadow: 0 0 22px rgba(216,168,92,.3), inset 0 0 18px rgba(216,168,92,.14);
}
.hw-virtue-en { display: block; margin-bottom: .7rem; font-family: var(--serif); font-style: italic; color: var(--accent-soft); font-size: .85rem; }
.hw-virtue-text { color: var(--muted); font-size: var(--fs-small); line-height: 1.85; }

/* ================= 引语 · 木纹板 ================= */
.hw-planks { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.6rem; }
@media (max-width: 1080px) { .hw-planks { grid-template-columns: 1fr; } }
/* 木纹底板 */
.hw-plank {
  position: relative; text-align: center; padding: 2rem 1.4rem; overflow: hidden;
  background:
    repeating-linear-gradient(92deg,
      rgba(216,168,92,.16) 0 5px, rgba(130,78,40,.18) 5px 9px,
      rgba(216,168,92,.12) 9px 14px, rgba(150,92,50,.14) 14px 19px),
    #1a130a;
  border: 1px solid rgba(216,168,92,.22);
}
.hw-plank::after {
  content: ""; position: absolute; left: 0; right: 0; top: 0; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(230,196,120,.5), transparent);
}
.hw-plank-text { font-family: var(--serif); font-style: italic; font-size: 1.15rem; color: var(--ink-text); line-height: 1.7; position: relative; z-index: 1; }
.hw-plank-zh { display: inline-block; margin-top: .8rem; font-family: var(--zh); color: var(--accent-soft); letter-spacing: .3em; font-size: var(--fs-small); position: relative; z-index: 1; }

/* ================= 藏家寄语 · 年轮剪影 ================= */
.hw-collector-ring { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.6rem; margin-top: 2.6rem; }
@media (max-width: 1080px) { .hw-collector-ring { grid-template-columns: 1fr; } }
.hw-collector-card { position: relative; text-align: center; padding: 2.2rem 1.4rem 2rem; border: 1px solid var(--line-soft); background: var(--bg); overflow: hidden; }
/* 顶部半圆年轮剪影 */
.hw-collector-arc {
  position: absolute; left: 50%; top: 0; transform: translateX(-50%);
  width: 8rem; height: 4rem;
  border-radius: 0 0 8rem 8rem;
  background:
    radial-gradient(circle at 50% 0%,
      transparent 0 16%, rgba(216,168,92,.3) 16% 20%,
      transparent 20% 38%, rgba(216,168,92,.22) 38% 42%,
      transparent 42% 62%, rgba(216,168,92,.14) 62% 66%,
      transparent 66% 100%);
  opacity: .7;
}
.hw-collector-quote { font-family: var(--serif); font-style: italic; color: var(--ink-text); line-height: 1.85; margin: 1.6rem 0 1.2rem; position: relative; }
.hw-collector-name { font-family: var(--zh); color: var(--accent-soft); letter-spacing: .14em; font-size: var(--fs-small); }
.hw-collector-name em { font-family: var(--serif); font-style: normal; color: var(--muted-2); font-size: .78rem; margin-left: .5rem; }

/* ================= CTA · 年轮光环 ================= */
.hw-cta-band { position: relative; overflow: hidden; padding: 6rem 0; text-align: center; background: linear-gradient(180deg, #120d07, #1c140a 60%, #120d07); }
.hw-cta-ring {
  position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
  width: min(56rem, 98vw); height: min(56rem, 98vw); border-radius: 50%;
  pointer-events: none;
  background:
    radial-gradient(circle at 50% 50%,
      transparent 0 18%, rgba(216,168,92,.16) 18% 19%,
      transparent 19% 34%, rgba(216,168,92,.12) 34% 35%,
      transparent 35% 50%, rgba(216,168,92,.09) 50% 51%,
      transparent 51% 66%, rgba(216,168,92,.06) 66% 67%,
      transparent 67% 82%, rgba(216,168,92,.04) 82% 83%,
      transparent 83% 100%);
}
.hw-cta-inner { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; gap: .8rem; }
.hw-cta-zh { font-family: var(--zh); color: var(--accent-soft); letter-spacing: .34em; font-size: var(--fs-small); }
.hw-cta-band .btn { margin-top: .8rem; }

/* 木纹肌理（全站细线，仅木质道馆） */
html[data-theme="wood"] body::before {
  content: ""; position: fixed; inset: 0; z-index: 0; pointer-events: none;
  opacity: 0.035;
  background-image: repeating-linear-gradient(92deg, transparent 0 7px, rgba(216,168,92,.5) 7px 8px);
}