.banner-carousel{position:relative;width:100%;min-height:400px;margin-bottom:30px;overflow:hidden;border-radius:0;transform:translateZ(0);backface-visibility:hidden;}.carousel-container{position:relative;width:100%;height:100%;}.banner-slide{position:absolute;top:0;left:0;width:100%;min-height:400px;padding:80px 0;display:flex;align-items:center;opacity:0;visibility:hidden;transition:all 0.8s cubic-bezier(0.25,0.46,0.45,0.94);transform:translateX(100%);z-index:1;will-change:transform,opacity;}.banner-slide.active{opacity:1;visibility:visible;transform:translateX(0);z-index:2;}.banner-slide.prev{transform:translateX(-100%);}.banner-slide[data-bg="literary-classic"]{background:linear-gradient(135deg,rgba(26,35,126,0.9),rgba(74,85,162,0.8)),url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 400"><defs><linearGradient id="bookGradient" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" style="stop-color:%23f8f9ff;stop-opacity:0.1"/><stop offset="100%" style="stop-color:%23e8eaff;stop-opacity:0.05"/></linearGradient></defs><g opacity="0.15"><rect x="100" y="150" width="80" height="120" rx="4" fill="url(%23bookGradient)" stroke="%23ffffff" stroke-width="1" opacity="0.3"/><rect x="200" y="160" width="70" height="100" rx="3" fill="url(%23bookGradient)" stroke="%23ffffff" stroke-width="1" opacity="0.25"/><rect x="290" y="155" width="75" height="110" rx="4" fill="url(%23bookGradient)" stroke="%23ffffff" stroke-width="1" opacity="0.3"/><text x="500" y="50" font-family="serif" font-size="24" fill="%23ffffff" opacity="0.1" text-anchor="middle">文学之美</text></g></svg>');background-size:cover;background-position:center;background-attachment:fixed;}.banner-slide[data-bg="creative-passion"]{background:linear-gradient(135deg,rgba(139,69,19,0.9),rgba(205,133,63,0.8)),url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 400"><defs><linearGradient id="penGradient" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" style="stop-color:%23fff8dc;stop-opacity:0.1"/><stop offset="100%" style="stop-color:%23ffd700;stop-opacity:0.05"/></linearGradient></defs><g opacity="0.2"><path d="M100 200 L180 120" stroke="%23ffffff" stroke-width="3" opacity="0.3"/><circle cx="185" cy="115" r="4" fill="%23ffffff" opacity="0.4"/><path d="M300 180 L380 100" stroke="%23ffffff" stroke-width="3" opacity="0.3"/><circle cx="385" cy="95" r="4" fill="%23ffffff" opacity="0.4"/><text x="600" y="80" font-family="serif" font-size="20" fill="%23ffffff" opacity="0.15" text-anchor="middle">创作灵感</text><path d="M800 150 Q 850 120 900 150 Q 950 180 1000 150" stroke="%23ffffff" stroke-width="2" fill="none" opacity="0.2"/></g></svg>');background-size:cover;background-position:center;background-attachment:fixed;}.banner-slide[data-bg="reading-experience"]{background:linear-gradient(135deg,rgba(25,25,112,0.9),rgba(72,61,139,0.8)),url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 400"><defs><linearGradient id="pageGradient" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" style="stop-color:%23f0f8ff;stop-opacity:0.1"/><stop offset="100%" style="stop-color:%23e6f3ff;stop-opacity:0.05"/></linearGradient></defs><g opacity="0.18"><rect x="150" y="120" width="60" height="80" rx="3" fill="url(%23pageGradient)" stroke="%23ffffff" stroke-width="1" opacity="0.3"/><path d="M150 140 L200 140 M150 155 L195 155 M150 170 L200 170" stroke="%23ffffff" stroke-width="1" opacity="0.2"/><path d="M950 100 Q 1000 80 1050 100 Q 1100 120 1150 100" stroke="%23ffffff" stroke-width="2" fill="none" opacity="0.25"/><text x="600" y="60" font-family="serif" font-size="22" fill="%23ffffff" opacity="0.12" text-anchor="middle">阅读之美</text><circle cx="300" cy="300" r="8" fill="%23ff69b4" opacity="0.3"/><circle cx="900" cy="280" r="6" fill="%23ff69b4" opacity="0.25"/></g></svg>');background-size:cover;background-position:center;background-attachment:fixed;}.banner-content{position:relative;z-index:2;max-width:600px;text-align:center;margin:0 auto;}.banner-title{font-size:48px;font-weight:700;color:#ffffff;margin-bottom:20px;font-family:"STXingkai","FangSong",serif;text-shadow:2px 2px 4px rgba(0,0,0,0.3);letter-spacing:2px;line-height:1.2;background:linear-gradient(45deg,#ffffff,#f0f4ff);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:fadeInUp 1s ease-out 0.3s both;will-change:transform,opacity;transform:translateZ(0);}.banner-desc{font-size:20px;color:rgba(255,255,255,0.9);text-shadow:1px 1px 2px rgba(0,0,0,0.2);font-weight:300;letter-spacing:1px;line-height:1.5;animation:fadeInUp 1s ease-out 0.6s both;will-change:transform,opacity;transform:translateZ(0);}.banner-section::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:radial-gradient(circle at 20% 30%,rgba(255,255,255,0.1) 0%,transparent 50%),radial-gradient(circle at 80% 70%,rgba(255,255,255,0.08) 0%,transparent 50%);z-index:1;pointer-events:none;}.banner-section::after{content:'';position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:linear-gradient(45deg,transparent 30%,rgba(255,255,255,0.02) 50%,transparent 70%);animation:shimmer 6s ease-in-out infinite;z-index:1;pointer-events:none;}.banner-slide::before,.banner-slide::after{will-change:transform;transform:translateZ(0);}