/* ============================================================
   基礎重置 · 排版 · 通用工具
   ============================================================ */

*, *::before, *::after { box-sizing: border-box; }

/* ---------- 隱藏屬性防線 ----------
   作者樣式若設了 display（如 .ai-toggle{display:inline-flex}、.empty{display:flex}），
   會覆蓋 HTML 的 hidden 屬性，導致「應隱藏的元素照樣顯示」。
   此處統一加固，確保 hidden 永遠生效。 */
[hidden] { display: none !important; }

html {
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
  /* 入場位移（reveal-left/right）與光暈縮放（breathe）會短暫超出視寬，
     在此統一裁切。用 clip 而非 hidden：clip 不會建立捲動容器，
     故不會破壞 position:sticky（如 .cart-sum）。 */
  overflow-x: clip;
}

body {
  margin: 0;
  background: var(--c-bg);
  color: var(--c-fg);
  font-family: var(--f-body);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}
@supports (overflow: clip) {
  body { overflow-x: clip; }
}

/* 全局紙張噪點質感 */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  opacity: var(--o-noise);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E");
}

h1, h2, h3, h4 { margin: 0; font-weight: 600; line-height: var(--lh-tight); }
h1, h2, .u-display { font-family: var(--f-title); }
p { margin: 0 0 var(--s-4); }
a { color: inherit; text-decoration: none; }
img, svg { display: block; max-width: 100%; }
button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; }
input, textarea, select { font: inherit; color: inherit; }
ul, ol { margin: 0; padding-left: 1.4em; }

::selection { background: rgba(200, 164, 92, .30); color: var(--c-dian); }

/* ---------- 容器 ---------- */
.wrap { width: 100%; max-width: var(--w-max); margin-inline: auto; padding-inline: var(--pad-x); }
.wrap-text { max-width: var(--w-text); margin-inline: auto; padding-inline: var(--pad-x); }

/* ---------- 鎏金文字（漸變，禁用純色） ----------
   紙底版本：深赭金漸層，最淺一色 #80621E 對宣紙仍有 4.97:1 */
.gilded {
  background: linear-gradient(180deg, #80621E 0%, #6E531A 55%, #56410F 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* ---------- 排版工具 ---------- */
.u-display { font-size: var(--fs-display); font-weight: 900; letter-spacing: var(--ls-display); }
.u-vertical { writing-mode: vertical-rl; text-orientation: upright; }
.u-eyebrow {
  font-family: var(--f-mono);
  font-size: var(--fs-tiny);
  letter-spacing: var(--ls-wide);
  text-transform: uppercase;
  color: var(--c-gold);
}
.u-lead { font-size: 1.125rem; color: var(--c-fg-soft); }
.u-small { font-size: var(--fs-small); color: var(--c-fg-soft); }
.u-mono { font-family: var(--f-mono); }
.u-center { text-align: center; }
.u-sr {
  position: absolute; width: 1px; height: 1px;
  padding: 0; margin: -1px; overflow: hidden;
  clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}

/* ---------- 待審定標記 ---------- */
.pending {
  display: inline-block;
  padding: 1px 6px;
  border: 1px dashed rgba(154, 91, 18, .55);
  border-radius: var(--radius-sm);
  background: rgba(154, 91, 18, .08);
  color: #8A5010;
  font-size: var(--fs-tiny);
  font-family: var(--f-mono);
  letter-spacing: .04em;
  vertical-align: baseline;
}

/* ---------- 分隔線：雲紋 ---------- */
.rule-orn {
  display: flex; align-items: center; justify-content: center;
  gap: var(--s-4); margin-block: var(--s-8);
  color: var(--c-gold); opacity: var(--o-orn);
}
.rule-orn::before, .rule-orn::after {
  content: ""; height: 1px; flex: 1; max-width: 180px;
  background: linear-gradient(90deg, transparent, var(--c-line), transparent);
}
.rule-orn > svg { width: 90px; height: 22px; flex: none; opacity: .9; }

/* ---------- 焦點可見性 ---------- */
:focus-visible {
  outline: 2px solid var(--c-gold);
  outline-offset: 3px;
  border-radius: 2px;
}

/* ---------- 跳過導航 ---------- */
.skip {
  position: absolute; left: 50%; top: -60px; transform: translateX(-50%);
  z-index: var(--z-toast); padding: var(--s-2) var(--s-4);
  background: var(--c-wa); color: #2B2B28; border-radius: var(--radius-sm);
  transition: top var(--t-fast);
}
.skip:focus { top: var(--s-3); }

/* ---------- 頁腳 ---------- */
.site-foot {
  border-top: 1px solid var(--c-line-soft);
  margin-top: var(--s-24);
  padding-block: var(--s-12) var(--s-8);
  background: linear-gradient(180deg, transparent, rgba(46, 74, 95, .05));
}
.foot-grid {
  display: grid; gap: var(--s-8);
  grid-template-columns: 1.4fr 1fr 1fr;
}
@media (max-width: 860px) { .foot-grid { grid-template-columns: 1fr; } }
.foot-title {
  font-family: var(--f-title); font-size: var(--fs-small);
  color: var(--c-gold); margin-bottom: var(--s-3); letter-spacing: .1em;
}
.foot-list { list-style: none; margin: 0; padding: 0; }
.foot-list li { margin-bottom: var(--s-2); font-size: var(--fs-small); color: var(--c-fg-soft); }
.foot-list a:hover { color: var(--c-gold); }
.foot-disclaimer {
  margin-top: var(--s-8); padding-top: var(--s-6);
  border-top: 1px solid var(--c-line-soft);
  font-size: var(--fs-tiny); line-height: 1.9; color: var(--c-mo-soft);
}

/* ---------- 減少動效 ---------- */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}