/**
 * MatrixFlow 官网视觉 v3（2026-09-15）
 * 首页 / 登录 / 下载页统一：更饱满的首屏、更精致的卡片与表单、两种主题都清楚。
 */

/* ---------- 首页首屏 ---------- */
h1 {
  letter-spacing: -0.8px;
  line-height: 1.1;
  text-wrap: balance;
}

/* 首屏的"标签 + 标题 + 说明"整体略居中，阅读更聚焦 */
main > div:first-child, section:first-child { text-align: center; }
main > div:first-child p, section:first-child p { margin-left: auto; margin-right: auto; max-width: 860px; }
main > div:first-child a, section:first-child a { margin-left: 4px; margin-right: 4px; }

/* ---------- 卡片统一 ---------- */
main section,
main > div > div > div {
  border-radius: 18px;
}
main section:hover { border-color: rgba(148, 163, 184, .3); }

/* 功能卡片：悬浮轻抬 */
main a[href*="/marketplace"], main a[href*="/download"] {
  transition: transform .16s ease, box-shadow .16s ease;
}
main a[href*="/marketplace"]:hover, main a[href*="/download"]:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 30px rgba(15, 23, 42, .28);
}

/* ---------- 按钮 ---------- */
a[href*="/register"], a[href*="/login"], a[href*="MatrixFlow-"],
button[class*="bg-blue"], button[class*="bg-primary"] {
  border-radius: 12px !important;
  transition: transform .16s ease, box-shadow .16s ease, filter .16s ease;
}
a[href*="/register"]:hover, a[href*="/login"]:hover, a[href*="MatrixFlow-"]:hover {
  transform: translateY(-1px);
  filter: brightness(1.06);
  box-shadow: 0 10px 26px rgba(59, 130, 246, .3);
}

/* ---------- 登录 / 注册卡片 ---------- */
input[type="email"], input[type="password"], input[type="text"] {
  border-radius: 12px !important;
  transition: border-color .16s ease, box-shadow .16s ease;
}
input:focus {
  box-shadow: 0 0 0 3px rgba(99, 102, 241, .22) !important;
}
form { border-radius: 18px; }

/* ---------- 顶栏 ---------- */
header, nav { color: inherit; }
header a, nav a { opacity: .92; }
header a:hover, nav a:hover { opacity: 1; }

/* ---------- 深色主题才加氛围背景（浅色下加了会"深底+深字"） ---------- */
html.dark body {
  background-image:
    radial-gradient(1200px 620px at 8% -12%, rgba(99, 102, 241, .22), transparent 62%),
    radial-gradient(900px 520px at 100% 4%, rgba(56, 189, 248, .16), transparent 58%) !important;
}
html:not(.dark) body { background-image: none !important; }

footer { opacity: .78; }