.experience-section{background:linear-gradient(180deg,#f5f0ff 0,#fff 40%);padding:120px 0 80px;overflow:hidden;position:relative}.exp-container{max-width:1200px;margin:0 auto;padding:0 24px;position:relative}.exp-title{font-size:56px;font-weight:800;text-align:center;color:#1a1a2e;margin-bottom:12px;letter-spacing:-.02em;line-height:1.1}.exp-title-accent{color:#7c3aed}.exp-subtitle{font-size:20px;text-align:center;color:#6b7280;margin-bottom:60px;font-weight:400;line-height:1.5}.exp-theater{position:relative;height:520px;perspective:1200px;perspective-origin:50% 50%;margin-bottom:40px}.exp-spotlight{position:absolute;top:-100px;left:50%;width:500px;height:500px;transform:translateX(-50%);background:radial-gradient(ellipse,rgba(124,58,237,.05) 0,transparent 70%);pointer-events:none;z-index:0;transition:transform .8s}.exp-screen{position:absolute;top:50%;left:50%;transform-style:preserve-3d;cursor:pointer;will-change:transform,opacity}.exp-screen.active{cursor:default;z-index:10}.screen-frame{border-radius:12px;overflow:hidden;background:#fff;box-shadow:0 4px 6px rgba(0,0,0,.05),0 10px 20px rgba(0,0,0,.08),0 30px 60px rgba(0,0,0,.12),0 0 80px rgba(124,58,237,.04);position:relative}.screen-frame::after{content:'';position:absolute;top:0;left:-100%;width:60%;height:100%;background:linear-gradient(105deg,transparent 40%,rgba(255,255,255,.06) 45%,rgba(255,255,255,.02) 50%,transparent 55%);animation:10s ease-in-out infinite reflectionSweep;pointer-events:none;z-index:50}@keyframes reflectionSweep{0%{left:-100%}100%,12%{left:150%}}@keyframes workflowPulse{0%{left:0}100%{left:calc(100% - 8px)}}.frame-bar{height:32px;background:#f0f0f0;display:flex;align-items:center;padding:0 12px;gap:6px;border-bottom:1px solid #e5e5e5;position:relative;z-index:1}.frame-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}.frame-dot.red{background:#ff5f56}.frame-dot.yellow{background:#ffbd2e}.frame-dot.green{background:#27c93f}.frame-title{flex:1;text-align:center;font-size:11px;color:#999;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.frame-content{width:780px;height:460px;overflow:hidden;position:relative;background:#f8f9fa}.mockup{width:100%;height:100%;display:flex;position:relative;font-size:11px;color:#333}.mockup-sidebar{width:170px;background:#1a1a2e;flex-shrink:0;padding:16px 0;display:flex;flex-direction:column}.mockup-sidebar-logo{padding:0 16px;margin-bottom:20px;font-weight:700;font-size:13px;color:#fff}.mockup-sidebar-item{padding:8px 16px;color:rgba(255,255,255,.5);cursor:default;transition:background .2s;display:flex;align-items:center;gap:8px;font-size:11px}.mockup-sidebar-item.active{background:rgba(124,58,237,.3);color:#fff}.mockup-sidebar-item .sidebar-dot{width:6px;height:6px;border-radius:50%;background:currentColor;flex-shrink:0}.mockup-main{flex:1;padding:16px 20px;overflow:hidden;display:flex;flex-direction:column;gap:14px}.mockup-topbar{display:flex;justify-content:space-between;align-items:center}.mockup-topbar h3{font-size:15px;font-weight:700;color:#1a1a2e;margin:0}.mockup-btn{padding:4px 10px;border-radius:6px;background:#f0f0f0;font-size:10px;color:#666;display:inline-block;border:none;cursor:default}.mockup-btn.primary{background:#7c3aed;color:#fff}.mockup-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.mockup-kpi{background:#fff;border-radius:8px;padding:12px;box-shadow:0 1px 3px rgba(0,0,0,.06)}.mockup-kpi-label{font-size:9px;color:#888;text-transform:uppercase;letter-spacing:.5px;margin-bottom:4px}.mockup-kpi-value{font-size:20px;font-weight:700;color:#1a1a2e}.mockup-kpi-change{font-size:9px;margin-top:2px}.mockup-kpi-change.up{color:#16a34a}.mockup-kpi-change.down{color:#dc2626}.mockup-chart{flex:1;background:#fff;border-radius:8px;padding:12px;box-shadow:0 1px 3px rgba(0,0,0,.06);position:relative;min-height:120px;overflow:hidden}.mockup-chart svg{width:100%;height:100%;position:absolute;top:12px;left:12px;right:12px;bottom:12px}.mockup-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:8px;flex:1;overflow:hidden}.mockup-card{background:#fff;border-radius:8px;padding:10px;box-shadow:0 1px 3px rgba(0,0,0,.06)}.mockup-card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}.mockup-card-title{font-weight:600;font-size:11px}.mockup-card-status{width:8px;height:8px;border-radius:50%}.mockup-card-bar{height:4px;border-radius:2px;background:#e5e7eb;overflow:hidden}.mockup-card-bar-fill{height:100%;border-radius:2px;transition:width 1s}.mockup-table{flex:1;overflow:hidden}.mockup-table-header{display:grid;gap:8px;padding:6px 10px;font-size:9px;font-weight:600;color:#888;text-transform:uppercase;border-bottom:1px solid #e5e7eb}.mockup-table-row{display:grid;gap:8px;padding:8px 10px;border-bottom:1px solid #f3f4f6;font-size:10px;align-items:center}.mockup-table-row:hover{background:#f9fafb}.mockup-columns{display:flex;gap:10px;flex:1;overflow:hidden}.mockup-col{flex:1;background:#f3f4f6;border-radius:8px;padding:8px;display:flex;flex-direction:column;gap:6px}.mockup-col-title{font-size:9px;font-weight:700;text-transform:uppercase;color:#888;padding:4px 0}.mockup-col-card{background:#fff;border-radius:6px;padding:8px;font-size:10px;box-shadow:0 1px 2px rgba(0,0,0,.05);border-left:3px solid var(--col-color,#7c3aed)}.ghost-cursor{position:absolute;width:16px;height:16px;border-radius:50%;background:rgba(124,58,237,.3);border:2px solid rgba(124,58,237,.6);pointer-events:none;z-index:100;opacity:0;transform:translate(-50%,-50%)}.ghost-cursor.visible{opacity:1}.ghost-cursor-click{position:absolute;width:30px;height:30px;border-radius:50%;border:2px solid rgba(124,58,237,.4);pointer-events:none;z-index:99;opacity:0;transform:translate(-50%,-50%) scale(0)}.mockup-toast{position:absolute;bottom:12px;right:12px;background:#fff;border-radius:8px;padding:8px 14px;box-shadow:0 4px 12px rgba(0,0,0,.12);font-size:10px;display:flex;align-items:center;gap:6px;z-index:80;transform:translateY(20px);opacity:0;transition:.3s}.mockup-toast.visible{transform:translateY(0);opacity:1}.mockup-toast-icon{width:16px;height:16px;border-radius:50%;background:#16a34a;display:flex;align-items:center;justify-content:center;color:#fff;font-size:8px;flex-shrink:0}.exp-nav{position:absolute;top:calc(50% - 24px);transform:translateY(-50%);width:48px;height:48px;border-radius:50%;background:rgba(255,255,255,.9);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,.08);cursor:pointer;display:flex;align-items:center;justify-content:center;color:#7c3aed;z-index:20;transition:.2s;box-shadow:0 2px 8px rgba(0,0,0,.08)}.exp-nav:hover{transform:translateY(-50%) scale(1.1);box-shadow:0 4px 16px rgba(124,58,237,.2)}.exp-nav:disabled{opacity:.3;pointer-events:none}.exp-nav-left{left:16px}.exp-nav-right{right:16px}.exp-info{text-align:center;margin-bottom:24px;position:relative}.exp-counter{display:inline-flex;align-items:center;gap:4px;font-size:14px;font-weight:600;color:#7c3aed;margin-bottom:12px;position:relative}.exp-counter-current{min-width:20px;display:inline-block}.exp-counter-sep{color:#ccc;margin:0 2px}.exp-counter-total{color:#999}.exp-autoplay-ring{display:none}.exp-feature-title{font-size:24px;font-weight:700;color:#1a1a2e;margin-bottom:6px;min-height:32px;line-height:1.3}.exp-feature-desc{font-size:15px;color:#6b7280;margin-bottom:16px;min-height:24px;line-height:1.5}.exp-highlights{display:flex;justify-content:center;gap:8px;flex-wrap:wrap}.exp-highlight{padding:5px 14px;border-radius:20px;background:rgba(124,58,237,.08);color:#7c3aed;font-size:12px;font-weight:500}.exp-progress{margin-bottom:24px}.exp-progress-track{height:2px;background:#e5e7eb;border-radius:1px;margin-bottom:12px;position:relative}.exp-progress-fill{height:100%;background:#7c3aed;border-radius:1px;transition:width .4s;width:0%}.exp-progress-dots{display:flex;justify-content:space-between;padding:0 4px}.exp-progress-dot{width:8px;height:8px;border-radius:50%;background:#d1d5db;cursor:pointer;transition:.2s;border:none;padding:0}.exp-progress-dot.active{background:#7c3aed;transform:scale(1.4)}.exp-progress-dot:hover{background:#a78bfa}.exp-filmstrip{overflow-x:auto;padding:8px 0 16px;scrollbar-width:none;-webkit-overflow-scrolling:touch}.exp-filmstrip::-webkit-scrollbar{display:none}.exp-filmstrip-track{display:flex;gap:10px;padding:0 4px}.exp-filmstrip-thumb{flex-shrink:0;width:100px;cursor:pointer;transition:.2s;position:relative}.exp-filmstrip-thumb.active,.exp-filmstrip-thumb:hover{transform:translateY(-2px)}.exp-filmstrip-thumb-frame{height:60px;border-radius:6px;overflow:hidden;border:2px solid transparent;background:#f3f4f6;transition:border-color .2s;display:flex;align-items:center;justify-content:center}.exp-filmstrip-thumb.active .exp-filmstrip-thumb-frame{border-color:#7c3aed}.exp-filmstrip-thumb-num{font-size:16px;font-weight:700;color:#d1d5db;transition:color .2s}.exp-filmstrip-thumb.active .exp-filmstrip-thumb-num{color:#7c3aed}.exp-filmstrip-thumb-label{font-size:9px;color:#999;text-align:center;margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.exp-zoom-overlay{position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:1000;display:none;align-items:center;justify-content:center;flex-direction:column;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}.exp-zoom-overlay.active{display:flex}.exp-zoom-close{position:absolute;top:24px;right:24px;width:48px;height:48px;border-radius:50%;background:rgba(255,255,255,.15);border:none;color:#fff;font-size:28px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s}.exp-zoom-close:hover{background:rgba(255,255,255,.3)}.exp-zoom-hint{position:absolute;bottom:40px;color:rgba(255,255,255,.6);font-size:13px}@media (max-width:1200px){.exp-theater{height:440px}.frame-content{width:640px;height:380px}.exp-title{font-size:44px}}@media (max-width:768px){.experience-section{padding:80px 0 60px}.exp-autoplay-ring{display:none}.exp-title{font-size:32px}.exp-subtitle{font-size:16px;margin-bottom:36px}.exp-theater{height:auto;perspective:none;overflow-x:auto;scroll-snap-type:x mandatory;display:flex;gap:16px;padding:0 24px 16px;scrollbar-width:none;-webkit-overflow-scrolling:touch;margin-bottom:24px}.exp-theater::-webkit-scrollbar{display:none}.exp-screen{position:relative;top:auto;left:auto;transform:none!important;flex-shrink:0;scroll-snap-align:center;opacity:1!important}.frame-content{width:calc(100vw - 80px);height:320px}.exp-filmstrip,.exp-spotlight{display:none}.exp-nav{width:40px;height:40px}.exp-nav-left{left:8px}.exp-nav-right{right:8px}.exp-progress-dot{width:12px;height:12px}.exp-progress-dot.active{transform:scale(1.3)}.ghost-cursor,.ghost-cursor-click{display:none!important}.exp-feature-title{font-size:20px}.exp-feature-desc{font-size:14px}.mockup-sidebar{width:120px}.mockup-kpis{grid-template-columns:repeat(2,1fr)}.mockup-kpi-value{font-size:16px}}@media (prefers-reduced-motion:reduce){.exp-screen{transform:none!important;position:relative;top:auto;left:auto}.exp-theater{height:auto;perspective:none;display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:16px}.screen-frame::after{animation:none}.ghost-cursor,.ghost-cursor-click{display:none!important}.exp-spotlight{display:none}.exp-progress-fill,.mockup-card-bar-fill,.mockup-toast{transition:none}.exp-nav:hover{transform:translateY(-50%)}.exp-filmstrip-thumb.active,.exp-filmstrip-thumb:hover,.exp-progress-dot.active{transform:none}}.exp-screen ::selection{background:rgba(124,58,237,.2)}.exp-filmstrip-thumb:focus-visible,.exp-nav:focus-visible,.exp-progress-dot:focus-visible,.exp-zoom-close:focus-visible{outline:#7C3AED solid 2px;outline-offset:2px}