/* ============================================================
   落地页样式 — 变量驱动配色（每套独立主色）
   ============================================================ */
:root {
  --brand: #e11d48;
  --brand-2: #ec4899;
  --brand-3: #f43f5e;
  --brand-rgb: 225, 29, 72;
  --brand-soft-1: #fff1f2;
  --brand-soft-2: #fce7f3;
  --brand-soft-3: #fecdd3;
  --brand-soft-4: #f9a8d4;
}

* { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
html { scroll-behavior: smooth; }
body {
  font-family: "Noto Sans SC", -apple-system, BlinkMacSystemFont, "Segoe UI",
    "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  color: #0f172a;
  background: #ffffff;
  overflow-x: hidden;
}

.gradient-text {
  background: linear-gradient(120deg, var(--brand) 0%, var(--brand-2) 50%, var(--brand-3) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}

.btn-primary {
  background: linear-gradient(120deg, var(--brand), var(--brand-2));
  transition: transform 0.2s ease, box-shadow 0.2s ease, filter 0.2s ease;
  box-shadow: 0 10px 25px -5px rgba(var(--brand-rgb), 0.45);
}
.btn-primary:hover {
  transform: translateY(-2px);
  filter: brightness(1.06);
  box-shadow: 0 18px 35px -8px rgba(var(--brand-rgb), 0.55);
}

.navbar { transition: all 0.3s ease; }
.navbar.scrolled {
  background: rgba(255, 255, 255, 0.92);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  box-shadow: 0 4px 20px rgba(15, 23, 42, 0.06);
}

.feature-card { transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease; }
.feature-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 24px 48px -16px rgba(var(--brand-rgb), 0.22);
  border-color: rgba(var(--brand-rgb), 0.35);
}
.feature-icon {
  background: linear-gradient(135deg, var(--brand-soft-1), var(--brand-soft-2));
  color: var(--brand);
  transition: all 0.3s ease;
}
.feature-card:hover .feature-icon {
  background: linear-gradient(135deg, var(--brand), var(--brand-2));
  color: #fff;
  transform: scale(1.06) rotate(-5deg);
}

.reveal { opacity: 0; transform: translateY(24px); transition: opacity 0.7s cubic-bezier(0.22,0.61,0.36,1), transform 0.7s cubic-bezier(0.22,0.61,0.36,1); }
.reveal.revealed { opacity: 1; transform: none; }

.blob { position: absolute; border-radius: 9999px; filter: blur(70px); opacity: 0.5; pointer-events: none; }

.faq-item { transition: box-shadow 0.3s ease, border-color 0.3s ease; }
.faq-item.open { border-color: rgba(var(--brand-rgb), 0.35); box-shadow: 0 12px 30px -14px rgba(var(--brand-rgb), 0.25); }
.faq-answer { max-height: 0; overflow: hidden; transition: max-height 0.4s ease, padding 0.4s ease, opacity 0.4s ease; opacity: 0; }
.faq-item.open .faq-answer { max-height: 320px; opacity: 1; }
.faq-icon { transition: transform 0.3s ease; }
.faq-item.open .faq-icon { transform: rotate(180deg); }

@keyframes float { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-14px); } }
.float-slow { animation: float 6s ease-in-out infinite; }

::-webkit-scrollbar { width: 10px; }
::-webkit-scrollbar-track { background: #f1f5f9; }
::-webkit-scrollbar-thumb { background: var(--brand-soft-3); border-radius: 9999px; }
::-webkit-scrollbar-thumb:hover { background: var(--brand-soft-4); }

.stars { color: #f59e0b; letter-spacing: 2px; }