/* ============================================================================
   AmberVouch · Archive（档案馆）全站主题层
   ----------------------------------------------------------------------------
   设计方向：纸张、墨、黄铜、细线、编号、宋体标题、直角卡片。
   在页面原有样式之后加载，只改“气质”，不改业务布局与交互。

   颜色：纸 #F5F0E6 / 墨 #211C16 / 黄铜 #9A5B2E / 深绿 #1E3A32
   字体：标题宋体；正文无衬线；编号/哈希等宽。
   ========================================================================== */
:root{
  --av-paper:#F5F0E6;
  --av-paper-2:#FBF8F1;
  --av-paper-3:#EFE7D8;
  --av-ink:#211C16;
  --av-ink-2:#4A4035;
  --av-muted:#766B5D;
  --av-brass:#9A5B2E;
  --av-brass-2:#7F4722;
  --av-brass-3:#B07A3A;
  --av-green:#1E3A32;
  --av-line:#D8CBB4;
  --av-line-2:#C7B79A;
  --av-serif:"Songti SC","Noto Serif SC","STSong","SimSun",serif;

  --bg:var(--av-paper) !important;
  --bg-2:var(--av-paper-2) !important;
  --surface:var(--av-paper-2) !important;
  --surface-2:var(--av-paper-3) !important;
  --surface-3:#E6DAC8 !important;
  --ink:var(--av-ink) !important;
  --ink-2:var(--av-ink-2) !important;
  --ink-3:var(--av-muted) !important;
  --ink-4:#A29482 !important;
  --gold:var(--av-brass) !important;
  --gold-2:var(--av-brass-2) !important;
  --gold-3:var(--av-brass-3) !important;
  --gold-soft:rgba(154,91,46,.10) !important;
  --gold-line:rgba(154,91,46,.28) !important;
  --link:var(--av-brass-2) !important;
  --link-2:#5E3218 !important;
  --line:var(--av-line) !important;
  --line-2:var(--av-line-2) !important;
  --r-sm:2px !important; --r:2px !important; --r-md:2px !important;
  --r-lg:3px !important; --r-xl:4px !important; --radius:2px !important;
  --sh-1:0 1px 0 rgba(33,28,22,.04) !important;
  --sh-2:0 14px 34px rgba(33,28,22,.07) !important;
  --sh-3:0 24px 60px rgba(33,28,22,.10) !important;
  --font-serif:var(--av-serif);
}

html{background:var(--av-paper) !important}
body{
  background:var(--av-paper) !important;
  color:var(--av-ink) !important;
}
/* 证据页等页面用 body[class] 的 Tailwind 底色，特异性高于单 body；这里压平 */
html body[class],body[class]{
  background:var(--av-paper) !important;
  color:var(--av-ink) !important;
}
body[class] .bg-white,body[class] .bg-slate-50,body[class] .bg-slate-100,body[class] .bg-gray-50,
body[class] .bg-amber-50,body[class] .bg-amber-100,body[class] .bg-yellow-50{
  background:var(--av-paper-2) !important;
}
body[class] .bg-amber-50,body[class] .bg-amber-100,body[class] .bg-yellow-50{background:var(--av-paper-3) !important}
body[class] .border-slate-200,body[class] .border-slate-300,body[class] .border-gray-200,
body[class] [class*="border-amber"],body[class] [class*="border-yellow"]{
  border-color:var(--av-line) !important;
}
body[class] [class*="text-amber"],body[class] [class*="text-yellow"]{color:var(--av-brass-2) !important}
body[class] [class*="rounded"]{border-radius:2px !important}
body[class] [class*="shadow"]{box-shadow:none !important}

/* 标题：宋体、收紧字距；保持原有字号层级 */
h1,h2,h3,h4,h5,.serif,.hero h1,.hero-claim,.h3-hero h2,.sec-head h2,.sec-title h2{
  font-family:var(--av-serif) !important;
  font-weight:500 !important;
  letter-spacing:-.02em;
}
h1{line-height:1.08 !important}
h2{line-height:1.18 !important}

/* 正文里的小标签、编号、哈希保持等宽 */
.mono,code,kbd,samp,pre,.eyebrow,.kicker,.h3-eyebrow{font-family:var(--font-mono) !important}

/* ── 顶部导航 ─────────────────────────────────────────────── */
.u-nav{
  background:rgba(245,240,230,.95) !important;
  color:var(--av-ink) !important;
  border-bottom:1px solid var(--av-line) !important;
  box-shadow:none !important;
  backdrop-filter:blur(12px);
}
.u-nav .brand .nm{color:var(--av-ink) !important}
.u-nav .brand .nm i{color:var(--av-brass) !important}
/* 站长确认：保留旧版朱红渐变章面「琥珀印」，作为全站唯一红色品牌锚点 */
.u-nav .brand .cn{
  display:inline-block !important;
  background:linear-gradient(160deg,#D64A37,#C0392B 60%,#A93226) !important;
  color:#FFFFFF !important;
  border:0 !important;
  border-radius:7px !important;
  box-shadow:0 3px 12px rgba(192,57,43,.38), inset 0 0 0 1.5px rgba(255,244,214,.55) !important;
  padding:6px 12px !important;
  font-family:"KaiTi","STKaiti","楷体",serif !important;
  font-weight:700 !important;
  font-size:22px !important;
  letter-spacing:4px !important;
  line-height:1.25 !important;
  transform:rotate(-2deg) !important;
  white-space:nowrap !important;
}
.u-nav .brand .cn em{
  font-style:normal !important;
  color:#F5B942 !important;
}
@supports ((-webkit-background-clip:text) or (background-clip:text)){
  .u-nav .brand .cn em{
    background:linear-gradient(180deg,#FFE9B8,#F5B942 50%,#E0A02A) !important;
    -webkit-background-clip:text !important;
    background-clip:text !important;
    color:transparent !important;
  }
}
@media (max-width:760px){
  .u-nav .brand .cn{font-size:17px !important;letter-spacing:2.5px !important;padding:4px 8px !important;border-radius:6px !important}
}
.u-nav .nav-links > .nav-item > .nav-top,
.u-nav .nav-links > a.nav-top{
  color:var(--av-ink-2) !important;
  font-size:13px !important;
  letter-spacing:.02em;
}
.u-nav .nav-links > .nav-item > .nav-top:hover,
.u-nav .nav-links > a.nav-top:hover{color:var(--av-brass) !important}
.u-nav .caret{border-color:var(--av-muted) !important}
.u-nav .nav-cta{
  background:var(--av-ink) !important;
  color:var(--av-paper-2) !important;
  border:1px solid var(--av-ink) !important;
  border-radius:2px !important;
  box-shadow:none !important;
  font-weight:700 !important;
}
.u-nav .nav-cta:hover{background:var(--av-brass) !important;border-color:var(--av-brass) !important}
.u-nav .submenu-in{
  background:var(--av-paper-2) !important;
  border:1px solid var(--av-line-2) !important;
  border-radius:2px !important;
  box-shadow:0 18px 40px rgba(33,28,22,.12) !important;
}
.u-nav .submenu-in a b{color:var(--av-ink) !important}
.u-nav .submenu-in a span{color:var(--av-muted) !important}
.u-nav .submenu-in a:hover{background:var(--av-paper-3) !important}
.u-nav .catbox .cb-hd{border-radius:2px !important}
.u-nav .nav-burger .bar{background:var(--av-ink) !important}

/* 工具页顶部的分类条：从“彩色图标条”收敛为纸面细线 */
.catnav,.catbar{border-color:var(--av-line) !important}

/* ── 按钮：直角、墨色主按钮、黄铜 hover ───────────────────── */
.btn,.btn-main,.btn-o,.btn-p,.btn-amber,.btn-hero,.btn-ghost,.btn-primary,
.nav-cta,.nd-act,.h3-search button,.h3-intent .go{
  border-radius:2px !important;
  box-shadow:none !important;
  font-family:var(--font) !important;
}
.btn-main,.btn-p,.btn-amber,.h3-search button{
  background:var(--av-ink) !important;
  border-color:var(--av-ink) !important;
  color:var(--av-paper-2) !important;
}
.btn-main:hover,.btn-p:hover,.btn-amber:hover,.h3-search button:hover{
  background:var(--av-brass) !important;
  border-color:var(--av-brass) !important;
}
.btn-o,.btn-ghost,.btn-hero.btn-ghost{
  background:transparent !important;
  border:1px solid var(--av-line-2) !important;
  color:var(--av-ink) !important;
}
.btn-o:hover,.btn-ghost:hover,.btn-hero.btn-ghost:hover{
  background:var(--av-paper-3) !important;
  border-color:var(--av-ink) !important;
}

/* ── 卡片：纸面、细线、直角、几乎无阴影 ───────────────────── */
.card,.panel,.box,.h3-card,.h3-intent,.tool-card,.price-card,.plan,.pcard,
.feature,.stat,.step-card,.wb-card,.drop,.h3-drop,.h3-search,.faq-item{
  border-radius:2px !important;
  box-shadow:none !important;
}
.card,.panel,.box,.tool-card,.price-card,.plan,.pcard,.feature,.stat,.step-card,.wb-card,.faq-item{
  background:var(--av-paper-2) !important;
  border-color:var(--av-line) !important;
}
.card:hover,.tool-card:hover,.price-card:hover,.plan:hover,.pcard:hover,.feature:hover,.wb-card:hover{
  border-color:var(--av-line-2) !important;
  box-shadow:0 14px 30px rgba(33,28,22,.06) !important;
}

/* 表单 */
input,select,textarea{
  border-radius:2px !important;
  background:var(--av-paper-2) !important;
  border-color:var(--av-line-2) !important;
  color:var(--av-ink) !important;
}
input:focus,select:focus,textarea:focus{border-color:var(--av-brass) !important;box-shadow:none !important}

/* 页脚：墨底、纸字 */
footer,.site-footer{
  background:var(--av-ink) !important;
  color:var(--av-paper) !important;
  border-top:1px solid var(--av-ink) !important;
}
footer a,.site-footer a{color:rgba(245,240,230,.72) !important}
footer a:hover,.site-footer a:hover{color:var(--av-brass-3) !important}
footer h4,footer .foot-h{color:rgba(245,240,230,.42) !important;font-family:var(--font-mono) !important;font-size:10px !important;letter-spacing:.14em !important}
footer p,footer .muted{color:rgba(245,240,230,.56) !important}

/* ── /tools/ Hub：A 方案的纸面目录 ────────────────────────── */
.hub3{
  background:var(--av-paper) !important;
  border-top:1px solid var(--av-line) !important;
  border-bottom:1px solid var(--av-line) !important;
}
.hub3::before{background:var(--av-brass) !important}
.h3-eyebrow{color:var(--av-brass) !important}
.h3-hero h2{color:var(--av-ink) !important;font-size:clamp(32px,3.8vw,48px) !important;letter-spacing:-.04em !important}
.h3-hero h2 em{color:var(--av-brass) !important;font-style:normal !important}
.h3-lede{color:var(--av-ink-2) !important}
.h3-search{
  background:var(--av-paper-2) !important;
  border:1px solid var(--av-line-2) !important;
  box-shadow:none !important;
}
.h3-search input{background:transparent !important;border:0 !important}
.h3-search kbd{background:var(--av-paper-3) !important;border-color:var(--av-line) !important;border-radius:2px !important}
.h3-drop{
  background:rgba(251,248,241,.7) !important;
  border:1px dashed var(--av-line-2) !important;
}
.h3-drop .pick a{background:var(--av-brass) !important;color:#FFF8EC !important;border-radius:2px !important}
.h3-sec-h{color:var(--av-ink) !important;font-family:var(--av-serif) !important;font-size:15px !important}
.h3-sec-h::before{background:var(--av-brass) !important}
.h3-intents{gap:10px !important}
.h3-intent{
  background:var(--av-paper-2) !important;
  border:1px solid var(--av-line) !important;
  color:var(--av-ink) !important;
}
.h3-intent b{font-family:var(--av-serif) !important;font-weight:600 !important}
.h3-intent span{color:var(--av-muted) !important}
.h3-intent .go{color:var(--av-brass) !important}
.h3-intent:hover{border-color:var(--av-brass) !important;transform:translateY(-1px) !important}
.h3-card{
  background:var(--av-paper-2) !important;
  border:1px solid var(--av-line) !important;
  min-height:0 !important;
}
.h3-card:hover{border-color:var(--av-brass) !important;box-shadow:0 14px 28px rgba(33,28,22,.06) !important;transform:translateY(-2px) !important}
.h3-card-title h3{font-family:var(--av-serif) !important;font-weight:600 !important;color:var(--av-ink) !important}
.h3-ico{filter:grayscale(1) sepia(.28) saturate(.55);opacity:.78}
.catnav .ic,.catbar .ic{filter:grayscale(1) sepia(.3) saturate(.5);opacity:.7}
.catnav .cn-ic{filter:grayscale(1) sepia(.3) saturate(.45);opacity:.65}
.h3-card-title span{color:var(--av-muted) !important;font-family:var(--font-mono) !important;font-size:9px !important}
.h3-card .h3-links a{color:var(--av-ink-2) !important}
.h3-card .h3-links a:hover{color:var(--av-brass) !important;border-color:var(--av-brass) !important}
.h3-card-foot{border-top:1px solid var(--av-line) !important}
.h3-card-foot span{color:var(--av-muted) !important}
.h3-card-foot b{color:var(--av-brass) !important}
.h3-more a{background:var(--av-paper-2) !important;border-color:var(--av-line) !important;border-radius:2px !important;color:var(--av-ink) !important}
.h3-more a:hover{border-color:var(--av-brass) !important}
.h3-pal-box{background:var(--av-paper-2) !important;border-color:var(--av-line) !important;border-radius:2px !important}

/* 首页的局部“金色块/深色块”统一到纸面与墨色 */
.hero{background:var(--av-paper) !important}
.stat-strip{background:var(--av-paper-2) !important;border-color:var(--av-line) !important}
.portal-card,.feature-card,.use-case,.pricing-card,.quote,.faq{
  background:var(--av-paper-2) !important;
  border-color:var(--av-line) !important;
  border-radius:2px !important;
  box-shadow:none !important;
}

/* 链接与选中态 */
::selection{background:rgba(154,91,46,.22);color:var(--av-ink)}
a{text-underline-offset:3px}


/* ============================================================================
   苹果式交互层（2026-10-31）—— 档案馆主题适配版
   与 theme.css 同源，但：① CTA 柔光用黄铜色；② 不碰直角（档案美学保留直角）。
   ============================================================================ */

html{ scroll-behavior: smooth; }
:root{ --ease-out: cubic-bezier(.22,1,.36,1); --ease-soft: cubic-bezier(.4,0,.2,1); --ease-spring: cubic-bezier(.34,1.56,.64,1); }

a{ transition: color .2s var(--ease-soft); }

button, [role="button"], .btn, .g-btn, .btn-p, .btn-pri, .btn-buy, .btn-primary,
.btn-sec, .btn-ghost, button.buy, a.btn, a.btn-p, .nav-cta{
  transition: transform .16s var(--ease-out), background-color .2s var(--ease-soft),
              border-color .2s var(--ease-soft), color .2s var(--ease-soft),
              box-shadow .24s var(--ease-soft), filter .2s var(--ease-soft);
  -webkit-tap-highlight-color: transparent;
}
button:active, [role="button"]:active, .btn:active, .g-btn:active, .btn-p:active,
.btn-pri:active, .btn-buy:active, .btn-primary:active, .btn-sec:active, .btn-ghost:active,
a.btn:active, a.btn-p:active, .nav-cta:active{ transform: scale(.965); }

/* 主 CTA（黄铜底）hover 抬升 + 柔光 */
.btn-p, .btn-pri, .btn-buy, .btn-primary, .g-btn--primary, button.buy{
  position: relative; overflow: hidden;
  box-shadow: 0 1px 3px rgba(154,91,46,.18);
}
.btn-p:hover, .btn-pri:hover, .btn-buy:hover, .btn-primary:hover,
.g-btn--primary:hover, button.buy:hover{
  transform: translateY(-1px);
  box-shadow: 0 10px 24px rgba(154,91,46,.30);
}
.btn-p:active, .btn-pri:active, .btn-buy:active, .btn-primary:active,
.g-btn--primary:active, button.buy:active{
  transform: translateY(0) scale(.965);
  box-shadow: 0 2px 8px rgba(154,91,46,.20);
}
.btn-p::after, .btn-pri::after, .btn-buy::after, .btn-primary::after,
.g-btn--primary::after, button.buy::after{
  content:""; position:absolute; top:0; left:-130%; width:55%; height:100%;
  pointer-events:none; background:linear-gradient(100deg,transparent,rgba(255,255,255,.30),transparent);
  transform:skewX(-20deg); transition:left .55s var(--ease-soft);
}
.btn-p:hover::after, .btn-pri:hover::after, .btn-buy:hover::after,
.btn-primary:hover::after, .g-btn--primary:hover::after, button.buy:hover::after{ left:135%; }

/* 卡片：悬停阴影加深，可点击卡片轻抬 */
.g-card, .card{
  transition: box-shadow .28s var(--ease-out), border-color .28s var(--ease-soft), transform .28s var(--ease-out);
}
.g-card:hover, .card:hover{ box-shadow: var(--sh-2); border-color: var(--gold-line); }
.g-card:has(a):hover, .card:has(a):hover{ transform: translateY(-3px); }

/* 工作台卡片 + 图标回弹 */
.h3-card{ transition: transform .28s var(--ease-out), box-shadow .28s var(--ease-out), border-color .28s var(--ease-soft); }
.h3-card:hover{ transform: translateY(-4px); box-shadow: var(--sh-3); border-color: var(--gold-line); }
.h3-card .h3-ico{ transition: transform .34s var(--ease-spring); }
.h3-card:hover .h3-ico{ transform: scale(1.1) rotate(-3deg); }

input, select, textarea{
  transition: border-color .2s var(--ease-soft), box-shadow .2s var(--ease-soft), background-color .2s var(--ease-soft);
}
.nav-links a, .nav-top, .nav-item > a{ transition: color .2s var(--ease-soft), border-color .2s var(--ease-soft), opacity .2s var(--ease-soft); }
.logo, .brand-mark, .seal-mark{ transition: transform .4s var(--ease-spring); }
.logo:hover, .brand-mark:hover, .seal-mark:hover{ transform: scale(1.05); }
.rate tbody tr, table tbody tr{ transition: background-color .18s var(--ease-soft); }
.rate tbody tr:hover, table tbody tr:hover{ background-color: var(--gold-soft); }


/* ---------- 苹果式交互增强（motion.js 配套） ---------- */
/* 滚动入场 */
.av-reveal{ opacity:0; transform:translateY(16px);
  transition:opacity .55s var(--ease-out, cubic-bezier(.22,1,.36,1)),
             transform .55s var(--ease-out, cubic-bezier(.22,1,.36,1)); }
.av-reveal.av-in{ opacity:1; transform:none; }
/* 按钮涟漪 */
.av-ripple{ position:absolute; border-radius:50%; background:currentColor; opacity:.16;
  transform:scale(0); animation:av-ripple .6s var(--ease-out, cubic-bezier(.22,1,.36,1));
  pointer-events:none; z-index:1; }
@keyframes av-ripple{ to{ transform:scale(1); opacity:0; } }
