:root{
  --navy:#1E3A5F; --navy-deep:#16293F; --navy-soft:#2C4E78;
  --cyan:#16C2C2; --cyan-soft:#5FE3E3;
  --gold:#D4A843; --gold-light:#E8C67B;
  --bg:#F6F7F9; --white:#ffffff; --ink:#1A2233; --ink-2:#4A5568; --ink-3:#7B8698;
  --line:#E4E8EF; --radius:14px;
  --shadow-sm:0 2px 8px rgba(30,58,95,.06);
  --shadow-md:0 10px 30px rgba(30,58,95,.10);
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  font-family:system-ui,-apple-system,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  color:var(--ink); background:var(--bg); line-height:1.8; -webkit-font-smoothing:antialiased;
}
a{text-decoration:none;color:inherit;}
.wrap{max-width:1080px;margin:0 auto;padding:0 24px;}

/* 顶栏 */
.case-header{position:sticky;top:0;z-index:30;background:rgba(255,255,255,.92);backdrop-filter:saturate(180%) blur(14px);border-bottom:1px solid var(--line);}
.case-nav{display:flex;align-items:center;justify-content:space-between;height:64px;}
.brand{display:flex;align-items:center;gap:10px;font-weight:700;color:var(--navy);}
.brand small{color:var(--cyan);font-weight:600;}
.back-link{font-size:14px;color:var(--ink-2);display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border:1px solid var(--line);border-radius:999px;transition:.18s;}
.back-link:hover{border-color:var(--cyan);color:var(--navy);}

/* hero */
.hero{background:linear-gradient(135deg,var(--navy-deep),var(--navy-soft));color:#fff;padding:64px 0 56px;position:relative;overflow:hidden;}
.hero::after{content:"";position:absolute;right:-120px;top:-120px;width:380px;height:380px;border-radius:50%;background:radial-gradient(circle,rgba(22,194,194,.35),transparent 60%);}
.hero .kicker{color:var(--cyan-soft);font-weight:600;letter-spacing:.14em;font-size:13px;text-transform:uppercase;}
.hero h1{font-size:40px;line-height:1.3;margin:14px 0 16px;font-weight:700;letter-spacing:-.01em;}
.hero p.lead{color:#cdd9e8;max-width:680px;font-size:16.5px;}
.hero .tags{margin-top:22px;display:flex;flex-wrap:wrap;gap:10px;}
.hero .tags span{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);color:#eaf2fb;font-size:13px;padding:6px 14px;border-radius:999px;}

/* meta strip */
.meta{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;margin:-34px 0 0;position:relative;z-index:2;}
.meta div{background:var(--white);padding:20px 18px;}
.meta b{display:block;font-size:13px;color:var(--ink-3);font-weight:600;margin-bottom:6px;letter-spacing:.04em;}
.meta span{font-size:15px;color:var(--navy);font-weight:600;}

/* sections */
.section{padding:48px 0;}
.section h2{font-size:26px;color:var(--navy);margin-bottom:18px;position:relative;padding-left:16px;}
.section h2::before{content:"";position:absolute;left:0;top:6px;bottom:6px;width:5px;border-radius:3px;background:linear-gradient(var(--cyan),var(--gold));}
.section p{color:var(--ink-2);font-size:15.5px;margin-bottom:12px;}
.section ul{list-style:none;display:grid;gap:12px;margin-top:6px;}
.section ul li{background:var(--white);border:1px solid var(--line);border-radius:12px;padding:16px 18px;box-shadow:var(--shadow-sm);}
.section ul li b{color:var(--navy);}
.section ul li span{color:var(--ink-2);font-size:14.5px;}

/* metrics */
.metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:8px;}
.metrics .m{background:var(--white);border:1px solid var(--line);border-radius:14px;padding:24px;text-align:center;box-shadow:var(--shadow-sm);}
.metrics .m b{display:block;font-size:34px;color:var(--cyan);font-weight:700;}
.metrics .m span{color:var(--ink-3);font-size:14px;}

/* architecture cards */
.arch{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
.arch .a{background:var(--white);border:1px solid var(--line);border-radius:14px;padding:22px;box-shadow:var(--shadow-sm);}
.arch .a h3{color:var(--navy);font-size:17px;margin-bottom:8px;}
.arch .a p{font-size:14px;color:var(--ink-2);margin:0;}

/* CTA */
.cta{background:linear-gradient(135deg,var(--navy),var(--navy-deep));color:#fff;border-radius:18px;padding:40px;text-align:center;margin:16px 0 48px;}
.cta h3{font-size:24px;margin-bottom:10px;}
.cta p{color:#cdd9e8;margin-bottom:22px;}
.cta a{display:inline-flex;align-items:center;gap:8px;background:var(--cyan);color:var(--navy-deep);font-weight:700;padding:13px 26px;border-radius:999px;transition:.18s;}
.cta a:hover{background:var(--cyan-soft);transform:translateY(-2px);}

/* footer mini */
.foot{padding:30px 0;border-top:1px solid var(--line);color:var(--ink-3);font-size:13.5px;text-align:center;}
.foot .icp{margin-top:8px;}
.foot .icp a{color:inherit;text-decoration:none;border-bottom:1px dashed currentColor;opacity:.85;}
.foot .icp a:hover{opacity:1;}

@media(max-width:780px){
  .meta{grid-template-columns:repeat(2,1fr);}
  .metrics,.arch{grid-template-columns:1fr;}
  .hero h1{font-size:30px;}
}
