/**
 * site2 — 商务 / SaaS 风主题（仅 UI，与 lang-switch 协同）
 * v20260405 — fix fixed nav (exclude from body> stacking rule)
 */
@import url("https://rsms.me/inter/inter.css");

:root {
  --gw-navy-950: #0a1628;
  --gw-navy-900: #0f2744;
  --gw-navy-800: #153a5c;
  --gw-sky-600: #0284c7;
  --gw-sky-500: #0ea5e9;
  --gw-amber-500: #f59e0b;
  --gw-orange-600: #ea580c;
  --gw-shadow-xs: 0 1px 2px rgba(15, 23, 42, 0.05);
  --gw-shadow-sm: 0 4px 6px -1px rgba(15, 23, 42, 0.07), 0 2px 4px -2px rgba(15, 23, 42, 0.05);
  --gw-shadow-md: 0 12px 40px -12px rgba(15, 35, 60, 0.22);
  --gw-shadow-lg: 0 24px 48px -16px rgba(15, 35, 60, 0.28);
  --gw-shadow-card: 0 4px 24px -4px rgba(15, 35, 60, 0.12), 0 0 0 1px rgba(255, 255, 255, 0.6) inset;
  --gw-r-pill: 9999px;
  --gw-r-md: 1rem;
  --gw-r-lg: 1.25rem;
  --gw-r-xl: 1.5rem;
  --mx: 50%;
  --my: 20%;
  /* 固定顶栏占位（与 .gw-site-nav 实际高度对齐，略留余量） */
  --gw-nav-offset: 5.5rem;
}

@media (min-width: 1024px) {
  :root {
    --gw-nav-offset: 8rem;
  }
}

html {
  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif,
    "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  -webkit-font-smoothing: antialiased;
  scroll-padding-top: var(--gw-nav-offset);
}

/* 主背景：深蓝商务渐变（视频层保留） */
body.gradient,
.gradient {
  background-color: var(--gw-navy-950);
  background-image: linear-gradient(165deg, #0a1628 0%, #123652 38%, #1a4a6e 100%);
  background-attachment: fixed;
}

/* 固定顶栏后，避免首屏内容被遮挡 */
body.gradient {
  padding-top: var(--gw-nav-offset);
}

/* CTA 按钮渐变 */
.gradient2 {
  background-image: linear-gradient(135deg, #b45309 0%, #ea580c 50%, #f59e0b 100%);
  box-shadow: var(--gw-shadow-md);
  border: 1px solid rgba(255, 255, 255, 0.12);
}

.gradient2:hover {
  filter: brightness(1.03);
}

/* 顶栏：固定顶部，与 body 同源深蓝渐变 */
.gw-site-nav {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 50;
  width: 100%;
  background-color: var(--gw-navy-950);
  background-image: linear-gradient(165deg, #0a1628 0%, #123652 38%, #1a4a6e 100%);
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: 0 8px 28px -10px rgba(0, 0, 0, 0.35);
}

/* 导航链接：浅色（覆盖 Tailwind text-black） */
.gw-site-nav #nav-content > ul a {
  color: rgba(255, 255, 255, 0.92);
}
.gw-site-nav #nav-content > ul a:hover {
  color: #fff;
}

.gw-nav-toggle {
  border-radius: 0.75rem;
  border: 1px solid rgba(255, 255, 255, 0.28);
  background: rgba(255, 255, 255, 0.12);
  color: #fff;
  box-shadow: none;
}
.gw-nav-toggle:hover {
  background: rgba(255, 255, 255, 0.2);
  border-color: rgba(255, 255, 255, 0.45);
}

/* 移动端展开的导航面板：同色渐变 */
@media (max-width: 1023px) {
  .gw-site-nav #nav-content:not(.hidden) {
    background-color: var(--gw-navy-950);
    background-image: linear-gradient(165deg, #0a1628 0%, #123652 38%, #1a4a6e 100%);
    border-radius: 0 0 1rem 1rem;
    box-shadow: 0 16px 40px -12px rgba(0, 0, 0, 0.4);
    border: 1px solid rgba(255, 255, 255, 0.1);
    margin-top: 0.35rem;
  }
}

/* 阅读进度条 */
.progress {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  z-index: 60;
  background: rgba(15, 23, 42, 0.12);
}
.progress__bar {
  height: 100%;
  width: 0%;
  background: linear-gradient(90deg, #0ea5e9, #0284c7, #f59e0b);
  transform-origin: left center;
}

/* 滚动显现 */
.reveal {
  opacity: 0;
  transform: translateY(14px);
  transition: opacity 0.55s ease, transform 0.55s ease;
}
.reveal.is-visible {
  opacity: 1;
  transform: none;
}

/* 光标跟随：弱化以更显克制 */
body::after {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(380px 260px at var(--mx) var(--my), rgba(255, 255, 255, 0.07), transparent 65%);
  opacity: 0.85;
  mix-blend-mode: soft-light;
}

/* Hero 背景视频（保留资源配置，仅微调叠层） */
.bg-video {
  position: fixed;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
}
.bg-video video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  opacity: 0.2;
  filter: saturate(0.88) contrast(1.04) brightness(0.78);
}
.bg-video::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(900px 520px at 18% 12%, rgba(255, 255, 255, 0.1), transparent 58%),
    radial-gradient(780px 520px at 82% 8%, rgba(14, 165, 233, 0.08), transparent 60%),
    linear-gradient(180deg, rgba(10, 22, 40, 0.52), rgba(10, 22, 40, 0.78));
  opacity: 0.92;
}
/* 勿作用于固定层：否则会把 fixed 覆盖成 relative，顶栏/进度条会随页面滚动 */
body > :not(.bg-video):not(.progress):not(.gw-site-nav) {
  position: relative;
  z-index: 1;
}

@media (prefers-reduced-motion: reduce) {
  .reveal {
    transition: none !important;
  }
  body::after {
    display: none;
  }
  .bg-video {
    display: none;
  }
  .gw-hero-card:hover,
  .gw-card-pro:hover,
  .gw-flow-step:hover {
    transform: none;
  }
  .gw-hero-card__veil {
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }
}

/* —— 核心业务区 —— */
.gw-hero-shell {
  border-radius: var(--gw-r-xl);
  background: linear-gradient(155deg, rgba(255, 255, 255, 0.99) 0%, rgba(248, 250, 252, 0.96) 48%, rgba(255, 255, 255, 0.98) 100%);
  box-shadow: var(--gw-shadow-lg), 0 0 0 1px rgba(255, 255, 255, 0.75) inset;
}
.gw-hero-head {
  background: linear-gradient(90deg, rgba(2, 132, 199, 0.06), rgba(234, 88, 12, 0.06));
  border-bottom: 1px solid rgba(148, 163, 184, 0.14);
}
.gw-hero-card {
  border-radius: 1.125rem;
  background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
  border: 1px solid rgba(148, 163, 184, 0.18);
  box-shadow: var(--gw-shadow-sm);
  transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
}
.gw-hero-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 22px 44px -14px rgba(2, 132, 199, 0.22);
  border-color: rgba(2, 132, 199, 0.28);
}
.gw-hero-card--soon {
  position: relative;
  overflow: hidden;
}
.gw-hero-card--soon:hover {
  transform: none;
  box-shadow: var(--gw-shadow-sm);
  border-color: rgba(148, 163, 184, 0.18);
}
.gw-hero-card__veil {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: flex;
  align-items: flex-start;
  justify-content: flex-end;
  padding: 0.65rem 0.65rem 0 0;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.12) 0%, rgba(248, 250, 252, 0.2) 100%);
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
  border-radius: inherit;
  pointer-events: none;
}
.gw-hero-card__soon-badge {
  font-size: 0.68rem;
  font-weight: 900;
  letter-spacing: 0.14em;
  color: #334155;
  padding: 0.35rem 0.65rem;
  border-radius: var(--gw-r-pill);
  border: 1px solid rgba(71, 85, 105, 0.28);
  background: rgba(255, 255, 255, 0.94);
  box-shadow: var(--gw-shadow-xs);
}
.gw-num--muted {
  background: linear-gradient(145deg, #94a3b8 0%, #cbd5e1 100%);
}
.gw-num {
  width: 2.75rem;
  height: 2.75rem;
  border-radius: 0.9rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 900;
  font-size: 0.8rem;
  color: #fff;
  background: linear-gradient(135deg, #0369a1 0%, #0ea5e9 45%, #ea580c 100%);
  flex-shrink: 0;
}
.gw-pill {
  display: inline-block;
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: #0c4a6e;
  background: rgba(2, 132, 199, 0.12);
  padding: 0.35rem 0.75rem;
  border-radius: var(--gw-r-pill);
}
.gw-tagbar {
  background: linear-gradient(180deg, rgba(248, 250, 252, 0.97), rgba(241, 245, 249, 0.92));
  border-top: 1px solid rgba(148, 163, 184, 0.1);
}
.gw-tag {
  display: inline-flex;
  align-items: center;
  padding: 0.4rem 0.95rem;
  border-radius: var(--gw-r-pill);
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  background: rgba(255, 255, 255, 0.95);
  border: 1px solid rgba(2, 132, 199, 0.15);
  color: #334155;
}
.gw-section-kicker {
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: #64748b;
}
.gw-section-title {
  font-size: clamp(1.85rem, 4.2vw, 2.65rem);
  font-weight: 900;
  color: #0f172a;
  letter-spacing: -0.03em;
  line-height: 1.12;
}
.gw-accent-bar {
  width: 4rem;
  height: 0.24rem;
  border-radius: var(--gw-r-pill);
  background: linear-gradient(90deg, #ea580c, #f59e0b, #0284c7);
  margin: 0.85rem auto 0;
}
.gw-card-pro {
  border-radius: var(--gw-r-xl);
  background: #fff;
  border: 1px solid rgba(226, 232, 240, 0.95);
  box-shadow: var(--gw-shadow-md);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
  position: relative;
  overflow: hidden;
}
.gw-card-pro::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(90deg, #ea580c, #f59e0b, #0284c7);
}
.gw-card-pro:hover {
  transform: translateY(-6px);
  box-shadow: 0 28px 52px -14px rgba(2, 132, 199, 0.2);
}
.gw-card-pro-inner {
  padding: 2rem 1.75rem 1.75rem;
}
.gw-ordinal {
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #94a3b8;
}
.gw-flow-rail {
  position: absolute;
  top: 2.35rem;
  left: 8%;
  right: 8%;
  height: 3px;
  border-radius: var(--gw-r-pill);
  background: linear-gradient(90deg, rgba(2, 132, 199, 0.28), rgba(234, 88, 12, 0.25));
  z-index: 0;
}
.gw-flow-step {
  border-radius: 1.15rem;
  background: #fff;
  border: 1px solid rgba(226, 232, 240, 0.95);
  box-shadow: 0 10px 32px -10px rgba(15, 23, 42, 0.1);
  padding: 1.4rem 1.35rem 1.35rem;
  position: relative;
  z-index: 1;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.gw-flow-step:hover {
  transform: translateY(-3px);
  box-shadow: 0 18px 40px -12px rgba(2, 132, 199, 0.16);
}
.gw-flow-num {
  width: 2.35rem;
  height: 2.35rem;
  border-radius: var(--gw-r-pill);
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 900;
  font-size: 0.8rem;
  color: #0f172a;
  background: linear-gradient(145deg, rgba(2, 132, 199, 0.12), rgba(234, 88, 12, 0.12));
  margin-bottom: 0.75rem;
}
.gw-muted-band {
  background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 52%, #e8eef4 100%);
}
.gw-footer {
  background: linear-gradient(180deg, #eef2f7 0%, #ffffff 55%);
  border-top: 1px solid rgba(203, 213, 225, 0.55);
}
.gw-footer-card {
  border-radius: 1.125rem;
  border: 1px solid rgba(226, 232, 240, 0.95);
  background: rgba(255, 255, 255, 0.96);
  box-shadow: var(--gw-shadow-md);
  padding: 1.35rem 1.45rem;
}
.gw-hero-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-weight: 800;
  font-size: 1.05rem;
  letter-spacing: 0.02em;
  text-decoration: none;
  padding: 0.5rem 0.25rem;
  border-bottom: 2px solid rgba(255, 255, 255, 0.55);
  transition: border-color 0.15s ease, opacity 0.15s ease;
}
.gw-hero-cta:hover {
  border-bottom-color: rgba(255, 255, 255, 0.95);
  opacity: 0.96;
}

/* 联系表单容器 */
.gw-form-panel {
  border-radius: var(--gw-r-xl);
  background: rgba(255, 255, 255, 0.94);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  box-shadow: var(--gw-shadow-lg), 0 0 0 1px rgba(255, 255, 255, 0.5) inset;
  border: 1px solid rgba(255, 255, 255, 0.35);
}

/* —— 法律页 —— */
body.gw-legal {
  background: linear-gradient(180deg, #f8fafc 0%, #eef2f7 100%);
}
header.gw-legal-header {
  background: rgba(255, 255, 255, 0.86);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(15, 23, 42, 0.06);
  box-shadow: var(--gw-shadow-xs);
}

/* 客户场景大卡片 */
.gw-scenario-card {
  border-radius: var(--gw-r-xl);
  overflow: hidden;
  background: #fff;
  border: 1px solid rgba(226, 232, 240, 0.95);
  box-shadow: var(--gw-shadow-md);
  transition: box-shadow 0.22s ease, transform 0.22s ease;
}
.gw-scenario-card:hover {
  box-shadow: var(--gw-shadow-lg);
  transform: translateY(-2px);
}
@media (prefers-reduced-motion: reduce) {
  .gw-scenario-card:hover {
    transform: none;
  }
}
