/* 陪练猫 - 代理招募页样式 v2.0 */
.hero{min-height:100vh;background:var(--gradient-hero);display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:100px 24px 60px;position:relative;overflow:hidden}
.hero::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:radial-gradient(circle at 20% 30%,rgba(0,102,255,0.08) 0%,transparent 50%),radial-gradient(circle at 80% 70%,rgba(0,196,140,0.06) 0%,transparent 50%);pointer-events:none}
.hero::after{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background-image:linear-gradient(rgba(0,102,255,0.02) 1px,transparent 1px),linear-gradient(90deg,rgba(0,102,255,0.02) 1px,transparent 1px);background-size:50px 50px;pointer-events:none;animation:gridMove 20s linear infinite}
@keyframes gridMove{0%{transform:translate(0,0)}100%{transform:translate(50px,50px)}}
.hero h1{font-size:clamp(36px,6vw,64px);font-weight:900;line-height:1.2;margin-bottom:20px;animation:fadeInUp .8s ease .2s both;color:var(--dark)}
.hero h1 .highlight{background:var(--gradient-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.hero-subtitle{font-size:clamp(16px,2.5vw,20px);color:var(--gray);margin-bottom:40px;max-width:600px;animation:fadeInUp .8s ease .4s both}
.hero-cta-group{display:flex;gap:var(--space-md);flex-wrap:wrap;justify-content:center;animation:fadeInUp .8s ease .6s both}
.advantages{padding:100px 24px;background:#f8f9fb;position:relative}
.advantages::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(0,102,255,0.3),transparent)}
.advantages-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-xl);max-width:800px;margin:0 auto}
@media(max-width:768px){.advantages-grid{grid-template-columns:1fr}}
.advantage-card{background:var(--white);border:1px solid rgba(0,102,255,0.1);border-radius:var(--radius-xl);padding:var(--space-2xl) var(--space-xl);text-align:center;transition:all var(--duration-normal) var(--easing-smooth);position:relative;overflow:hidden;box-shadow:var(--shadow-sm)}
.advantage-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:var(--gradient-primary);transform:scaleX(0);transition:transform var(--duration-normal) var(--easing-smooth)}
.advantage-card:hover{transform:translateY(-10px) scale(1.02);border-color:rgba(0,102,255,0.4);box-shadow:0 25px 80px rgba(0,102,255,0.15),0 0 40px rgba(0,102,255,0.1)}
.advantage-card:hover::before{transform:scaleX(1)}
.advantage-icon{width:80px;height:80px;background:var(--gradient-primary);border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto var(--space-lg);font-size:32px;color:var(--white);transition:all .6s ease}
.advantage-card:hover .advantage-icon{transform:scale(1.1) rotateY(180deg)}
.advantage-card h3{font-size:var(--text-xl);font-weight:700;margin-bottom:var(--space-sm);color:var(--dark)}
.advantage-card p{color:var(--gray);font-size:var(--text-sm);line-height:1.6;margin:0}
.institution{padding:100px 24px;background:linear-gradient(180deg,#e8f5f0 0%,#f0f8f5 50%,#e8f5f0 100%);position:relative}
.institution::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(0,196,140,0.4),transparent)}
.institution-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--space-xl);max-width:1000px;margin:0 auto}
.institution-card{background:var(--white);border:1px solid rgba(0,196,140,0.15);border-radius:var(--radius-xl);padding:var(--space-2xl);text-align:center;transition:all var(--duration-normal) var(--easing-smooth);box-shadow:var(--shadow-sm)}
.institution-card:hover{transform:translateY(-8px) scale(1.02);border-color:rgba(0,196,140,0.5);box-shadow:0 20px 60px rgba(0,196,140,0.15),0 0 30px rgba(0,196,140,0.08)}
.institution-card:hover .institution-icon{transform:scale(1.2);filter:drop-shadow(0 0 15px rgba(0,196,140,0.4))}
.institution-icon{font-size:48px;color:var(--secondary);margin-bottom:var(--space-lg);transition:all .4s ease}
.institution-card h3{font-size:var(--text-xl);font-weight:700;margin-bottom:var(--space-sm);color:var(--dark)}
.institution-card p{color:var(--gray);font-size:var(--text-sm);line-height:1.6;margin:0}
.profit{padding:100px 24px;background:linear-gradient(180deg,#fff8e8 0%,#fffef5 50%,#fff8e8 100%);position:relative}
.profit::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(255,180,0,0.4),transparent)}
.profit-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--space-xl);max-width:1000px;margin:0 auto}
.profit-card{background:var(--white);border:1px solid rgba(255,180,0,0.15);border-radius:var(--radius-xl);padding:var(--space-2xl) var(--space-xl);text-align:center;transition:all var(--duration-normal) var(--easing-smooth);position:relative;overflow:hidden;box-shadow:var(--shadow-sm)}
.profit-card::before{content:'';position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:linear-gradient(45deg,transparent 40%,rgba(255,180,0,0.08) 50%,transparent 60%);transform:translateX(-100%);transition:transform .6s ease}
.profit-card:hover::before{transform:translateX(100%)}
.profit-card:hover{transform:translateY(-8px);border-color:rgba(255,180,0,0.5);box-shadow:0 20px 60px rgba(255,180,0,0.15),0 0 30px rgba(255,180,0,0.08)}
.profit-card i{font-size:48px;background:linear-gradient(135deg,#FFB800 0%,#FF8C00 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:var(--space-lg)}
.profit-card h3{font-size:var(--text-xl);font-weight:700;margin-bottom:var(--space-sm);color:var(--dark)}
.profit-card p{color:var(--gray);font-size:var(--text-sm);line-height:1.6;margin:0}
.audience{padding:100px 24px;background:linear-gradient(180deg,#fff0f5 0%,#fff5f8 50%,#fff0f5 100%);position:relative}
.audience::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(255,107,107,0.3),transparent)}
.audience-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:var(--space-lg);max-width:1000px;margin:0 auto}
.audience-card{background:var(--white);border:1px solid rgba(255,107,107,0.1);border-radius:var(--radius-lg);padding:var(--space-xl);display:flex;align-items:flex-start;gap:var(--space-md);transition:all var(--duration-normal) var(--easing-smooth);box-shadow:var(--shadow-sm)}
.audience-card:hover{transform:translateY(-8px) scale(1.02);border-color:rgba(255,107,107,0.4);box-shadow:0 20px 60px rgba(255,107,107,0.12),0 0 30px rgba(255,107,107,0.06)}
.audience-card:hover .audience-icon{transform:rotateY(180deg) scale(1.1)}
.audience-icon{width:50px;height:50px;background:var(--gradient-primary);border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;font-size:22px;color:var(--white);flex-shrink:0;transition:all .6s ease}
.audience-card h3{font-size:var(--text-lg);font-weight:700;margin-bottom:var(--space-xs);color:var(--dark)}
.audience-card p{color:var(--gray);font-size:var(--text-sm);line-height:1.5;margin:0}
.process{padding:100px 24px;background:linear-gradient(180deg,#f5f0ff 0%,#faf5ff 50%,#f5f0ff 100%);position:relative}
.process::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(102,51,153,0.3),transparent)}
.process-steps{display:flex;justify-content:center;flex-wrap:wrap;gap:var(--space-2xl);max-width:1100px;margin:0 auto}
.process-step{text-align:center;flex:1;min-width:200px;max-width:250px;position:relative}
.process-step::after{content:'';position:absolute;top:40px;right:-20px;width:40px;height:2px;background:var(--gradient-primary)}
.process-step:last-child::after{display:none}
@media(max-width:768px){.process-step::after{display:none}.process-steps{flex-direction:column;align-items:center}}
.step-number{width:80px;height:80px;background:var(--gradient-primary);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:28px;font-weight:800;color:var(--white);margin:0 auto var(--space-lg);transition:all .4s ease;box-shadow:0 5px 20px rgba(0,102,255,0.25)}
.process-step:hover .step-number{transform:scale(1.1);box-shadow:0 10px 40px rgba(0,102,255,0.4),0 0 60px rgba(0,102,255,0.2)}
.process-step h3{font-size:var(--text-lg);font-weight:700;margin-bottom:var(--space-sm);color:var(--dark)}
.process-step p{color:var(--gray);font-size:var(--text-sm);margin:0}
.cta{padding:120px 24px;background:var(--gradient-primary);text-align:center;position:relative}
.cta::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,rgba(255,255,255,0.5),transparent)}
.cta h2{font-size:clamp(28px,4vw,42px);font-weight:800;margin-bottom:var(--space-md);color:var(--white)}
.cta p{color:rgba(255,255,255,0.9);font-size:var(--text-lg);margin-bottom:var(--space-2xl);max-width:600px;margin-left:auto;margin-right:auto}
.cta .btn-primary{background:var(--white);color:var(--primary);box-shadow:0 8px 30px rgba(0,0,0,0.2)}
.cta .btn-primary:hover{background:var(--light);transform:translateY(-3px);box-shadow:0 12px 40px rgba(0,0,0,0.3)}
.cta-wechat{margin-top:var(--space-xl)}
.cta-wechat img{width:140px;border-radius:var(--radius-lg);border:3px solid rgba(255,255,255,0.5);box-shadow:0 8px 30px rgba(0,0,0,0.2)}
.floating-wechat{position:fixed;right:80px;bottom:30px;z-index:999;display:flex;flex-direction:column;align-items:center;gap:var(--space-sm)}
.floating-wechat-qr{width:80px;background:var(--white);border-radius:var(--radius-lg);padding:var(--space-sm);box-shadow:var(--shadow-lg)}
.floating-wechat-qr img{width:100%;height:auto;display:block}
.floating-wechat-text{background:var(--gradient-primary);color:var(--white);padding:var(--space-xs) var(--space-md);border-radius:var(--radius-lg);font-size:var(--text-xs);font-weight:600;text-align:center;box-shadow:var(--shadow-md)}
@media(max-width:768px){.floating-wechat{right:var(--space-sm);bottom:20px}.floating-wechat-qr{width:50px}.floating-wechat-text{font-size:9px;padding:3px 8px}}
.floating-sidenav{position:fixed;right:20px;top:100px;z-index:998;display:flex;flex-direction:column;gap:4px;background:rgba(255,255,255,0.95);backdrop-filter:blur(20px);border:1px solid rgba(0,0,0,0.1);border-radius:var(--radius-xl);padding:10px 8px;box-shadow:0 8px 32px rgba(0,0,0,0.12)}
.sidenav-item{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;padding:var(--space-sm) 10px;border-radius:10px;cursor:pointer;transition:all .3s var(--easing-smooth);color:var(--gray);font-size:9px;font-weight:500;min-width:48px;text-decoration:none}
.sidenav-item i{font-size:16px;transition:all .3s ease}
.sidenav-item:hover{background:rgba(0,102,255,0.1);color:var(--primary);transform:scale(1.05)}
.sidenav-item:hover i{transform:translateY(-2px)}
.sidenav-item.active{background:var(--gradient-primary);color:var(--white);box-shadow:0 4px 15px rgba(0,102,255,0.3)}
@media(max-width:768px){.floating-sidenav{right:8px;top:70px;padding:6px 5px;gap:3px;border-radius:20px}.sidenav-item{padding:8px;min-width:38px;min-height:38px}.sidenav-item span{display:none}.sidenav-item i{font-size:16px}.sidenav-item:hover{transform:scale(1.1);background:rgba(0,102,255,0.15)}.floating-sidenav.auto-hide{opacity:0;transform:translateX(60px);pointer-events:none}}
@media(max-width:768px){.hero{padding:80px 16px 50px}.hero-cta-group{flex-direction:column;align-items:center}.btn-primary,.btn-secondary{width:100%;max-width:300px;justify-content:center}.advantages,.institution,.profit,.process,.cta{padding:70px 16px}}/* CTA修复 - 微信二维码上下排列 */
.cta-content{display:flex;flex-direction:column;align-items:center;gap:24px}
