.content-section{padding:40px 0;background-color:var(--surface-color);border-radius:var(--border-radius);box-shadow:var(--box-shadow);margin:30px 0}
.content-header{text-align:center;margin-bottom:40px;padding-bottom:20px;border-bottom:1px solid rgba(0,0,0,0.1)}
.content-header h1{font-size:2.2rem;color:var(--secondary-color);margin-bottom:10px}
.content-header p{color:var(--text-secondary);font-size:1rem}
.content-body{max-width:800px;margin:0 auto;padding:0 20px}
.content-body h2{font-size:1.5rem;color:var(--secondary-color);margin:30px 0 15px;padding-bottom:8px;border-bottom:1px solid rgba(0,0,0,0.05)}
.content-body p{margin-bottom:15px;line-height:1.7;color:var(--text-color)}
.content-body ul{margin-bottom:25px;padding-left:20px}
.content-body li{margin-bottom:10px;position:relative;line-height:1.6}
.content-body li::before{content:"•";color:var(--primary-color);font-weight:bold;display:inline-block;width:1em;margin-left:-1em}
@media (max-width:768px){.content-header h1{font-size:1.8rem}
.content-body{padding:0 15px}
.content-body h2{font-size:1.3rem}
}html{scroll-behavior:smooth}
.content-body a{color:var(--primary-color);text-decoration:none;transition:color 0.3s ease;position:relative}
.content-body a:hover{color:#3a9bc9}
.content-body a::after{content:'';position:absolute;width:100%;height:1px;bottom:0;left:0;background-color:var(--primary-color);transform:scaleX(0);transform-origin:bottom right;transition:transform 0.3s ease}
.content-body a:hover::after{transform:scaleX(1);transform-origin:bottom left}
@keyframes fadeIn{from{opacity:0;transform:translateY(20px)}
to{opacity:1;transform:translateY(0)}
}.content-section{animation:fadeIn 0.6s ease-out}
.content-body h2{animation:fadeIn 0.6s ease-out 0.2s both}
.content-body p,.content-body ul{animation:fadeIn 0.6s ease-out 0.4s both}