/* ============================================================
   PDF Expert · Aurora 极光主题 (pdf-expert.com)
   叠加在 common.css 之上，仅做配色/卡片/装饰增强
   主调：红 (品牌) + 深靛紫 #5B47E0 (辅) + 青柠 #22D3A8 (点缀)
   ============================================================ */

:root {
  /* —— 辅色切换为深靛紫 + 加入青柠点缀 —— */
  --c-accent:        #5B47E0;
  --c-accent-dark:   #3F2BC9;
  --c-accent-2:      #22D3A8;
  --c-accent-2-dark: #0FB48C;

  /* —— 阴影更柔，新增极光辉光 —— */
  --shadow-sm: 0 4px 14px rgba(15, 17, 26, .04);
  --shadow-md: 0 14px 36px rgba(15, 17, 26, .07);
  --shadow-lg: 0 28px 64px rgba(15, 17, 26, .10);
  --glow-primary: 0 14px 36px rgba(248, 40, 44, .22);
  --glow-accent:  0 14px 36px rgba(91, 71, 224, .22);
  --glow-accent2: 0 14px 36px rgba(34, 211, 168, .22);
}

/* ============================================================
   Body 极光背景 — 极淡的双色光晕，固定不滚动
   ============================================================ */
body {
  background:
    radial-gradient(900px 620px at 90% -8%, rgba(91, 71, 224, .08), transparent 60%),
    radial-gradient(800px 600px at -8% 60%, rgba(34, 211, 168, .07), transparent 60%),
    radial-gradient(700px 500px at 50% 110%, rgba(248, 40, 44, .05), transparent 65%),
    #ffffff;
  background-attachment: fixed;
}

::selection { background: rgba(91, 71, 224, .25); color: #1d1d1f; }

/* ============================================================
   极光顶部光带 — 极简的彩色条，浮在 header 顶部
   ============================================================ */
body::before {
  content: "";
  position: fixed; top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg,
    #F8282C 0%, #FF6A45 22%,
    #5B47E0 50%,
    #22D3A8 78%, #3674FF 100%);
  background-size: 200% 100%;
  z-index: 2000;
  animation: aurora-flow 9s ease-in-out infinite;
  pointer-events: none;
}
@keyframes aurora-flow {
  0%, 100% { background-position: 0% 50%; }
  50%      { background-position: 100% 50%; }
}

/* ============================================================
   Header — 把 active 菜单的强红色渐变换为靛紫渐变
   ============================================================ */
.nav-menu a.active {
  background: linear-gradient(135deg, #6B5BFF 0%, #5B47E0 60%, #4936C9 100%) !important;
  box-shadow:
    0 1px 0 rgba(255,255,255,.4) inset,
    0 8px 22px rgba(91, 71, 224, .35) !important;
}

/* 语言激活态使用同色系 */
.lang-item.active {
  background: linear-gradient(135deg, #6B5BFF 0%, #5B47E0 100%) !important;
}
.lang-item.active .lang-label,
.lang-item.active .lang-sub,
.lang-item.active .check { color: #fff !important; }

/* ============================================================
   按钮 — 主按钮加柔和辉光；新增 accent2 (青柠) 类
   ============================================================ */
.btn-primary {
  box-shadow:
    0 1px 0 rgba(255,255,255,.35) inset,
    var(--glow-primary) !important;
}
.btn-primary:hover { box-shadow: 0 1px 0 rgba(255,255,255,.4) inset, 0 18px 44px rgba(248,40,44,.32) !important; }

.btn-accent {
  background: linear-gradient(135deg, #6B5BFF 0%, #5B47E0 100%) !important;
  box-shadow:
    0 1px 0 rgba(255,255,255,.35) inset,
    var(--glow-accent) !important;
}
.btn-accent:hover { box-shadow: 0 1px 0 rgba(255,255,255,.4) inset, 0 18px 44px rgba(91,71,224,.32) !important; }

/* 新增青柠强调按钮（如未来想用） */
.btn-mint {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 9px 16px; border-radius: 999px;
  font-size: 13.5px; font-weight: 600;
  color: #fff;
  background: linear-gradient(135deg, #22D3A8 0%, #0FB48C 100%);
  box-shadow: 0 1px 0 rgba(255,255,255,.35) inset, var(--glow-accent2);
  transition: transform .15s, box-shadow .2s;
}
.btn-mint:hover { transform: translateY(-1px); box-shadow: 0 1px 0 rgba(255,255,255,.4) inset, 0 18px 44px rgba(34,211,168,.32); }

/* ============================================================
   通用卡片增强 — 圆角更大、阴影更柔、细描边
   ============================================================ */
.pr-card,
.dl-step,
.feat-card,
.faq-item,
.support-card,
.howto-step,
.feature-tile,
.tool-card,
.use-card,
.rfeature,
.device-tile,
.press-card,
.showcase-point,
.bento-fill,
.spec-card,
.testi-card,
.review-card,
.step-card,
.metric-card,
.platform-card {
  border-radius: 20px !important;
  box-shadow:
    0 0 0 1px rgba(15, 17, 26, .05),
    0 1px 2px rgba(15, 17, 26, .03),
    0 14px 36px rgba(15, 17, 26, .06) !important;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease !important;
}
.pr-card:hover,
.feat-card:hover,
.feature-tile:hover,
.rfeature:hover,
.device-tile:hover,
.press-card:hover,
.showcase-point:hover {
  transform: translateY(-3px) !important;
  box-shadow:
    0 0 0 1px rgba(91, 71, 224, .18),
    0 18px 50px rgba(91, 71, 224, .12) !important;
}

/* 推荐价格卡 — 双色辉光 */
.pr-card.pr-recommend {
  background: linear-gradient(160deg, #fff 0%, #fafaff 60%, #fff5f5 100%) !important;
  box-shadow:
    0 0 0 2px rgba(248, 40, 44, .85),
    0 0 0 6px rgba(248, 40, 44, .08),
    0 30px 70px rgba(248, 40, 44, .18),
    0 30px 70px rgba(91, 71, 224, .10) !important;
}

/* ============================================================
   Hero 通用极光装饰带
   作用于所有 .pr-hero / [class$="-hero"] 等顶部区块
   ============================================================ */
.pr-hero,
.dl-hero,
.faq-hero,
.support-hero,
.feature-hero,
[class$="-hero"],
.hero-section {
  position: relative;
  overflow: hidden;
}
.pr-hero::after,
.dl-hero::after,
.faq-hero::after,
.support-hero::after,
.feature-hero::after,
[class$="-hero"]::after,
.hero-section::after {
  content: "";
  position: absolute;
  bottom: -180px; left: -100px; right: -100px;
  height: 360px;
  background:
    radial-gradient(360px 160px at 20% 50%, rgba(248, 40, 44, .14), transparent 70%),
    radial-gradient(420px 180px at 50% 50%, rgba(91, 71, 224, .14), transparent 70%),
    radial-gradient(360px 160px at 82% 50%, rgba(34, 211, 168, .14), transparent 70%);
  filter: blur(40px);
  z-index: 0;
  pointer-events: none;
}
.pr-hero > *,
.dl-hero > *,
.faq-hero > *,
.support-hero > *,
.feature-hero > *,
[class$="-hero"] > *,
.hero-section > * { position: relative; z-index: 1; }

/* ============================================================
   eyebrow / 徽章 / 标签 — 单色红渐变 → 加入紫色变体
   ============================================================ */
.eyebrow,
.pr-hero .eyebrow {
  background: linear-gradient(135deg, rgba(91, 71, 224, .10), rgba(248, 40, 44, .10)) !important;
  color: #5B47E0 !important;
}

/* 文字渐变（h1 .grad 等）— 红 → 紫 → 青柠 */
.grad,
[class*=" grad"],
.pr-hero h1 .grad {
  background: linear-gradient(120deg, #F8282C 0%, #5B47E0 55%, #22D3A8 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}

/* ============================================================
   Final-CTA — 红色块加入紫色光斑
   ============================================================ */
.final-cta {
  background:
    radial-gradient(60% 80% at 100% 0%, rgba(91, 71, 224, .55), transparent 60%),
    radial-gradient(60% 80% at 0% 100%, rgba(34, 211, 168, .35), transparent 60%),
    linear-gradient(135deg, #F8282C 0%, #D81E22 100%) !important;
}

/* ============================================================
   节区分隔 — 替换硬色系装饰横条为细极光线
   ============================================================ */
.section-divider,
.divider-line,
hr.fancy {
  height: 1px;
  background: linear-gradient(90deg,
    transparent 0%,
    rgba(248, 40, 44, .35) 25%,
    rgba(91, 71, 224, .45) 50%,
    rgba(34, 211, 168, .35) 75%,
    transparent 100%) !important;
  border: 0 !important;
}

/* ============================================================
   信任徽章 / 数据 — 数字渐变切换为极光
   ============================================================ */
.pr-trust .item .v,
.stat-num,
.metric-num,
.number-grad {
  background: linear-gradient(120deg, #F8282C, #5B47E0 60%, #22D3A8) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}

/* ============================================================
   小细节 — 链接 hover、focus ring
   ============================================================ */
a:not(.btn):not(.nav-menu a):not(.lang-item):not(.brand):not(.mega-item):not(.site-footer a):hover {
  color: #5B47E0;
}

button:focus-visible,
a:focus-visible {
  outline: 2px solid #5B47E0;
  outline-offset: 3px;
  border-radius: 4px;
}

/* ============================================================
   响应式微调
   ============================================================ */
@media (max-width: 768px) {
  body::before { height: 2px; }
  .pr-hero::after,
  [class$="-hero"]::after { filter: blur(28px); }
}