*{box-sizing:border-box}
body{margin:0;font-family:"Microsoft YaHei",Arial;color:#222}
header{height:90px;padding:0 7%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ddd;background:#fff}
.brand{display:flex;align-items:center;gap:15px}
.logo{font-size:48px;font-weight:bold;color:#17365d}
small{display:block}
nav a{margin:0 12px;cursor:pointer}
button{background:#17365d;color:white;border:0;padding:12px 28px;cursor:pointer}
.hero{min-height:680px;padding:120px 8%;display:flex;justify-content:space-between;gap:50px;background:linear-gradient(120deg,#15355b,#4674a8);color:white}
.hero h1{font-size:65px}
.tag,h2{color:#c99b38}
.panel{background:white;color:#333;padding:35px;width:330px;height:max-content}
section{padding:80px 10%}
h2{text-align:center;font-size:40px}
.center{text-align:center;font-size:20px;line-height:2}
.gray{background:#f5f7fa}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:25px}
.cards div{padding:35px;background:white;border:1px solid #ddd}
.stats{display:flex;justify-content:center;gap:100px;background:#17365d;color:white;text-align:center;font-size:55px}
.stats small{font-size:16px}
footer{text-align:center;background:#111;color:white;padding:35px}
@media(max-width:900px){nav{display:none}.hero{display:block}.hero h1{font-size:40px}.cards{grid-template-columns:1fr}.stats{display:block}}