*{box-sizing:border-box;margin:0;padding:0;font-family:"Microsoft YaHei"}
body{background:#fff7f7;color:#333}
.header{height:85px;background:linear-gradient(90deg,#c40000,#8b0000);color:#fff;display:flex;justify-content:space-between;align-items:center;padding:0 8%}
.brand b{font-size:40px}.brand span{margin-left:20px;font-size:18px}
nav a{margin:15px;color:white;text-decoration:none}
.hero{height:480px;position:relative;overflow:hidden}
.hero img{width:100%;height:100%;object-fit:cover}
.hero-text{position:absolute;left:10%;top:32%;color:#fff}
.hero-text h1{font-size:55px;text-shadow:0 3px 10px #555}
.layout{width:90%;margin:35px auto;display:grid;grid-template-columns:1fr 1fr;gap:30px}
.panel,.cards div{background:white;border-radius:25px;padding:30px;box-shadow:0 8px 25px #ddd}
h2{color:#b00000;text-align:center;margin-bottom:25px}
.tree{text-align:center}
.root{background:#b00000;color:white;padding:15px;border-radius:30px;display:inline-block}
.line{height:40px;border-left:3px solid #b00000;margin:auto}
.children{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}
.children div{background:#fff0f0;padding:20px;border-radius:15px;color:#900}
.activity{display:flex;gap:20px}
.activity img{width:220px;height:150px;object-fit:cover;border-radius:15px}
.media-box{margin-top:25px;background:#fff0f0;padding:25px;text-align:center}
.cards{width:80%;margin:30px auto;display:flex;gap:30px;text-align:center;font-size:25px}
.cards div{flex:1;color:#b00000}
footer{background:#900;color:#fff;text-align:center;padding:30px}
footer img{max-width:300px}
@media(max-width:800px){.layout{grid-template-columns:1fr}.children{grid-template-columns:1fr}.cards{display:block}.cards div{margin:15px}}
