/* =============================================================
   旺财简历 · 橙色主题层 v6
   设计语言：暖橙/琥珀 #FF6B1A（参考图风格）
   · 极简内容：Hero + 4图标行 + 价值区
   · 文字左 · 吉祥物右 · 浮动卡片装饰
   ============================================================= */

:root{
  --ink:        #1A1A2E;
  --ink-2:      #5A5A72;
  --muted:      #7B8194;
  --line:       #E8E8EE;
  --line-2:     #F3F3F7;
  --bg:         #FFFBF7;
  --bg-alt:     #FFFFFF;
  --bg-soft:    #FFF4EB;

  /* 橙色主色系 */
  --primary:    #FF6B1A;
  --primary-600:#E85A0A;
  --primary-700:#CC4D00;
  --primary-050:#FFF0E5;

  --blue:       #4A90D9;
  --blue-bg:    #EBF3FC;
  --green:      #34C759;
  --green-bg:   #EDF8EE;
  --gold:       #F5A623;
  --gold-light: #FFF8E1;

  --radius-xs:  12px;
  --radius:     16px;
  --radius-lg:  20px;
  --radius-xl:  28px;
  --radius-pill:999px;

  --shadow-sm:  0 1px 3px rgba(26,26,46,.05), 0 1px 2px rgba(26,26,46,.03);
  --shadow-md:  0 4px 14px -4px rgba(26,26,46,.08), 0 8px 24px -8px rgba(26,26,46,.06);
  --shadow-lg:  0 12px 32px -8px rgba(26,26,46,.10), 0 24px 48px -12px rgba(255,107,26,.10);
  --shadow-xl:  0 20px 48px -12px rgba(26,26,46,.12), 0 40px 80px -20px rgba(255,107,26,.12);

  --ease:       cubic-bezier(.22,.61,.36,1);
  --ease-out:   cubic-bezier(.0,0,.2,1);
  --font-body:  "Inter","Noto Sans SC",system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-display:"Inter","Noto Sans SC",system-ui,sans-serif;

  --gradient-primary: linear-gradient(135deg, #FF8C42 0%, #FF6B1A 100%);
  --gradient-soft:    linear-gradient(135deg, #FFF4EB 0%, #FFECD6 100%);
}

/* =============================================================
   编辑器页面（简历生成 builder.html）橙色主题适配
   仅作用于 .editor-page，覆盖 styles.css 的紫色令牌（--g-blue/#A21CAF），
   不影响首页 / 模板 / 范文等其它页面。
   ============================================================= */
.editor-page{
  --g-blue:         #FF6B1A;   /* 橙色主品牌（替代原红紫 #A21CAF） */
  --g-blue-hover:   #E85A0A;
  --g-blue-light:   #FFF0E5;
  --tg-blue:         #FF6B1A;
  --tg-blue-hover:   #E85A0A;
  --tg-blue-active:  #E85A0A;
  --tg-blue-light:   #FFF0E5;
  --tg-blue-dark:    #CC4D00;
  /* 编辑器内可编辑文本高亮（原 rgba(162,28,175,*) → 橙） */
  --edit-hl:         rgba(255,107,26,.16);
  --edit-hl-strong:  rgba(255,107,26,.30);
}

/* ---------- 基础 ---------- */
body{
  background:var(--bg); color:var(--ink);
  font-family:var(--font-body); -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
.container{max-width:1160px; margin:0 auto; padding:0 24px;}
a{color:var(--primary); text-decoration:none; transition:color .2s var(--ease);}
a:hover{color:var(--primary-700);}

/* =============================================================
   导航 —— 极简文字风格
   白底毛玻璃 · 橙色下划线 active
   ============================================================= */
.gnb{
  position:sticky; top:0; z-index:100;
  background:rgba(255,255,255,.88);
  backdrop-filter:saturate(180%) blur(20px) brightness(1.02);
  -webkit-backdrop-filter:saturate(180%) blur(20px) brightness(1.02);
  border-bottom:1px solid rgba(0,0,0,.05);
}
.gnb-inner{
  max-width:1200px; margin:0 auto;
  padding:0 28px; height:64px;
  display:flex; align-items:center; gap:8px;
}
.gnb-logo{
  display:flex; align-items:center; gap:10px;
  font-family:var(--font-display); font-weight:800; font-size:17px;
  color:var(--ink); letter-spacing:-.02em;
  flex-shrink:0; margin-right:20px;
}
.logo-mascot{width:30px;height:30px;border-radius:8px;background:var(--primary-050);padding:3px;}
.gnb-links{display:flex; align-items:center; gap:4px; flex:1;}
.gnb-links a{
  position:relative; color:var(--ink-2);
  font-family:var(--font-display); font-weight:500; font-size:14.5px;
  padding:8px 16px; border-radius:8px;
  transition:color .25s var(--ease), background .2s var(--ease);
}
.gnb-links a:hover{ color:var(--ink); background:rgba(0,0,0,.03); }
.gnb-links a.active{
  color:var(--primary); font-weight:600;
}
.gnb-links a.active::after{
  content:"";
  position:absolute; left:18px; right:18px; bottom:-1px; height:2.5px;
  background:var(--gradient-primary); border-radius:2px;
  animation:navSlideIn .35s var(--ease) both;
}
@keyframes navSlideIn{ from{transform:scaleX(0); transform-origin:left center;} to{transform:scaleX(1);} }

/* WangCai Skill 特殊导航项：斜体粗体大字号，无前缀图标（精简） */
.gnb-links .nav-highlight{
  font-style:italic;
  font-weight:700;
  font-size:17px;
  letter-spacing:.3px;
  color:var(--primary);
  background:transparent;
}
.gnb-links .nav-highlight:hover{
  color:var(--primary);
  background:rgba(255,107,26,.06);
}
.gnb-links .nav-highlight.active{
  color:var(--primary);
  background:transparent;
}

.gnb-actions{display:flex; align-items:center; gap:10px; margin-left:auto;}
.gnb-btn{
  border-radius:8px; font-family:var(--font-display); font-size:13px; font-weight:600;
  padding:8px 16px; border:1px solid var(--line); background:#fff; color:var(--ink-2);
  cursor:pointer; transition:all .2s var(--ease);
}
.gnb-btn:hover{background:var(--bg-alt); color:var(--ink); transform:translateY(-1px);}
.gnb-btn-primary{
  background:var(--gradient-primary) !important; color:#fff !important; border:none !important;
  box-shadow:0 4px 14px -4px rgba(255,107,26,.40);
}
.gnb-btn-primary:hover,
.gnb-btn-primary:focus,
.gnb-btn-primary:focus-visible,
.gnb-btn-primary:active{
  background:var(--gradient-primary) !important; color:#fff !important;
  transform:translateY(-2px);
  box-shadow:0 8px 22px -6px rgba(255,107,26,.55);
  filter:brightness(1.05);
}
/* 暗色模式：与亮色相反——深色面板 + 亮色橙字（柔和发光），不刺眼且与暗背景协调 */
[data-theme="dark"] .gnb-btn-primary{
  background:rgba(255,107,26,.12) !important; color:#FF8A4D !important;
  border:1.5px solid rgba(255,107,26,.55) !important;
  box-shadow:0 4px 14px -4px rgba(255,107,26,.25), inset 0 1px 0 rgba(255,255,255,.05);
}
[data-theme="dark"] .gnb-btn-primary:hover,
[data-theme="dark"] .gnb-btn-primary:focus,
[data-theme="dark"] .gnb-btn-primary:focus-visible,
[data-theme="dark"] .gnb-btn-primary:active{
  background:rgba(255,107,26,.20) !important; color:#FFA773 !important;
  border-color:rgba(255,107,26,.80) !important;
  transform:translateY(-2px);
  box-shadow:0 8px 22px -6px rgba(255,107,26,.40), inset 0 1px 0 rgba(255,255,255,.08);
  filter:none;
}
.gnb-theme-toggle{
  width:36px;height:36px;padding:0;display:flex;align-items:center;justify-content:center;
  font-size:16px; color:var(--ink-2); border:1px solid var(--line); background:transparent;
}
.gnb-theme-toggle:hover{ background:var(--bg-alt); color:var(--ink); }
/* 图标：亮色显日（点击去暗），暗色显月（点击去亮），与 styles.css:5574 一致 */
.gnb-theme-toggle .theme-icon-light{ display:inline; }
.gnb-theme-toggle .theme-icon-dark{ display:none; }
[data-theme="dark"] .gnb-theme-toggle{ color:#E9EDF0; border-color:rgba(255,255,255,.18); background:rgba(255,255,255,.06); }
[data-theme="dark"] .gnb-theme-toggle:hover{ background:rgba(255,255,255,.14); color:#fff; }
[data-theme="dark"] .gnb-theme-toggle .theme-icon-light{ display:none; }
[data-theme="dark"] .gnb-theme-toggle .theme-icon-dark{ display:inline; }

/* =============================================================
   Hero —— 文字左 · 吉祥物右
   ============================================================= */
.home-hero{
  position:relative; overflow:hidden;
  padding:90px 0 100px;
  background:
    radial-gradient(600px 360px at 70% 20%, rgba(255,140,66,.10), transparent 60%),
    radial-gradient(480px 280px at 25% 80%, rgba(255,107,26,.07), transparent 60%),
    linear-gradient(178deg, #FFFBF7 0%, #FFFFFF 55%, #FFFBF7 100%);
}

/* 背景柔和光斑（恢复后保留柔和光斑，注意 z-index 避免覆盖文字） */
.hero-blob{
  position:absolute; border-radius:50%; filter:blur(70px); pointer-events:none;
  opacity:.55; z-index:0;
}
.hero-blob-1{width:400px;height:400px;right:-60px;top:-40px;background:radial-gradient(circle,#FFE8D6 0%,transparent 70%); animation:blobDrift1 16s ease-in-out infinite;}
.hero-blob-2{width:300px;height:300px;left:5%;bottom:-30px;background:radial-gradient(circle,#FFF0E0 0%,transparent 70%); animation:blobDrift2 20s ease-in-out infinite;}
@keyframes blobDrift1{0%,100%{transform:translate(0,0) scale(1);}50%{transform:translate(-34px,22px) scale(1.12);}}
@keyframes blobDrift2{0%,100%{transform:translate(0,0) scale(1);}50%{transform:translate(28px,-20px) scale(1.1);}}

.home-hero-inner{
  position:relative; display:grid;
  grid-template-columns:1fr 1fr; gap:48px; align-items:center;
}

/* —— 左侧：文案（标准左对齐，SaaS 落地页经典布局） —— */
.hero-copy{max-width:540px; text-align:left;}
.hero-copy h1{
  font-family:var(--font-display); font-weight:900; font-size:clamp(40px,5.6vw,64px);
  line-height:1.08; letter-spacing:-.03em; color:var(--ink);
  margin:0 0 24px; text-align:left;
}
.hero-pinyin{
  display:block; font-size:18px; font-weight:800; letter-spacing:.36em;
  text-transform:uppercase; color:var(--primary); margin-bottom:10px;
}
.hero-copy h1 .hl{
  background:var(--gradient-primary);
  -webkit-background-clip:text; -webkit-text-fill-color:transparent;
  background-clip:text;
}
.hero-sub{
  font-size:19px; line-height:1.75; color:var(--muted); margin:0 0 36px; max-width:460px;
}
.hero-actions{display:flex; gap:14px; flex-wrap:wrap;}

/* —— 右侧：吉祥物 + 浮动装饰 —— */
.hero-art{
  position:relative; display:flex; justify-content:center; align-items:center; min-height:480px;
}
.hero-mascot{
  display:block; position:relative; z-index:2;
  width:340px; max-width:100%; height:auto;
  filter:drop-shadow(0 20px 40px rgba(26,26,46,.15)) drop-shadow(0 8px 16px rgba(255,107,26,.12));
  animation:mascotFloat 6s var(--ease) infinite;
  will-change:transform;
}
@keyframes mascotFloat{0%,100%{transform:translateY(0) rotate(0deg) scale(1);}50%{transform:translateY(-14px) rotate(1deg) scale(1.035);}}

/* ---- 吉祥物旁：10 个浮动标签卡片（统一小尺寸，上下左右环绕） ---- */
.float-badge{
  position:relative; z-index:4;
  display:inline-flex;align-items:center;gap:7px;
  font-family:var(--font-display);font-weight:600;font-size:12.5px;
  color:var(--primary);background:#fff;
  padding:8px 15px;border-radius:var(--radius-pill);
  border:1px solid var(--line);
  box-shadow:var(--shadow-sm);
  white-space:nowrap;
  animation:floatBadge 5s var(--ease) infinite;
}
.float-badge svg{width:14px;height:14px;flex:none;}
.float-badge.t-blue{color:var(--blue);}
.float-badge.t-orange{color:var(--primary);}
.float-badge.t-green{color:var(--green);}
.float-badge.t-purple{color:#8b5cf6;}
.float-badge.t-teal{color:#0ea5e9;}
.float-badge.t-rose{color:#ec4899;}
.float-badge.t-amber{color:#f59e0b;}
.float-badge.t-indigo{color:#6366f1;}
.float-badge.t-pink{color:#d946ef;}
.float-badge.t-emerald{color:#10b981;}

/* 环绕分布：9 个，3 顶 / 2 右 / 2 底 / 2 左，互不重叠 */
/* 10 个药丸：以吉祥物为中心，36° 一圈均匀环形分布 */
.fb-pos{
  position:absolute; z-index:4; top:50%; left:50%;
  transform:translate(-50%,-50%);
  --d:0s;
}
.fb-pos .float-badge{animation-delay:var(--d);}
/* 整圈缓慢公转：.pill-ring 正向转，.fb-spin 反向转抵消倾斜，文字始终水平 */
.pill-ring{
  position:absolute; inset:0; z-index:4;
  animation:ringOrbit 70s linear infinite;
  transform-origin:center;
}
.fb-spin{display:inline-block; animation:ringOrbitRev 70s linear infinite;}
@keyframes ringOrbit{from{transform:rotate(0deg);} to{transform:rotate(360deg);}}
@keyframes ringOrbitRev{from{transform:rotate(0deg);} to{transform:rotate(-360deg);}}
.fb-1{transform:translate(-50%,-50%) translate(0px,-225px);    --d:0s;}
.fb-2{transform:translate(-50%,-50%) translate(132px,-182px);  --d:.4s;}
.fb-3{transform:translate(-50%,-50%) translate(214px,-70px);   --d:.8s;}
.fb-4{transform:translate(-50%,-50%) translate(214px,70px);    --d:1.2s;}
.fb-5{transform:translate(-50%,-50%) translate(132px,182px);   --d:1.6s;}
.fb-6{transform:translate(-50%,-50%) translate(0px,225px);     --d:2s;}
.fb-7{transform:translate(-50%,-50%) translate(-132px,182px);  --d:2.4s;}
.fb-8{transform:translate(-50%,-50%) translate(-214px,70px);   --d:2.8s;}
.fb-9{transform:translate(-50%,-50%) translate(-214px,-70px);  --d:3.2s;}
.fb-10{transform:translate(-50%,-50%) translate(-132px,-182px); --d:3.6s;}

/* 鼠标靠近时逃逸：停掉漂浮动画，改由 JS 内联 transform 推开 */
.float-badge.fleeing{animation:none; transition:transform .3s cubic-bezier(.2,.8,.3,1); z-index:6;}

@keyframes floatBadge{0%,100%{transform:translateY(0);}50%{transform:translateY(-6px);}}

/* —— 右侧文案：左对齐（SaDuck 风格） —— */

/* —— 信任数据条（左对齐） —— */
.hero-trust{
  display:flex; gap:24px;
  margin-top:28px; padding-top:20px;
  border-top:1px solid var(--line);
}
.hero-stat{
  text-align:left;
}
.hero-stat strong{
  display:block; font-size:26px; font-weight:900; color:var(--primary);
  line-height:1.2; font-family:var(--font-display);
}
.hero-stat span{
  display:block; font-size:13px; color:var(--muted); margin-top:2px;
}

/* =============================================================
   按钮（橙色主按钮 + 圆角药丸）
   ============================================================= */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  font-family:var(--font-display); font-weight:600; font-size:15px;
  padding:14px 30px; border-radius:var(--radius-xs);
  border:2px solid transparent; cursor:pointer;
  text-decoration:none; white-space:nowrap;
  box-shadow:var(--shadow-sm);
  transition:all .25s var(--ease);
}
.btn:hover{transform:translateY(-2px); box-shadow:var(--shadow-md);}
.btn-primary{
  background:var(--gradient-primary); color:#fff; border:none;
  box-shadow:0 6px 20px -6px rgba(255,107,26,.40);
}
.btn-primary:hover{box-shadow:0 10px 30px -6px rgba(255,107,26,.50); color:#fff;}
.btn-pill{border-radius:var(--radius-pill); padding:16px 36px; font-size:16px;}
.btn-gray{background:var(--gray-100); color:var(--ink); border:1px solid var(--gray-200,#e5e7eb); box-shadow:none;}
.btn-gray:hover{background:var(--gray-200,#e5e7eb); color:var(--ink); box-shadow:var(--shadow-sm);}
.btn-ghost{
  background:transparent; color:var(--ink-2); border-color:var(--line);
}
.btn-ghost:hover{background:var(--bg-alt); color:var(--ink); border-color:rgba(0,0,0,.12);}
.btn-white{background:#fff; color:var(--primary-700); border:none;}
.btn-white:hover{box-shadow:var(--shadow-md); color:var(--primary-700);}
.btn-outline-light{
  background:transparent; color:#fff; border:2px solid rgba(255,255,255,.5);
}
.btn-outline-light:hover{background:rgba(255,255,255,.1); border-color:#fff; color:#fff;}
.btn-lg{padding:16px 36px; font-size:16px;}

/* =============================================================
   四大核心功能（图标行 · 参考图风格）
   ============================================================= */
.features-row{
  padding:70px 0 60px;
  position:relative;
}
.features-row::before{
  content:"";position:absolute;top:0;left:0;right:0;height:1px;
  background:linear-gradient(90deg, transparent, var(--line), transparent);
}
.feat-grid{
  display:grid; grid-template-columns: repeat(4, 1fr); gap:24px;
}
.feat-card{
  display:block; text-decoration:none;
  background:#fff; border:1px solid var(--line);
  border-radius:var(--radius-xl); padding:32px 24px; text-align:center;
  box-shadow:var(--shadow-sm);
  transition:transform .35s var(--ease), box-shadow .35s var(--ease), border-color .35s var(--ease);
  color:var(--ink);
}
.feat-card:hover{
  transform:translateY(-6px); box-shadow:var(--shadow-lg);
  border-color:rgba(255,107,26,.2); text-decoration:none; color:var(--ink);
}

.feat-ico{
  width:60px; height:60px; margin:0 auto 18px;
  border-radius:18px;
  display:flex; align-items:center; justify-content:center;
  transition:transform .35s var(--ease);
}
/* 四个图标不同底色 */
.feat-card:nth-child(1) .feat-ico{background:var(--blue-bg); color:var(--blue);}
.feat-card:nth-child(2) .feat-ico{background:var(--primary-050); color:var(--primary);}
.feat-card:nth-child(3) .feat-ico{background:var(--green-bg); color:var(--green);}
.feat-card:nth-child(4) .feat-ico{background:var(--gold-light); color:var(--gold);}

.feat-ico svg{width:28px;height:28px;}
.feat-card:hover .feat-ico{transform:scale(1.1) rotate(-5deg);}

.feat-card h3{
  font-family:var(--font-display); font-weight:700; font-size:17px;
  letter-spacing:-.01em; margin:0 0 8px; color:var(--ink);
}
.feat-card p{font-size:13.5px; line-height:1.65; color:var(--muted); margin:0;}

/* =============================================================
   价值主张区（左截图右文字）
   ============================================================= */
.value-section{
  padding:90px 0 96px;
  background:var(--bg-alt);
  position:relative; overflow:hidden;
}
.value-grid{
  display:grid; grid-template-columns: 1fr 1fr; gap:64px; align-items:center;
}

/* 左：三份简历叠加 */
.value-visual{
  display:flex; justify-content:center; align-items:center;
  position:relative;
}
/* 叠卡周围装饰点缀 */
.vm-deco{
  position:absolute; z-index:0;
  font-size:18px; line-height:1;
  color:var(--primary); opacity:.18;
  pointer-events:none;
  animation:decoFloat 7s ease-in-out infinite;
}
.vm-deco-1{top:4%; left:6%; animation-delay:0s; font-size:22px;}
.vm-deco-2{top:12%; right:2%; animation-delay:2s; font-size:14px; color:var(--blue);}
.vm-deco-3{bottom:8%; left:4%; animation-delay:4s; font-size:16px;}
.vm-deco-4{bottom:4%; right:8%; animation-delay:1s; font-size:10px; color:#f59e0b;}
@keyframes decoFloat{0%,100%{transform:translateY(0) rotate(0deg);}50%{transform:translateY(-10px) rotate(12deg);}}
.vm-stack{
  position:relative; width:320px; height:452px; /* A4 比例 1:1.414 */
}
.vm-layer{
  position:absolute; top:0; left:0; width:320px;
  transition:transform .55s var(--ease);
}
.vm-layer .vm-resume{
  width:100%;
  background:#fff; border:1px solid var(--line);
  border-radius:var(--radius-lg); padding:26px 24px;
  box-shadow:var(--shadow-lg);
  transition:transform .5s var(--ease), box-shadow .5s var(--ease);
  font-family:var(--font-body);
}
/* 三层错位叠加 + 持续轻微浮动（适配 A4 高度 452px） */
.vm-layer.l1{ transform:translate(26px,46px)  rotate(7deg)  scale(.9);  z-index:1; opacity:.6; }
.vm-layer.l2{ transform:translate(-22px,24px) rotate(-5deg) scale(.95); z-index:2; opacity:.82; }
.vm-layer.l3{ transform:translate(0,0)        rotate(0deg)  scale(1);   z-index:3; opacity:1; }
.vm-layer.l1 .vm-resume{ animation:stackBob 6s ease-in-out infinite;       }
.vm-layer.l2 .vm-resume{ animation:stackBob 6s ease-in-out 1.4s infinite; }
.vm-layer.l3 .vm-resume{ animation:stackBob 6s ease-in-out .7s infinite;   }
@keyframes stackBob{0%,100%{transform:translateY(0);}50%{transform:translateY(-9px);}}
/* hover 时三层散开，露出叠放关系 */
.vm-stack:hover .vm-layer.l1{ transform:translate(78px,110px) rotate(11deg) scale(.9); }
.vm-stack:hover .vm-layer.l2{ transform:translate(-64px,66px) rotate(-9deg) scale(.95); }
.vm-stack:hover .vm-layer.l3{ transform:translate(0,0)      rotate(0deg) scale(1); }
.vm-stack:hover .vm-resume{box-shadow:var(--shadow-xl);}

/* 简历头部 */
.vm-header{display:flex;align-items:center;gap:14px;margin-bottom:20px;}
.vm-avatar{
  width:48px;height:48px;border-radius:14px;background:var(--gradient-primary);
  color:#fff;font-size:18px;font-weight:900;display:flex;align-items:center;justify-content:center;
  flex-shrink:0;
}
.vm-name-block{display:flex;flex-direction:column;gap:2px;}
.vm-name{font-size:18px;font-weight:800;color:var(--ink);}
.vm-title{font-size:12.5px;color:var(--muted);}

/* 区块 */
.vm-section{margin-bottom:16px;}
.vm-section-title{
  font-size:11.5px;font-weight:700;color:var(--primary);text-transform:uppercase;
  letter-spacing:.08em;margin-bottom:8px;padding-bottom:6px;
  border-bottom:2px solid rgba(255,107,26,.12);
}

/* 标签组 */
.vm-tags{display:flex;flex-wrap:wrap;gap:6px;}
.vm-tag{
  display:inline-block;font-size:11.5px;font-weight:600;color:var(--blue);
  background:var(--blue-bg);padding:4px 10px;border-radius:var(--radius-pill);
}

/* 工作经历 */
.vm-job{margin-bottom:10px;}
.vm-job-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:3px;}
.vm-job-head strong{font-size:13.5px;font-weight:700;color:var(--ink);}
.vm-job-head span{font-size:11.5px;color:var(--muted);}
.vm-job-body{font-size:12px;color:var(--muted);line-height:1.6;}

/* 底部评分条 */
.vm-score-bar{
  display:flex;align-items:center;gap:10px;margin-top:4px;
  padding-top:14px;border-top:1px solid var(--line);
  font-size:11.5px;color:var(--muted);font-weight:600;
}
.vm-score-track{
  flex:1;height:6px;background:var(--bg-soft);border-radius:3px;overflow:hidden;
}
.vm-score-fill{
  height:100%;background:var(--gradient-primary);border-radius:3px;
  transition:width 1.2s cubic-bezier(.22,1,.36,1);
}
.vm-score-num{font-weight:800;color:var(--primary);font-size:13px;}

/* 右：文案 */
.value-copy{}
.value-copy h2{
  font-family:var(--font-display); font-weight:900; font-size:clamp(28px,3.5vw,40px);
  letter-spacing:-.03em; color:var(--ink); margin:0 0 32px; line-height:1.2;
}
.value-copy h2 .hl{
  background:var(--gradient-primary);
  -webkit-background-clip:text; -webkit-text-fill-color:transparent;
  background-clip:text;
}
.value-lead{
  margin:-16px 0 28px; max-width:440px;
  font-size:15px; line-height:1.7; color:var(--color-muted);
}

.value-items{display:flex; flex-direction:column; gap:24px;}
.value-item{
  display:flex; align-items:flex-start; gap:16px;
  padding:20px; background:#fff; border:1px solid var(--line);
  border-radius:var(--radius); box-shadow:var(--shadow-sm);
  transition:transform .3s var(--ease), box-shadow .3s var(--ease);
}
.value-item:hover{transform:translateY(-4px); box-shadow:var(--shadow-md);}

.value-item-ico{
  flex-shrink:0; width:44px; height:44px; border-radius:14px;
  display:flex; align-items:center; justify-content:center;
  background:var(--gradient-soft); color:var(--primary);
  transition:transform .3s var(--ease);
}
.value-item:hover .value-item-ico{transform:rotate(-10deg) scale(1.15);}
.value-item-ico svg{width:22px;height:22px;}
.value-item div{display:flex; flex-direction:column; gap:4px;}
.value-item strong{font-size:15px;font-weight:700;color:var(--ink);}
.value-item span{font-size:13.5px;color:var(--muted);line-height:1.5;}

/* =============================================================
   使用三步
   ============================================================= */
.how-section{padding:90px 0 80px; position:relative;}
.how-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:28px;}
.how-card{
  position:relative; background:#fff; border:1px solid var(--line);
  border-radius:var(--radius-xl); padding:36px 30px 32px;
  box-shadow:var(--shadow-sm);
  transition:transform .35s var(--ease), box-shadow .35s var(--ease), border-color .35s var(--ease);
}
.how-card:hover{transform:translateY(-6px); box-shadow:var(--shadow-lg); border-color:rgba(255,107,26,.2);}
.how-step-no{
  font-family:var(--font-display); font-weight:900; font-size:44px; line-height:1;
  background:var(--gradient-primary); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
  margin-bottom:16px; opacity:.9;
}
.how-ico{
  width:54px;height:54px;border-radius:16px; margin-bottom:18px;
  display:flex;align-items:center;justify-content:center;
  background:var(--gradient-soft); color:var(--primary);
}
.how-ico svg{width:26px;height:26px;}
.how-card h3{font-family:var(--font-display);font-weight:700;font-size:19px;letter-spacing:-.01em;margin:0 0 10px;color:var(--ink);}
.how-card p{font-size:14.5px;line-height:1.7;color:var(--muted);margin:0;}

/* =============================================================
   信任数据条
   ============================================================= */
.stats-band{padding:8px 0;}
.stats-inner{
  display:grid; grid-template-columns:repeat(4,1fr); gap:1px;
  background:var(--line); border:1px solid var(--line); border-radius:var(--radius-xl);
  overflow:hidden; box-shadow:var(--shadow-sm);
}
.stat-cell{background:var(--bg-alt); padding:40px 24px; text-align:center; transition:background .3s var(--ease);}
.stat-cell:hover{background:#fff;}
.stat-big{
  font-family:var(--font-display); font-weight:900; font-size:40px; letter-spacing:-.02em;
  background:var(--gradient-primary); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
  margin-bottom:6px;
}
.stat-cap{font-size:14px;color:var(--muted);font-weight:500;}
/* 小数部分（小数点+小数位）小一档，让 10.00+ / 4.9 这种数字视觉更精致 */
.stat-big .stat-decimal{
  font-size:.55em; font-weight:900; opacity:.78;
  vertical-align:baseline; margin-left:0;
}

/* =============================================================
   用户评价
   ============================================================= */
.reviews-section{padding:90px 0 80px;}
.review-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
.review-card{
  position:relative; overflow:hidden;
  background:#fff; border:1px solid var(--line); border-radius:var(--radius-xl);
  padding:32px 28px 28px; box-shadow:var(--shadow-sm);
  transition:transform .4s var(--ease), box-shadow .4s var(--ease), border-color .4s var(--ease);
}
/* 顶部渐变高亮线（默认隐藏，hover 时展开） */
.review-card::before{
  content:"";
  position:absolute; top:0; left:0; right:0; height:3px;
  background:var(--gradient-primary);
  transform:scaleX(0); transform-origin:left center;
  transition:transform .45s var(--ease);
}
/* 大引号背景装饰 */
.review-card::after{
  content:"\201C";
  position:absolute; top:-12px; right:18px;
  font-family:Georgia,serif;
  font-size:96px; line-height:1; color:var(--primary);
  opacity:0; transition:opacity .4s var(--ease), transform .4s var(--ease);
  pointer-events:none;
}
.review-card:hover{
  transform:translateY(-10px);
  box-shadow:0 24px 50px -16px rgba(255,107,26,.28), 0 8px 20px -8px rgba(0,0,0,.06);
  border-color:rgba(255,107,26,.35);
}
.review-card:hover::before{ transform:scaleX(1); }
.review-card:hover::after{ opacity:.12; transform:translateY(6px); }
.review-stars{
  color:var(--gold); font-size:15px; letter-spacing:2px; margin-bottom:16px;
  display:inline-flex; gap:2px;
  transition:transform .35s var(--ease);
}
.review-card:hover .review-stars{ transform:scale(1.08); filter:drop-shadow(0 2px 6px rgba(245,166,35,.45)); }
.review-stars i{ font-style:normal; }
.review-card p{font-size:15px; line-height:1.75; color:var(--ink-2); margin:0 0 24px; position:relative; z-index:1;}
.review-author{display:flex; align-items:center; gap:12px; position:relative; z-index:1;}
.review-avatar{
  flex-shrink:0; width:42px;height:42px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:var(--gradient-primary); color:#fff; font-weight:700; font-size:16px;
}
.review-author div{display:flex;flex-direction:column;}
.review-author strong{font-size:14.5px;color:var(--ink);font-weight:700;}
.review-author span{font-size:12.5px;color:var(--muted);}

/* =============================================================
   FAQ 手风琴
   ============================================================= */
.faq-section{padding:0 0 90px;}
.faq-list{max-width:760px;margin:0 auto;display:flex;flex-direction:column;gap:14px;}
.faq-item{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  overflow:hidden;transition:border-color .3s var(--ease),box-shadow .3s var(--ease);
}
.faq-item.open{border-color:rgba(255,107,26,.35);box-shadow:var(--shadow-md);}
.faq-q{
  width:100%;display:flex;align-items:center;justify-content:space-between;gap:16px;
  background:none;border:none;cursor:pointer;text-align:left;
  padding:22px 26px;font-family:var(--font-display);font-weight:600;font-size:16px;color:var(--ink);
}
.faq-q .faq-ico{flex-shrink:0;color:var(--primary);transition:transform .35s var(--ease);}
.faq-item.open .faq-q .faq-ico{transform:rotate(180deg);}
.faq-a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .35s var(--ease);}
/* 折叠态：内层 padding 0，答案完全不可见（保留一行也不显示） */
.faq-a-inner{overflow:hidden;padding:0 26px;font-size:15px;line-height:1.75;color:var(--muted);transition:padding-bottom .35s var(--ease);}
.faq-item.open .faq-a{grid-template-rows:1fr;}
/* 展开态：底部留 36px，使答案整体呼吸感舒适，不贴下边框 */
.faq-item.open .faq-a-inner{padding-bottom:36px;}

/* =============================================================
   简历范文卡片：高级重设计（横向布局 + 缩略图渐变 + 悬浮标签）
   ============================================================= */
.sample-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:24px;
}
@media (max-width:960px){
  .sample-grid{ grid-template-columns:repeat(2, 1fr); }
}
@media (max-width:640px){
  .sample-grid{ grid-template-columns:1fr; }
}
.sample-card{
  position:relative; overflow:hidden;
  display:flex; flex-direction:column;          /* 缩略图在上、body 在下 */
  background:#fff; border:1px solid var(--line);
  border-radius:18px; box-shadow:0 2px 8px -3px rgba(20,30,50,.06);
  transition:transform .4s var(--ease), box-shadow .4s var(--ease), border-color .4s var(--ease);
}
.sample-card::before{
  content:"";
  position:absolute; top:0; left:0; right:0; height:3px;
  background:var(--gradient-primary);
  transform:scaleX(0); transform-origin:left center;
  transition:transform .5s var(--ease);
  z-index:2;
}
.sample-card:hover{
  transform:translateY(-6px);
  box-shadow:0 24px 50px -16px rgba(255,107,26,.22), 0 6px 16px -8px rgba(0,0,0,.05);
  border-color:rgba(255,107,26,.30);
}
.sample-card:hover::before{ transform:scaleX(1); }

/* 上：缩略图区域 —— v7.0 严格 A4 比例渲染，不限制 max-height
   v7.2：与模板一致——浅灰底（白纸更突出）+ 6px 内边距（让纸面"浮"在容器里）
   + 10mm 纸内留白（清晰可见的页面边距）+ 纸面微阴影（让"一页纸"感更强）*/
.sample-card .wc-a4-thumb{
  position:relative;
  width:100%;
  aspect-ratio:210/297;                         /* A4 = 1:1.414，正比锁死 */
  overflow:hidden;
  background:linear-gradient(135deg, #FAFAFA 0%, #F0F0F0 100%);
  display:flex; align-items:flex-start; justify-content:center;
  border-radius:0 !important;
  border:none !important;
  box-shadow:none !important;
  margin:0 !important;
  padding:6px;
  box-sizing:border-box;
}
.sample-card .wc-a4-thumb::before{
  content:"";
  position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(255,107,26,0) 70%, rgba(255,107,26,.10) 100%);
  z-index:2; pointer-events:none;
}
/* A4 纸：宽度 100% 填满缩略图，自动高度按 A4 比例 1.414，超出部分 overflow 切掉 */
.sample-card .wc-a4-thumb > .resume-paper{
  transform:none !important;
  width:100% !important;
  height:auto !important;
  min-height:100% !important;
  max-width:none !important;
  margin:0 !important;
  padding:10mm !important;                             /* v7.2：8mm → 10mm 留白更明显 */
  font-size:8.5px !important;                          /* v7.2：略缩字号 */
  border-radius:0 !important;
  box-shadow:0 4px 14px rgba(0,0,0,.10), 0 1px 3px rgba(0,0,0,.06) !important; /* v7.2：纸面抬起 */
  background:#fff !important;
}
/* v7.3：缩略图里头像随字号等比缩放（8.5px 字号下，em 单位保证头像与正文同比例）
   原 .preview-photo 在 styles.css 硬编码 72×96px，在 8.5px 字号下肉眼过大；改 em 单位后
   真实尺寸 ≈ 48×64px，与正文「姓名旁一个头像」的真实简历观感一致。*/
.sample-card .wc-a4-thumb > .resume-paper .preview-photo{
  width:5.5em !important;
  height:7em !important;
  max-width:none;
}
.sample-card .wc-a4-thumb > .resume-paper .preview-photo[data-shape="circle"]{
  width:7em !important;
  height:7em !important;
}
.sample-card:hover .wc-a4-thumb{ transform:none; }

/* 行业分类 badge：作为 body 顶部 chip（缩略图在上、body 在下时不再浮层） */
.sample-card .sample-cover-badge{
  position:static !important;
  display:block !important;
  margin-bottom:2px;
  top:auto !important; bottom:auto !important; left:auto !important; right:auto !important;
  z-index:auto !important;
}
.sample-card .sample-cover-badge .tag{
  font-size:11px; font-weight:700; letter-spacing:.04em;
  padding:5px 11px; border-radius:999px;
  background:rgba(255,107,26,.10) !important;
  color:var(--primary) !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
}
.sample-card .sample-cover-badge .tag-blue,
.sample-card .sample-cover-badge .tag-green,
.sample-card .sample-cover-badge .tag-red,
.sample-card .sample-cover-badge .tag-yellow{ background:rgba(255,107,26,.10) !important; color:var(--primary) !important; }

/* 右：内容区 */
.sample-body{
  padding:24px 26px;
  display:flex; flex-direction:column; gap:10px;
}
.sample-body h3{
  font-family:var(--font-display); font-weight:700;
  font-size:18px; color:var(--ink);
  line-height:1.35; margin:0;
}
.sample-meta{
  font-size:12.5px; color:var(--muted); margin:0 !important;
  display:flex; align-items:center; gap:8px;
}
.sample-meta::before{
  content:""; width:18px; height:1px; background:var(--primary);
}
.sample-body p{
  font-size:14px; line-height:1.65; color:var(--ink-2);
  margin:0 !important; flex:1;
  /* 描述不再 line-clamp 截断，让 1-2 行短描述自然完整显示 */
  overflow:visible; display:block;
}
.sample-body > div:not(.sample-meta){
  display:flex; gap:6px; flex-wrap:wrap; margin:0 !important;
}
.sample-body .tag-sm{
  font-size:11.5px; padding:3px 9px; border-radius:6px;
  background:rgba(255,107,26,.08); color:var(--primary);
  font-weight:600;
}
.sample-body .btn{ margin-top:4px; width:100%; }

/* 小屏：缩略图改到顶部，body 落到下方 */
@media (max-width:640px){
  .sample-grid{ grid-template-columns:1fr; }
  .sample-card{ grid-template-columns:1fr; }
  .sample-card .wc-a4-thumb{ aspect-ratio:16/9; max-height:200px; }
}

/* 暗色 */
[data-theme="dark"] .sample-card{ background:rgba(22,28,36,.7); border-color:rgba(255,255,255,.08); }
[data-theme="dark"] .sample-card .wc-a4-thumb{ background:linear-gradient(135deg, rgba(255,255,255,.06) 0%, rgba(255,255,255,.02) 100%); }
[data-theme="dark"] .sample-body h3{ color:#fff; }
[data-theme="dark"] .sample-body p{ color:rgba(255,255,255,.7); }

/* =============================================================
   简历模板卡片：与简历范文统一布局（缩略图在上、3 列、A4 填满）
   ============================================================= */
.template-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:24px;
}
@media (max-width:960px){
  .template-grid{ grid-template-columns:repeat(2, 1fr); }
}
@media (max-width:640px){
  .template-grid{ grid-template-columns:1fr; }
}
.template-card{
  position:relative; overflow:hidden;
  display:flex; flex-direction:column;
  background:#fff; border:1px solid var(--line);
  border-radius:18px; box-shadow:0 2px 8px -3px rgba(20,30,50,.06);
  transition:transform .4s var(--ease), box-shadow .4s var(--ease), border-color .4s var(--ease);
}
.template-card::before{
  content:"";
  position:absolute; top:0; left:0; right:0; height:3px;
  background:var(--gradient-primary);
  transform:scaleX(0); transform-origin:left center;
  transition:transform .5s var(--ease);
  z-index:2;
}
.template-card:hover{
  transform:translateY(-6px);
  box-shadow:0 24px 50px -16px rgba(255,107,26,.22), 0 6px 16px -8px rgba(0,0,0,.05);
  border-color:rgba(255,107,26,.30);
}
.template-card:hover::before{ transform:scaleX(1); }

/* 模板缩略图：与 sample 一致，A4 填满 —— v7.0 同上取消 max-height
   v7.2：让 A4 页面"独立可见"——浅灰底（让白纸更突出）+ 纸内 padding 加到 10mm（清晰留白）
   + 纸面微阴影，让"一页纸"感更强（而不是"铺满"的色块） */
.template-card .wc-a4-thumb{
  position:relative; width:100%;
  aspect-ratio:210/297;
  overflow:hidden;
  background:linear-gradient(135deg, #FAFAFA 0%, #F0F0F0 100%);
  display:flex; align-items:flex-start; justify-content:center;
  border-radius:0 !important; border:none !important; box-shadow:none !important; margin:0 !important;
  padding:6px;
  box-sizing:border-box;
}
.template-card .wc-a4-thumb::before{
  content:"";
  position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(255,107,26,0) 70%, rgba(255,107,26,.10) 100%);
  z-index:2; pointer-events:none;
}
.template-card .wc-a4-thumb > .resume-paper{
  transform:none !important;
  width:100% !important; height:auto !important; min-height:100% !important;
  max-width:none !important; margin:0 !important;
  padding:10mm !important;                              /* v7.2：8mm → 10mm 留白更明显 */
  font-size:8.5px !important;                           /* v7.2：略缩字号，确保单页可视范围 */
  border-radius:0 !important;
  box-shadow:0 4px 14px rgba(0,0,0,.10), 0 1px 3px rgba(0,0,0,.06) !important; /* v7.2：纸面抬起感 */
  background:#fff !important;
}
/* v7.3：模板缩略图头像同上——em 单位跟随字号（见 sample 注释） */
.template-card .wc-a4-thumb > .resume-paper .preview-photo{
  width:5.5em !important; height:7em !important; max-width:none;
}
.template-card .wc-a4-thumb > .resume-paper .preview-photo[data-shape="circle"]{
  width:7em !important; height:7em !important;
}

.template-card-body{ padding:24px 26px; display:flex; flex-direction:column; gap:10px; }
.template-card-body h3{
  font-family:var(--font-display); font-weight:700;
  font-size:18px; color:var(--ink); line-height:1.35; margin:0;
}
.template-card-body p{
  font-size:14px; line-height:1.65; color:var(--ink-2);
  margin:0 !important; flex:1;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.template-card-body .template-tags{
  display:flex; gap:6px; flex-wrap:wrap; margin:0 !important;
}
.template-card-body .tag-sm{
  font-size:11.5px; padding:3px 9px; border-radius:6px;
  background:rgba(255,107,26,.08); color:var(--primary);
  font-weight:600;
}
.template-card-footer{
  display:flex; align-items:center; justify-content:space-between; gap:8px;
  margin-top:6px;
}
.template-card-footer .btn{ flex:1; }

/* 暗色模板卡 */
[data-theme="dark"] .template-card{ background:rgba(22,28,36,.7); border-color:rgba(255,255,255,.08); }
[data-theme="dark"] .template-card .wc-a4-thumb{ background:linear-gradient(135deg, rgba(255,255,255,.06) 0%, rgba(255,255,255,.02) 100%); }
[data-theme="dark"] .template-card-body h3{ color:#fff; }
[data-theme="dark"] .template-card-body p{ color:rgba(255,255,255,.7); }

/* =============================================================
   求职工具 service-card：主色统一为橙色（覆盖样式表的蓝/绿/红/黄）
   ============================================================= */
.service-card-icon{ background:rgba(255,107,26,.12) !important; color:var(--primary) !important; }
.service-card-icon.blue,
.service-card-icon.red,
.service-card-icon.yellow,
.service-card-icon.green{ background:rgba(255,107,26,.12) !important; color:var(--primary) !important; }

/* 求职工具卡：浅底 + 主色描边 + hover 主色光晕（与范文/模板卡片风格一致） */
.service-card{
  position:relative; overflow:hidden;
  background:#fff; border:1px solid var(--line);
  border-radius:18px; padding:32px 28px;
  display:flex; flex-direction:column; gap:14px;
  box-shadow:0 2px 8px -3px rgba(20,30,50,.06);
  transition:transform .4s var(--ease), box-shadow .4s var(--ease), border-color .4s var(--ease);
}
.service-card::before{
  content:"";
  position:absolute; top:0; left:0; right:0; height:3px;
  background:var(--gradient-primary);
  transform:scaleX(0); transform-origin:left center;
  transition:transform .5s var(--ease);
  z-index:2;
}
.service-card:hover{
  transform:translateY(-6px);
  box-shadow:0 24px 50px -16px rgba(255,107,26,.22), 0 6px 16px -8px rgba(0,0,0,.05);
  border-color:rgba(255,107,26,.30);
}
.service-card:hover::before{ transform:scaleX(1); }
.service-card h3{
  font-family:var(--font-display); font-weight:700;
  font-size:18px; color:var(--ink); line-height:1.35; margin:0;
}
.service-card > p{
  font-size:14px; line-height:1.7; color:var(--ink-2);
  margin:0 !important; flex:1;
  display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;
}
.service-card-footer{
  display:flex; align-items:center; justify-content:space-between; gap:8px;
  padding-top:14px; border-top:1px solid var(--line);
}
.service-price{
  font-size:12px; font-weight:700; color:var(--primary);
  background:rgba(255,107,26,.10); padding:4px 10px; border-radius:999px;
}
.service-card .btn{ flex:1; }
[data-theme="dark"] .service-card{ background:rgba(22,28,36,.7); border-color:rgba(255,255,255,.08); }
[data-theme="dark"] .service-card h3{ color:#fff; }
[data-theme="dark"] .service-card > p{ color:rgba(255,255,255,.7); }
[data-theme="dark"] .service-card-footer{ border-top-color:rgba(255,255,255,.08); }
[data-theme="dark"] .sample-card:hover{ box-shadow:0 24px 50px -16px rgba(255,107,26,.35), 0 6px 16px -8px rgba(0,0,0,.3); }

/* =============================================================
   最终 CTA
   ============================================================= */
.cta-section{padding:0 0 96px;}
.cta-card{
  position:relative;overflow:hidden;text-align:center;
  background:linear-gradient(135deg, #FFB067 0%, #FF8C42 48%, #FF6B1A 100%);
  border-radius:var(--radius-xl);
  padding:64px 32px;box-shadow:0 24px 60px -20px rgba(255,107,26,.5);
}
.cta-glow{
  position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(420px 220px at 50% -20%, rgba(255,255,255,.28), transparent 70%);
}
.cta-card h2{
  position:relative;font-family:var(--font-display);font-weight:900;font-size:clamp(28px,3.6vw,42px);
  letter-spacing:-.03em;color:#fff;margin:0 0 16px;line-height:1.2;
}
.cta-card p{position:relative;font-size:17px;line-height:1.7;color:rgba(255,255,255,.92);margin:0 0 32px;}
.cta-actions{position:relative;display:flex;gap:14px;justify-content:center;flex-wrap:wrap;}

/* =============================================================
   区块标题（保留供其他页面使用）
   ============================================================= */
.section-header{text-align:center; max-width:620px; margin:0 auto 52px;}
.section-header .eyebrow{
  display:inline-block; letter-spacing:.12em; text-transform:uppercase;
  font-size:12px; font-weight:700; color:var(--primary);
  background:var(--gradient-soft); padding:6px 16px; border-radius:var(--radius-pill);
  margin-bottom:16px;
}
.section-header h2{
  font-family:var(--font-display); font-weight:800; font-size:clamp(28px,3.5vw,40px);
  letter-spacing:-.03em; color:var(--ink); margin:0 0 14px; line-height:1.2;
}
.section-header p{font-size:17px; color:var(--muted); line-height:1.65; margin:0;}

/* =============================================================
   Footer
   ============================================================= */
footer{
  background:#1A1A2E; color:rgba(255,255,255,.65);
  padding:64px 0 32px;
}
.footer-grid{
  display:grid; grid-template-columns:1.5fr 1fr 1fr 1fr; gap:40px; margin-bottom:48px;
}
.footer-brand h4{font-family:var(--font-display); font-weight:800; font-size:20px; color:#fff; margin:0 0 12px;}
.footer-brand p{font-size:14px; line-height:1.7; margin:0; opacity:.7;}
.footer-links h5{font-family:var(--font-display); font-weight:700; font-size:14px; color:rgba(255,255,255,.9); margin:0 0 16px; text-transform:uppercase; letter-spacing:.08em;}
.footer-links a{display:block; color:rgba(255,255,255,.55); font-size:14px; padding:5px 0; transition:color .2s;}
.footer-links a:hover{color:#fff;}
.footer-bottom{border-top:1px solid rgba(255,255,255,.08); padding-top:24px; text-align:center; font-size:13px; opacity:.5;}

/* =============================================================
   响应式
   ============================================================= */
@media (max-width:960px){
  .home-hero-inner{grid-template-columns:1fr;gap:40px;}
  .hero-art{min-height:380px; order:-1; transform:scale(.72); transform-origin:center;}
  .hero-mascot{width:280px;}
  .feat-grid{grid-template-columns:repeat(2,1fr); gap:18px;}
  .value-grid{grid-template-columns:1fr; gap:40px;}
  .value-visual{order:-1;}
  .vm-stack{transform:scale(.92); transform-origin:top center;}
  .vm-deco{display:none;}
  .footer-grid{grid-template-columns:1fr 1fr; gap:32px;}
  .how-grid{grid-template-columns:1fr; gap:18px;}
  .review-grid{grid-template-columns:1fr;}
  .stats-inner{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:600px){
  .gnb-inner{padding:0 16px; height:56px;}
  .gnb-logo span{display:none;}
  .gnb-links a{padding:6px 10px; font-size:13.5px;}
  .feat-grid{grid-template-columns:1fr 1fr; gap:14px;}
  .feat-card{padding:24px 18px;}
  .home-hero{padding:56px 0 64px;}
  .float-badge{display:none;}
  .features-row{padding:48px 0 40px;}
  .value-section{padding:56px 0 64px;}
  .value-item{padding:16px; flex-direction:column; align-items:center; text-align:center;}
  .hero-trust{gap:20px; margin-top:20px; padding-top:16px;}
  .hero-stat strong{font-size:18px;}
  .vm-stack{transform:scale(.82); transform-origin:top center;}
  .footer-grid{grid-template-columns:1fr; gap:28px;}
  .stat-big{font-size:32px;}
  .review-grid{grid-template-columns:1fr;}
  .how-section,.reviews-section{padding:56px 0 48px;}
  .faq-section,.cta-section{padding:0 0 56px;}
  .btn-pill{padding:14px 28px; font-size:15px;}
}

/* =============================================================
   Dark Mode
   ============================================================= */
[data-theme="dark"]{
  --ink:       #e8ecf0;
  --ink-2:     #9aa5b1;
  --muted:     #6b7a8a;
  --line:      rgba(255,255,255,.08);
  --line-2:    rgba(255,255,255,.04);
  --bg:        #0f1318;
  --bg-alt:    #161c24;
  --bg-soft:   rgba(255,107,26,.10);

  --primary-050: rgba(255,107,26,.15);
  --gradient-soft: linear-gradient(135deg, rgba(255,107,26,.10) 0%, rgba(255,140,66,.06) 100%);
  --blue-bg: rgba(74,144,217,.12);
  --green-bg: rgba(52,199,89,.10);
  --gold-light: rgba(245,166,35,.10);
}
[data-theme="dark"] .gnb{background:rgba(15,19,24,.85); border-bottom-color:rgba(255,255,255,.06);}
[data-theme="dark"] .feat-card{background:rgba(22,28,36,.6); border-color:rgba(255,255,255,.07);}
[data-theme="dark"] .value-section{background:rgba(15,19,24,.5);}
[data-theme="dark"] .vm-resume{background:rgba(22,28,36,.85); border-color:rgba(255,255,255,.10); box-shadow:0 6px 24px rgba(0,0,0,.35);}
[data-theme="dark"] .vm-resume .vm-name{color:#F2F5F8;}
[data-theme="dark"] .vm-resume .vm-section-title{color:rgba(255,140,66,.85);}
/* v6.9·修：暗色下叠加层从 l1:0/l2:.30 提到 l1:.18/l2:.55，让左侧三份简历动画明显 */
[data-theme="dark"] .vm-layer.l1{ opacity:.18; }
[data-theme="dark"] .vm-layer.l2{ opacity:.55; }
/* v6.9·修：暗色下隐藏所有装饰字符（包括被误认作"竖线"的 deco-1/3） */
[data-theme="dark"] .vm-deco{ display:none; }
/* 暗色下 hover 偏移量收敛，避免偏出露出边框/阴影被误认为"竖线" */
[data-theme="dark"] .vm-stack:hover .vm-layer.l1{ transform:translate(46px,80px) rotate(8deg) scale(.85); opacity:.28; }
[data-theme="dark"] .vm-stack:hover .vm-layer.l2{ transform:translate(-40px,50px) rotate(-7deg) scale(.92); opacity:.7; }
[data-theme="dark"] .value-item{background:rgba(22,28,36,.7); border-color:rgba(255,255,255,.07);}
[data-theme="dark"] .how-card{background:rgba(22,28,36,.6); border-color:rgba(255,255,255,.07);}
[data-theme="dark"] .stat-cell{background:rgba(22,28,36,.6);}
[data-theme="dark"] .stat-cell:hover{background:rgba(255,255,255,.04);}
[data-theme="dark"] .review-card{background:rgba(22,28,36,.6); border-color:rgba(255,255,255,.07);}
[data-theme="dark"] .faq-item{background:rgba(22,28,36,.6); border-color:rgba(255,255,255,.07);}
[data-theme="dark"] .review-author strong{color:#fff;}
[data-theme="dark"] footer{background:#0a0d12;}
[data-theme="dark"] .btn-ghost{border-color:rgba(255,255,255,.1); color:rgba(255,255,255,.7);}
[data-theme="dark"] .btn-ghost:hover{background:rgba(255,255,255,.06); color:#fff;}

/* =============================================================
   暗色模式 — 主题变量重映射 + 首页组件补充
   theme-friendly 自有变量(--ink/--muted/--bg-alt/--line 等)在暗色下
   需重映射，否则文字/边框/卡片在暗背景下不可读（此前只覆盖了背景，漏了文字）。
   ============================================================= */
[data-theme="dark"]{
  --ink:    #E9EDF0;
  --ink-2:  #C7D0D9;
  --muted:  #93A1B0;
  --line:   #2A3543;
  --line-2: #1A2330;
  --bg:     #0E1621;
  --bg-alt: #17212B;
  --bg-soft:#1A2330;
  /* 暗色下去掉浅色阴影里的橙色分量，避免卡片周围发橙光（保留 stat-cell 橙顶条 / review-card 橙描边等有意效果） */
  --shadow-lg: 0 12px 32px -8px rgba(0,0,0,.45), 0 24px 48px -12px rgba(0,0,0,.35);
  --shadow-xl: 0 20px 48px -12px rgba(0,0,0,.50), 0 40px 80px -20px rgba(0,0,0,.40);
}
/* Hero：暗色下改深色渐变，避免亮色孤岛 */
[data-theme="dark"] .home-hero{
  background:linear-gradient(180deg, #16202c 0%, #101820 55%, #0e1621 100%);
}
/* 浮动标签卡片：暗色下深色面板 */
[data-theme="dark"] .float-badge{
  background:rgba(22,28,36,.92);
  border-color:rgba(255,255,255,.10);
  box-shadow:0 2px 8px rgba(0,0,0,.35);
}
/* 统计区 hover：品牌橙顶条 + 数字微放大（与用户口碑卡片统一动效语言） */
.stat-cell{transition:background .3s var(--ease), box-shadow .3s var(--ease);}
.stat-cell:hover{background:var(--bg-soft);}
.stat-cell .stat-big{transition:transform .3s var(--ease);}
.stat-cell:hover .stat-big{transform:scale(1.07);}
/* 用户口碑卡片 hover 增加品牌橙描边，与统计区统一 */
.review-card:hover{border-color:rgba(255,107,26,.35);}
/* FAQ 标题强制居中（「你可能想知道的」/「关于免费…」） */
.faq-section .section-header{text-align:center; margin-left:auto; margin-right:auto;}
.faq-section .section-header h2,
.faq-section .section-header p{text-align:center;}
.faq-section .section-header p{display:block; max-width:560px; margin-left:auto; margin-right:auto;}

/* Page hero 内的 eyebrow 一律用站点主色（橙）—— v7.0 按用户指示统一全橙 */
.page-hero .section-eyebrow{
  color:var(--primary); background:rgba(255,107,26,.10);
}

/* 4 色装饰条 — hero 下方主题色（4 种不同的彩色：蓝/红/黄/绿） */
.color-bar span:nth-child(1){background:#4285F4;}
.color-bar span:nth-child(2){background:#EA4335;}
.color-bar span:nth-child(3){background:#FBBC04;}
.color-bar span:nth-child(4){background:#34A853;}

/* 待开发状态 pill（WangCai Skill / 面试攻略 等 coming-soon 页） */
.wc-soon-section{
  padding:60px 0 100px;
  display:flex; justify-content:center;
}
.wc-soon-card{
  display:flex; flex-direction:column; align-items:center; text-align:center; gap:18px;
  max-width:540px; width:100%;
  padding:48px 32px;
  background:#fff; border:1px solid var(--line);
  border-radius:20px; box-shadow:0 10px 30px -12px rgba(20,30,50,.08);
}
.wc-soon-desc{
  font-size:15px; line-height:1.75; color:var(--muted);
  margin:0; max-width:420px;
}
[data-theme="dark"] .wc-soon-card{ background:rgba(22,28,36,.7); border-color:rgba(255,255,255,.08); }
[data-theme="dark"] .wc-soon-desc{ color:rgba(255,255,255,.6); }

/* =============================================================
   减少动效偏好（无障碍）
   ============================================================= */
@media (prefers-reduced-motion:reduce){
  *, *::before, *::after{animation-duration:.001ms!important; transition-duration:.001ms!important;}
}

/* =============================================================
   选简历中转弹窗（范文/模板「使用」按钮弹出）
   ============================================================= */
.wc-pick-list{
  display:flex; flex-direction:column; gap:8px;
  max-height:340px; overflow-y:auto;
  margin:8px 0 14px;
  padding:2px;
}
.wc-pick-item{
  display:flex; align-items:center; gap:12px;
  padding:12px 14px;
  background:var(--bg-alt);
  border:1px solid transparent;
  border-radius:10px;
  cursor:pointer;
  font-family:inherit; font-size:14px; text-align:left;
  color:var(--ink);
  transition:background .2s var(--ease), border-color .2s var(--ease), transform .15s var(--ease);
}
.wc-pick-item:hover{
  background:#fff;
  border-color:rgba(255,107,26,.35);
  transform:translateX(2px);
}
.wc-pick-item-name{ font-weight:600; flex:1; min-width:0; }
.wc-pick-item-meta{ font-size:12px; color:var(--muted); }
.wc-pick-item-go{ font-size:12px; color:var(--primary); font-weight:700; opacity:0; transition:opacity .2s var(--ease); }
.wc-pick-item:hover .wc-pick-item-go{ opacity:1; }

.wc-pick-create{
  display:flex; align-items:center; justify-content:center; gap:8px;
  width:100%;
  padding:12px 16px;
  background:transparent;
  border:1.5px dashed rgba(255,107,26,.45);
  border-radius:10px;
  cursor:pointer;
  font-family:inherit; font-size:14px; font-weight:600;
  color:var(--primary);
  transition:background .2s var(--ease), border-color .2s var(--ease);
}
.wc-pick-create:hover{
  background:rgba(255,107,26,.06);
  border-color:var(--primary);
}
.wc-pick-create-plus{
  display:inline-flex; align-items:center; justify-content:center;
  width:20px; height:20px; border-radius:50%;
  background:var(--primary); color:#fff;
  font-size:14px; font-weight:700; line-height:1;
}

/* 暗色 */
[data-theme="dark"] .wc-pick-item{ background:rgba(255,255,255,.04); color:#E9EDF0; }
[data-theme="dark"] .wc-pick-item:hover{ background:rgba(255,107,26,.12); border-color:rgba(255,107,26,.45); }
[data-theme="dark"] .wc-pick-item-meta{ color:#9aa3ad; }
[data-theme="dark"] .wc-pick-create{ border-color:rgba(255,107,26,.4); color:#FF9A5C; }
[data-theme="dark"] .wc-pick-create:hover{ background:rgba(255,107,26,.12); border-color:#FF9A5C; }