:root{
  --blue:#4D6BFE; --navy:#0F2A5C; --deep:#1E3A8A;
  --ink:#0f172a; --ink2:#334155; --muted:#64748b; --line:#e2e8f0;
  --bg:#f6f8ff; --card:#fff; --light:#eef2ff;
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;color:var(--ink);background:var(--bg);line-height:1.7;-webkit-font-smoothing:antialiased}
a{color:var(--blue);text-decoration:none}
code{font-family:ui-monospace,Menlo,Consolas,monospace;background:var(--light);color:var(--deep);padding:1px 6px;border-radius:6px;font-size:.85em}

/* ===== Hero ===== */
.hero{position:relative;overflow:hidden;padding:90px 28px 72px;text-align:center;color:#fff;
  background:radial-gradient(1100px 520px at 70% -10%, #6b8bff33, transparent),
             linear-gradient(160deg, var(--navy), var(--deep));}
.hero-bg{position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.09) 1px, transparent 1px);background-size:34px 34px;animation:drift 26s linear infinite}
.hero-inner{position:relative;z-index:2;max-width:860px;margin:0 auto}
.kicker{font-weight:700;letter-spacing:.2em;color:#c7d2fe;font-size:.9rem;margin-bottom:16px}
.hero h1{font-size:clamp(2.2rem,6vw,4rem);font-weight:900;letter-spacing:-.02em;line-height:1.08}
.hero h1 .accent{background:linear-gradient(120deg,#fff,#b7c6ff);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.sub{margin-top:16px;color:#c7d2fe;font-size:1.1rem;max-width:640px;margin-left:auto;margin-right:auto}
.tags{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:30px}
.tags span{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);padding:8px 16px;border-radius:99px;font-size:.92rem}

/* ===== 卡片 ===== */
.cards{max-width:1120px;margin:-40px auto 60px;padding:0 24px;display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px;position:relative;z-index:3}
.card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:26px 24px;box-shadow:0 10px 30px rgba(15,42,92,.08);transition:.22s;display:flex;flex-direction:column}
.card:hover{transform:translateY(-6px);box-shadow:0 18px 46px rgba(15,42,92,.16);border-color:var(--blue);text-decoration:none}
.card:hover .cta{color:var(--blue)}
.card-ico{font-size:2.4rem;margin-bottom:12px}
.card h2{font-size:1.3rem;color:var(--ink)}
.desc{color:var(--ink2);font-size:.95rem;margin:10px 0 16px;flex:1}
.meta{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}
.meta li{background:var(--light);color:var(--deep);font-size:.78rem;padding:4px 10px;border-radius:8px}
.cta{font-weight:700;font-size:.95rem;color:var(--ink2)}

/* ===== 页脚 ===== */
footer{background:var(--navy);color:#9db0e8;text-align:center;padding:34px 24px;font-size:.9rem}
footer p{margin:4px 0}
footer a{color:#c7d2fe}

@keyframes drift{to{background-position:340px 340px}}

@media(max-width:860px){.cards{grid-template-columns:1fr;margin-top:-30px}}