/* =========================
        内容区域压缩
========================= */


section{


padding:

40px 10%;


}






section h2{


margin-top:0;


margin-bottom:18px;


}






section p{


line-height:1.7;


margin:8px 0;


}







/* =========================
        快速入口
========================= */


.quick{


padding-top:30px;


padding-bottom:30px;


}




.quick-grid{


display:grid;


grid-template-columns:

repeat(4,1fr);


gap:15px;


}





.quick-grid a{


background:white;


padding:16px;


border-radius:14px;


text-align:center;


text-decoration:none;


color:#24476f;


font-weight:600;



box-shadow:

0 6px 18px rgba(0,0,0,.07);


transition:.3s;


}



.quick-grid a:hover{


transform:translateY(-5px);


}








/* =========================
        卡片
========================= */


.grid{


display:grid;


grid-template-columns:

repeat(3,1fr);


gap:18px;


}




.card,


.project-box div{


background:white;


padding:24px;


border-radius:16px;


box-shadow:

0 7px 22px rgba(0,0,0,.08);


transition:.3s;


}




.card:hover,


.project-box div:hover{


transform:translateY(-5px);


}






/* 项目 */


.project-box{


display:grid;


grid-template-columns:

repeat(3,1fr);


gap:18px;


}







/* =========================
        数据
========================= */


.numbers{


display:flex;


justify-content:space-around;


text-align:center;


}





.numbers h1{


font-size:42px;


margin:10px 0;


color:#2874b8;


}







/* =========================
        FOOTER
========================= */


footer{


background:


linear-gradient(

135deg,

#2d7fd3 0%,

#ffffff 50%,

#f48fb1 100%

);



padding:

40px 20px;


text-align:center;


color:#24476f;


}





.footer-title{


font-size:22px;


font-weight:900;


}





.footer-line{


width:60%;


height:1px;


background:

rgba(36,71,111,.25);


margin:15px auto;


}







/* =========================
        动画
========================= */


@keyframes fade{


from{

opacity:0;

}

to{

opacity:1;

}


}






@keyframes slide{


from{


opacity:0;


transform:translateY(30px);


}


to{


opacity:1;


transform:none;


}


}






@keyframes heroMove{


from{


background-position:center;


}


to{


background-position:right center;


}


}