.xbanner{width:100%;position:relative;overflow:hidden;background:#f8fafc}.xbanner-container{width:100%;height:100%;position:relative}.xbanner-slider{width:100%;height:100%;position:relative}.xbanner-slide{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;transition:opacity .8s ease-in-out;display:flex;align-items:center}.xbanner-slide.active{opacity:1}.xbanner-media{position:absolute;top:0;left:0;width:100%;height:100%}.xbanner-media img{width:100%;height:100%;object-fit:cover;object-position:center}.xbanner-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(135deg,rgba(0,0,0,.4) 0,rgba(0,0,0,.2) 100)}.xbanner-content{position:relative;z-index:2;max-width:800px;padding:2rem;transform:translateY(30px);transition:transform .6s ease,opacity .6s ease}.xbanner-slide.active .xbanner-content{transform:translateY(0);opacity:1}.xbanner-title{font-size:var(--title-size,3rem);color:var(--title-color,#fff);font-weight:var(--title-weight,700);margin-bottom:1rem;line-height:1.2;text-shadow:2px 2px 8px rgba(0,0,0,.6);opacity:0;transform:translateY(-30px);transition:all .8s ease .2s}.xbanner-slide.active .xbanner-title{opacity:1;transform:translateY(0)}.xbanner-desc{font-size:var(--desc-size,1.25rem);color:var(--desc-color,#f8fafc);font-weight:var(--desc-weight,400);margin-bottom:2rem;line-height:1.6;text-shadow:1px 1px 4px rgba(0,0,0,.5);opacity:0;transform:translateY(20px);transition:all .8s ease .4s}.xbanner-slide.active .xbanner-desc{opacity:1;transform:translateY(0)}.xbanner-btn{display:inline-block;padding:10px 24px;background:linear-gradient(135deg,rgba(30,64,175,.9),rgba(59,130,246,.9));color:#fff;text-decoration:none;border-radius:6px;font-weight:600;font-size:.9rem;transition:all .3s ease;border:none;cursor:pointer;opacity:0;transform:translateY(20px);transition:all .8s ease .6s;box-shadow:0 4px 15px rgba(30,64,175,.3);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.2);min-width:120px}.xbanner-slide.active .xbanner-btn{opacity:1;transform:translateY(0)}.xbanner-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(30,64,175,.5);background:linear-gradient(135deg,rgba(59,130,246,.9),rgba(30,64,175,.9));backdrop-filter:blur(12px)}.xbanner-nav{position:absolute;top:50%;transform:translateY(-50%);background:rgba(255,255,255,.9);border:none;width:50px;height:50px;border-radius:50%;font-size:1.5rem;color:#1e40af;cursor:pointer;transition:all .3s ease;z-index:3;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 10px rgba(0,0,0,.1);opacity:0}.xbanner:hover .xbanner-nav{opacity:1}.xbanner-nav:hover{background:#fff;box-shadow:0 4px 15px rgba(0,0,0,.2);transform:translateY(-50%) scale(1.1)}.xbanner-prev{left:2rem}.xbanner-next{right:2rem}.xbanner-dots{position:absolute;bottom:2rem;left:50%;transform:translateX(-50%);display:flex;gap:.5rem;z-index:3}.xbanner-dot{width:12px;height:12px;border-radius:50%;border:2px solid rgba(255,255,255,.8);background:transparent;cursor:pointer;transition:all .3s ease}.xbanner-dot.active{background:#fff;transform:scale(1.2)}.xbanner-dot:hover{background:rgba(255,255,255,.6)}.xbanner-progress{position:absolute;bottom:0;left:0;width:100%;height:3px;background:rgba(255,255,255,.3);z-index:3}.xbanner-progress-bar{height:100%;background:linear-gradient(90deg,#3b82f6,#1e40af);width:0%;transition:width .1s linear}

/* 单个轮播项内容对齐样式 */
.xbanner-align-left { text-align: left; align-items: flex-start; margin-left: 4rem; margin-right: auto; }
.xbanner-align-center { text-align: center; align-items: center; margin-left: auto; margin-right: auto; }
.xbanner-align-right { text-align: right; align-items: flex-end; margin-left: auto; margin-right: 4rem; }

/* 按钮对齐 */
.xbanner-align-left .xbanner-btn { align-self: flex-start; margin-left: 0; }
.xbanner-align-center .xbanner-btn { align-self: center; margin: 0 auto; }
.xbanner-align-right .xbanner-btn { align-self: flex-end; margin-right: 0; }

/* 移动端适配 */
@media (max-width:768px){.xbanner-content{padding:1rem;max-width:90%}.xbanner-title{font-size:calc(var(--title-size, 3rem) * 0.7)}.xbanner-desc{font-size:calc(var(--desc-size, 1.25rem) * 0.8);margin-bottom:1.5rem}.xbanner-btn{padding:8px 20px;font-size:.8rem;min-width:100px}.xbanner-nav{width:40px;height:40px;font-size:1.25rem}.xbanner-prev{left:1rem}.xbanner-next{right:1rem}.xbanner-dots{bottom:1.5rem}.xbanner-align-left{margin-left:2rem}.xbanner-align-right{margin-right:2rem}}@media (max-width:480px){.xbanner-title{font-size:calc(var(--title-size, 3rem) * 0.5)}.xbanner-desc{font-size:calc(var(--desc-size, 1.25rem) * 0.7)}.xbanner-nav{width:35px;height:35px;font-size:1rem}.xbanner-align-left{margin-left:1rem}.xbanner-align-right{margin-right:1rem}}