@charset "UTF-8";
:root{
  --brand:#1678F2;
  --brand-dark:#0757DB;
  --brand-soft:#EAF5FF;
  --ink:#202536;
  --ink-2:#3d4658;
  --muted:#778092;
  --line:#e9edf3;
  --paper:#fff;
  --bg:#fafbfc;
  --shadow:0 24px 70px rgba(38,45,68,.10);
  --radius:22px;
  --container:1180px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:88px}
body{margin:0;background:var(--bg);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans SC","Helvetica Neue",Arial,sans-serif;line-height:1.65;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
button{font:inherit}
img,svg{display:block;max-width:100%}
.container{width:min(var(--container),calc(100% - 48px));margin:0 auto}
.site-header{height:78px;position:sticky;top:0;z-index:50;background:rgba(255,255,255,.92);backdrop-filter:blur(18px);border-bottom:1px solid rgba(231,235,241,.9)}
.nav-wrap{height:100%;display:flex;align-items:center;justify-content:space-between;gap:28px}
.brand{display:inline-flex;align-items:center;gap:11px;font-size:17px;font-weight:800;letter-spacing:-.4px;white-space:nowrap}
.brand-logo{width:38px;height:38px}
.main-nav{display:flex;align-items:center;gap:34px;margin-left:auto;margin-right:22px}
.main-nav a,.nav-support{font-size:14px;font-weight:600;color:#5c6473;transition:color .2s}
.main-nav a:hover,.nav-support:hover{color:var(--brand)}
.nav-actions{display:flex;align-items:center;gap:22px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;border:0;border-radius:12px;font-weight:700;transition:transform .2s,box-shadow .2s,background .2s;cursor:pointer}
.btn:hover{transform:translateY(-2px)}
.btn-primary{background:var(--brand);color:#fff;box-shadow:0 10px 24px rgba(22,120,242,.22)}
.btn-primary:hover{background:var(--brand-dark);box-shadow:0 14px 28px rgba(22,120,242,.28)}
.btn-nav{height:43px;padding:0 18px;font-size:13px;border-radius:10px}
.btn-large{min-height:54px;padding:0 23px;font-size:15px;border-radius:13px}
.btn-large svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.btn-secondary{background:#fff;color:#333c4d;border:1px solid #e6e9ef}
.btn-secondary:hover{border-color:#9CCBFF;color:var(--brand)}
.mobile-menu-btn{display:none;border:0;background:none;padding:8px}
.mobile-menu-btn span{display:block;width:22px;height:2px;background:#343b4a;margin:4px;border-radius:3px}
.hero{position:relative;overflow:hidden;padding:88px 0 80px;background:linear-gradient(118deg,#fff 0%,#F4F9FF 54%,#EEF6FF 100%)}
.hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:.92fr 1.08fr;align-items:center;gap:44px}
.hero-orb{position:absolute;border-radius:50%;filter:blur(1px);pointer-events:none}
.hero-orb-one{width:520px;height:520px;right:-150px;top:-250px;background:radial-gradient(circle,rgba(63,163,255,.22),transparent 68%)}
.hero-orb-two{width:360px;height:360px;left:-230px;bottom:-210px;background:radial-gradient(circle,rgba(102,190,255,.28),transparent 70%)}
.eyebrow,.section-kicker,.download-kicker{display:inline-flex;align-items:center;gap:9px;font-size:11px;font-weight:800;letter-spacing:1.7px;color:var(--brand)}
.eyebrow{padding:8px 12px;border:1px solid #D4E9FF;background:rgba(255,255,255,.78);border-radius:999px;letter-spacing:1.1px}
.eyebrow-dot{width:7px;height:7px;border-radius:50%;background:var(--brand);box-shadow:0 0 0 4px rgba(22,120,242,.12)}
.hero h1{font-size:clamp(48px,5.2vw,70px);line-height:1.13;letter-spacing:-3.6px;margin:24px 0 18px;font-weight:900}
.hero h1 span,.section-heading h2 span,.showcase-copy h2 span{color:var(--brand)}
.hero-lead{font-size:16px;line-height:1.95;color:#697284;max-width:500px;margin:0}
.hero-actions{display:flex;gap:13px;flex-wrap:wrap;margin-top:31px}
.hero-meta{display:flex;gap:18px;flex-wrap:wrap;margin-top:28px;color:#7a8290;font-size:12px}
.hero-meta span{display:inline-flex;align-items:center;gap:6px}
.check-icon{font-style:normal;width:16px;height:16px;border-radius:50%;display:inline-grid;place-items:center;color:#fff;background:#35b883;font-size:10px;font-weight:800}
.hero-visual{position:relative;padding:18px 0 28px 10px;min-width:0}
.visual-glow{position:absolute;inset:7% 2% 8% 4%;background:radial-gradient(ellipse,rgba(55,155,255,.20),transparent 68%);filter:blur(20px)}
.app-window{position:relative;z-index:1;background:#fff;border:1px solid rgba(220,235,255,.95);border-radius:17px;overflow:hidden;box-shadow:0 32px 85px rgba(28,95,180,.16);transform:perspective(1200px) rotateY(-4deg) rotateX(1deg)}
.app-titlebar{height:48px;background:#fff;border-bottom:1px solid #edf0f4;display:flex;align-items:center;justify-content:space-between;padding:0 17px}
.app-brand-mini{display:flex;align-items:center;gap:8px;font-size:12px;color:#343b49}
.app-brand-mini img{width:23px;height:23px}
.window-dots{display:flex;gap:6px}.window-dots i{width:7px;height:7px;border-radius:50%;background:#d9dce2}.window-dots i:last-child{background:#45B9FF}
.app-body{display:grid;grid-template-columns:145px 1fr;min-height:350px;background:#f8f9fb}
.app-sidebar{background:#fff;border-right:1px solid #edf0f4;padding:18px 10px;position:relative}
.sidebar-caption{font-size:10px;color:#a0a6b1;padding:0 9px 11px}
.sidebar-item{height:36px;display:flex;align-items:center;gap:9px;padding:0 10px;color:#737b8b;font-size:11px;border-radius:8px;margin-bottom:5px}
.sidebar-item.active{background:#EAF5FF;color:var(--brand);font-weight:700}
.side-icon{font-size:15px;width:15px;text-align:center}
.sidebar-bottom{position:absolute;bottom:16px;left:14px;display:flex;align-items:center;gap:7px;font-size:10px;color:#8d95a3}
.side-avatar{width:22px;height:22px;display:grid;place-items:center;border-radius:7px;background:#EAF5FF;color:var(--brand);font-weight:800}
.editor-area{padding:19px 17px 14px;min-width:0}
.editor-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:15px}
.editor-heading small{display:block;font-size:9px;color:#9ba2af;margin-bottom:2px}
.editor-heading strong{font-size:14px}
.project-pill{font-size:9px;color:#2aa978;background:#e9f8f1;padding:4px 9px;border-radius:99px}
.track-panel{position:relative;background:#fff;border:1px solid #edf0f4;border-radius:10px;padding:12px 12px 14px;overflow:hidden}
.track-toolbar{display:flex;justify-content:space-between;font-size:10px;font-weight:700;color:#667082}
.track-toolbar div{display:flex;align-items:center;gap:8px;color:#9aa2b0}
.zoom-line{width:40px;height:3px;border-radius:4px;background:#e7eaf0;position:relative}
.zoom-line:after{content:"";position:absolute;width:10px;height:10px;left:15px;top:-3.5px;background:var(--brand);border:2px solid white;border-radius:50%;box-shadow:0 0 0 1px #9ACBFF}
.ruler{display:flex;justify-content:space-between;color:#a1a8b4;font-size:8px;padding:14px 2px 7px 85px}
.audio-track{height:65px;background:#F4F9FF;border:1px solid #D7EAFF;border-radius:7px;display:flex;align-items:center;overflow:hidden;margin-bottom:8px}
.second-track{background:#fff9fb;border-color:#f8e6ed}
.track-label{width:84px;flex-shrink:0;padding-left:9px;display:flex;align-items:center;gap:5px;font-size:9px;color:#71798a}
.track-note{width:18px;height:18px;display:grid;place-items:center;background:#EAF5FF;border-radius:5px;color:var(--brand);font-size:11px}
.track-note.pink{background:#fceaf0;color:#df7191}
.wave{height:40px;flex:1;display:flex;align-items:center;gap:2px;padding:0 7px;overflow:hidden}
.wave i{display:block;flex:1;min-width:2px;border-radius:3px;background:linear-gradient(180deg,#55BFFF,#1678F2)}
.wave-pink i{background:linear-gradient(180deg,#f7afc3,#df7191)}
.playhead{position:absolute;top:49px;bottom:15px;left:58%;width:1px;background:#1678F2;z-index:2}
.playhead span{position:absolute;top:-3px;left:-4px;width:9px;height:9px;background:var(--brand);transform:rotate(45deg);border-radius:2px}
.selection-tag{position:absolute;right:14px;bottom:6px;font-size:8px;color:#176FE6;background:#EAF5FF;padding:3px 6px;border-radius:4px}
.selection-tag b{font-weight:700}
.player-panel{margin-top:10px;padding:10px 12px;background:#fff;border:1px solid #edf0f4;border-radius:9px;display:flex;align-items:center;justify-content:space-between}
.player-file{display:flex;align-items:center;gap:8px;min-width:0}
.file-wave{width:28px;height:28px;border-radius:7px;background:#EAF5FF;color:var(--brand);display:grid;place-items:center;font-size:16px}
.player-file b{display:block;font-size:10px}.player-file small{display:block;color:#a0a6b2;font-size:8px}
.player-controls{display:flex;align-items:center;gap:11px}.muted-control{color:#a7adba;font-size:11px}
.play-button{width:28px;height:28px;border-radius:50%;background:var(--brand);color:#fff;display:grid;place-items:center;font-size:10px;padding-left:2px;box-shadow:0 5px 12px rgba(22,120,242,.22)}
.player-time{font-size:9px;font-weight:700;color:#5e6675}.player-time em{font-style:normal;color:#a3aab5;font-weight:400}
.tool-strip{display:flex;justify-content:space-between;padding:11px 8px 0;color:#71798a;font-size:9px}
.tool-strip span{display:flex;align-items:center;gap:5px}.tool-strip b{font-size:14px;color:var(--brand);font-weight:500}
.floating-note{position:absolute;z-index:2;display:flex;align-items:center;gap:9px;background:rgba(255,255,255,.96);border:1px solid #DDEBFB;border-radius:12px;padding:10px 14px;box-shadow:0 12px 32px rgba(46,45,53,.12)}
.floating-note b{display:block;font-size:10px;color:#303747}.floating-note small{display:block;font-size:8px;color:#9299a6}
.note-top{right:-22px;top:1px}.note-bottom{left:-22px;bottom:4px}
.note-icon,.note-check{width:29px;height:29px;display:grid;place-items:center;border-radius:9px;background:#EAF5FF;color:var(--brand);font-size:16px}
.note-check{background:#e9f8f1;color:#2eaf7d;font-weight:900}
.visual-caption{position:absolute;bottom:0;right:8px;font-size:9px;color:#a0a5af}
.proof-bar{background:#fff;border-top:1px solid #f1f2f5;border-bottom:1px solid #f1f2f5}
.proof-inner{display:grid;grid-template-columns:repeat(4,1fr);padding:22px 0}
.proof-inner>div{padding:0 26px;border-right:1px solid #eceff3}
.proof-inner>div:first-child{padding-left:0}.proof-inner>div:last-child{border:0}
.proof-inner b{display:block;font-size:13px;color:#3c4554}.proof-inner span{display:block;font-size:11px;color:#969eab;margin-top:3px}
.section{padding:100px 0}
.section-heading{text-align:center;max-width:700px;margin:0 auto 48px}
.section-kicker{margin-bottom:13px}
.section-heading h2,.showcase-copy h2{font-size:clamp(32px,4vw,44px);line-height:1.25;letter-spacing:-1.8px;margin:0 0 13px;font-weight:900}
.section-heading p{font-size:14px;color:#828a98;margin:0}
.feature-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.feature-card{position:relative;min-height:226px;background:#fff;border:1px solid #edf0f4;border-radius:17px;padding:23px 21px;overflow:hidden;transition:transform .22s,box-shadow .22s,border-color .22s}
.feature-card:hover{transform:translateY(-5px);border-color:#B7D8FF;box-shadow:0 18px 38px rgba(38,45,68,.07)}
.feature-card-main{grid-column:span 2;background:linear-gradient(125deg,#EFF7FF,#fff 74%);min-height:226px}
.feature-icon{width:43px;height:43px;border-radius:13px;display:grid;place-items:center;margin-bottom:16px}
.feature-icon svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.feature-icon.orange{background:#EAF5FF;color:#1678F2}.feature-icon.purple{background:#f1edff;color:#8669df}.feature-icon.blue{background:#eaf2ff;color:#5488e9}.feature-icon.yellow{background:#fff6dc;color:#d79b27}.feature-icon.pink{background:#ffedf2;color:#df7191}.feature-icon.green{background:#e9f8f1;color:#36aa7d}.feature-icon.cyan{background:#e7f7fa;color:#35a4b6}.feature-icon.gray{background:#f0f2f5;color:#788291}
.feature-index{display:block;font-size:9px;letter-spacing:1.2px;font-weight:800;color:#b0b6c0;margin-bottom:6px}
.feature-card h3{font-size:17px;margin:0 0 7px;letter-spacing:-.4px}
.feature-card p{font-size:12px;color:#858d9a;line-height:1.8;margin:0;max-width:260px}
.feature-card-main .feature-text{position:relative;z-index:1;max-width:280px}
.feature-card-main .feature-icon{margin-bottom:12px}
.mini-wave{position:absolute;right:20px;bottom:26px;width:42%;height:70px;display:flex;align-items:center;gap:3px;opacity:.8}
.mini-wave i{flex:1;border-radius:5px;background:linear-gradient(180deg,#69C8FF,#1678F2);height:var(--h,40%)}
.mini-wave i:nth-child(3n){height:78%}.mini-wave i:nth-child(3n + 1){height:34%}.mini-wave i:nth-child(4n){height:58%}.mini-wave i:nth-child(5n){height:92%}
.section-footnote{text-align:right;font-size:10px;color:#a3a9b3;margin-top:18px}
.editor-showcase{padding:95px 0;background:#F3F9FF;overflow:hidden}
.showcase-grid{display:grid;grid-template-columns:.8fr 1.2fr;align-items:center;gap:65px}
.showcase-copy h2{margin:0 0 18px}
.showcase-copy>p{font-size:14px;line-height:1.95;color:#788191;max-width:420px;margin:0}
.check-list{list-style:none;padding:0;margin:25px 0 23px;display:grid;gap:11px}
.check-list li{font-size:12px;color:#5f6878;display:flex;align-items:center;gap:9px}
.check-list li span{display:grid;place-items:center;width:18px;height:18px;border-radius:50%;background:#e8f7ef;color:#2eaf7d;font-size:11px;font-weight:800}
.text-link{display:inline-flex;align-items:center;gap:10px;color:var(--brand);font-size:13px;font-weight:800}
.text-link b{font-size:17px;transition:transform .2s}.text-link:hover b{transform:translateX(4px)}
.showcase-visual{position:relative;padding:15px 0}
.showcase-card{position:relative;background:#fff;border:1px solid #DCEBFA;border-radius:19px;padding:22px 24px 18px;box-shadow:0 24px 65px rgba(28,95,180,.10);overflow:hidden}
.showcase-card-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:28px;font-size:12px}
.showcase-card-head>div{display:flex;align-items:center;gap:8px}.showcase-card-head>span{font-size:9px;color:#a5aab4;background:#f5f6f8;padding:4px 8px;border-radius:5px}
.live-dot{width:7px;height:7px;background:#37bd89;border-radius:50%;box-shadow:0 0 0 4px #e7f8f0}
.large-ruler{display:flex;justify-content:space-between;padding-left:98px;color:#a2a9b4;font-size:9px;margin-bottom:12px}
.large-track{height:83px;border:1px solid #DCEBFA;border-radius:9px;margin-bottom:10px;display:flex;align-items:center;overflow:hidden;position:relative}
.large-track label{width:98px;flex-shrink:0;padding-left:13px;font-size:10px;color:#737c8b}
.large-wave{height:49px;flex:1;margin-right:10px;border-radius:6px;position:relative;overflow:hidden}
.large-wave:before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0 5px,rgba(255,255,255,.2) 5px 7px),linear-gradient(180deg,rgba(255,255,255,.22),transparent 55%,rgba(255,255,255,.16))}
.orange-wave{background:repeating-linear-gradient(90deg,#1688F4 0 4px,transparent 4px 7px);clip-path:polygon(0 42%,3% 20%,6% 55%,9% 14%,12% 60%,15% 30%,18% 75%,21% 23%,24% 45%,27% 10%,30% 68%,33% 35%,36% 75%,39% 20%,42% 56%,45% 12%,48% 65%,51% 30%,54% 80%,57% 25%,60% 53%,63% 12%,66% 70%,69% 28%,72% 82%,75% 24%,78% 55%,81% 12%,84% 68%,87% 25%,90% 60%,93% 18%,96% 74%,100% 40%,100% 60%,96% 85%,93% 40%,90% 82%,87% 75%,84% 90%,81% 45%,78% 90%,75% 76%,72% 94%,69% 55%,66% 88%,63% 45%,60% 95%,57% 75%,54% 94%,51% 70%,48% 90%,45% 45%,42% 90%,39% 80%,36% 96%,33% 65%,30% 90%,27% 45%,24% 85%,21% 70%,18% 92%,15% 55%,12% 85%,9% 60%,6% 90%,3% 65%,0 58%)}
.coral-wave{background:repeating-linear-gradient(90deg,#e99ab0 0 4px,transparent 4px 7px);clip-path:polygon(0 50%,3% 32%,6% 72%,9% 12%,12% 60%,15% 25%,18% 83%,21% 33%,24% 56%,27% 17%,30% 76%,33% 30%,36% 88%,39% 18%,42% 62%,45% 20%,48% 73%,51% 36%,54% 80%,57% 26%,60% 65%,63% 12%,66% 82%,69% 30%,72% 75%,75% 18%,78% 60%,81% 22%,84% 82%,87% 34%,90% 68%,93% 20%,96% 76%,100% 50%,100% 55%,96% 85%,93% 42%,90% 90%,87% 65%,84% 94%,81% 48%,78% 92%,75% 40%,72% 95%,69% 58%,66% 94%,63% 42%,60% 90%,57% 70%,54% 95%,51% 65%,48% 90%,45% 45%,42% 90%,39% 80%,36% 96%,33% 70%,30% 90%,27% 48%,24% 85%,21% 72%,18% 94%,15% 62%,12% 86%,9% 65%,6% 92%,3% 65%,0 55%)}
.purple-wave{background:repeating-linear-gradient(90deg,#9b8be8 0 4px,transparent 4px 7px);clip-path:polygon(0 40%,3% 20%,6% 62%,9% 16%,12% 70%,15% 28%,18% 82%,21% 20%,24% 55%,27% 13%,30% 70%,33% 34%,36% 82%,39% 20%,42% 62%,45% 15%,48% 73%,51% 30%,54% 80%,57% 20%,60% 64%,63% 12%,66% 78%,69% 25%,72% 72%,75% 18%,78% 60%,81% 14%,84% 82%,87% 32%,90% 66%,93% 17%,96% 78%,100% 42%,100% 58%,96% 88%,93% 44%,90% 91%,87% 68%,84% 95%,81% 45%,78% 90%,75% 42%,72% 94%,69% 58%,66% 92%,63% 42%,60% 90%,57% 72%,54% 96%,51% 68%,48% 92%,45% 42%,42% 92%,39% 80%,36% 96%,33% 68%,30% 90%,27% 45%,24% 85%,21% 70%,18% 94%,15% 60%,12% 88%,9% 63%,6% 90%,3% 65%,0 58%)}
.large-playhead{position:absolute;top:70px;bottom:72px;left:58%;width:2px;background:var(--brand);box-shadow:0 0 0 4px rgba(22,120,242,.08)}
.showcase-controls{display:flex;align-items:center;gap:16px;padding:12px 4px 0}
.time-label{font-size:11px;font-weight:800;color:#515b6c;white-space:nowrap}.time-label i{font-style:normal;color:#a0a7b2;font-weight:400}
.control-play{width:35px;height:35px;display:grid;place-items:center;border-radius:50%;background:var(--brand);color:#fff;font-size:12px;padding-left:2px;box-shadow:0 8px 16px rgba(22,120,242,.2)}
.control-progress{height:4px;background:#edf0f3;border-radius:5px;flex:1;overflow:hidden}.control-progress span{display:block;width:38%;height:100%;background:var(--brand);border-radius:5px}
.control-volume{font-size:18px;color:#87909e}
.showcase-sticker{position:absolute;right:-22px;bottom:2px;background:#fff;border:1px solid #DCEBFA;border-radius:12px;padding:11px 15px;box-shadow:0 12px 28px rgba(28,95,180,.10)}
.showcase-sticker b{display:block;color:var(--brand);font-size:11px}.showcase-sticker span{display:block;color:#8c94a1;font-size:9px}
.scenarios-section{background:#fafbfc}
.scenario-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.scenario-card{background:#fff;border:1px solid #edf0f4;border-radius:17px;overflow:hidden;transition:transform .2s,box-shadow .2s}
.scenario-card:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(38,45,68,.07)}
.scenario-art{height:170px;position:relative;display:grid;place-items:center;overflow:hidden}
.art-music{background:linear-gradient(135deg,#EAF5FF,#DCEEFF)}
.music-disc{width:108px;height:108px;border-radius:50%;background:repeating-radial-gradient(circle,#57BFFF 0 2px,#1678F2 3px 5px,#8AD8FF 6px 8px);box-shadow:0 15px 28px rgba(22,120,242,.18);position:relative}
.music-disc:after{content:"";position:absolute;inset:43px;border-radius:50%;background:#F3F9FF;border:7px solid #A8D9FF}
.music-note{position:absolute;font-size:39px;color:#fff;right:29%;top:24%;text-shadow:0 5px 12px rgba(22,95,210,.22)}
.art-voice{background:linear-gradient(135deg,#f2edff,#e8e2ff)}
.voice-ring{width:120px;height:120px;border:2px solid rgba(134,105,223,.35);border-radius:50%;box-shadow:0 0 0 13px rgba(134,105,223,.08),0 0 0 26px rgba(134,105,223,.05);position:relative}
.voice-ring:before,.voice-ring:after{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);border:2px solid #9a86e6;border-radius:50%;width:55px;height:55px}
.voice-ring:after{width:18px;height:18px;background:#9a86e6}
.voice-mic{position:absolute;font-size:32px;color:#7964cf;top:24px;right:30%}
.art-bgm{background:linear-gradient(135deg,#e8f4ff,#dcecff)}
.bgm-card{width:122px;height:76px;border-radius:12px;background:#fff;display:grid;place-items:center;color:#5687d7;font-weight:900;font-size:21px;letter-spacing:3px;box-shadow:0 14px 26px rgba(79,128,193,.15);transform:rotate(-8deg)}
.bgm-wave{position:absolute;width:165px;height:24px;bottom:38px;left:calc(50% - 82px);background:repeating-linear-gradient(90deg,#6c9ce0 0 3px,transparent 3px 8px);clip-path:polygon(0 45%,4% 20%,8% 80%,12% 5%,16% 75%,20% 25%,24% 95%,28% 18%,32% 78%,36% 10%,40% 85%,44% 25%,48% 95%,52% 10%,56% 80%,60% 18%,64% 90%,68% 20%,72% 82%,76% 5%,80% 70%,84% 25%,88% 90%,92% 18%,96% 75%,100% 40%,100% 60%,96% 92%,92% 45%,88% 95%,84% 50%,80% 90%,76% 40%,72% 96%,68% 48%,64% 98%,60% 45%,56% 96%,52% 40%,48% 98%,44% 50%,40% 95%,36% 40%,32% 96%,28% 48%,24% 99%,20% 50%,16% 95%,12% 40%,8% 99%,4% 50%,0 55%)}
.scenario-card>div:last-child{padding:20px 22px 23px}
.scenario-card h3{margin:0 0 7px;font-size:16px}.scenario-card p{margin:0;color:#858d9a;font-size:12px;line-height:1.8}
.workflow-section{background:#fff}
.workflow-grid{display:grid;grid-template-columns:1fr 40px 1fr 40px 1fr;align-items:center;gap:14px}
.workflow-step{position:relative;min-height:220px;border:1px solid #edf0f4;border-radius:17px;padding:25px;background:#fff}
.step-number{position:absolute;top:18px;right:20px;font-size:11px;font-weight:900;letter-spacing:1px;color:#d5d9e0}
.step-icon{width:48px;height:48px;border-radius:14px;background:#EAF5FF;color:var(--brand);display:grid;place-items:center;margin-bottom:20px}
.step-icon svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.workflow-step h3{font-size:16px;margin:0 0 7px}.workflow-step p{font-size:12px;color:#858d9a;line-height:1.8;margin:0}
.step-connector{color:#5DAFFF;font-size:24px;text-align:center}
.benefits-section{background:#202638;color:#fff;padding:83px 0}
.benefits-wrap{display:grid;grid-template-columns:.8fr 1.2fr;gap:100px;align-items:center}
.benefits-heading .section-kicker{color:#67C5FF}
.benefits-heading h2{font-size:40px;line-height:1.3;letter-spacing:-1.5px;margin:12px 0}
.benefits-heading p{font-size:13px;color:#aeb5c2;max-width:300px}
.benefit-list{display:grid;gap:0}
.benefit-list article{display:flex;gap:22px;padding:22px 0;border-bottom:1px solid rgba(255,255,255,.12)}
.benefit-list article:last-child{border:0}
.benefit-number{font-size:12px;font-weight:800;color:#67C5FF;letter-spacing:1px;padding-top:4px}
.benefit-list h3{font-size:16px;margin:0 0 5px}.benefit-list p{font-size:12px;color:#aeb5c2;margin:0}
.download-section{position:relative;overflow:hidden;background:linear-gradient(112deg,#1678F2,#0757DB);padding:76px 0;color:#fff}
.download-content{position:relative;z-index:1;display:grid;grid-template-columns:1fr 430px;align-items:center;gap:60px}
.download-kicker{color:#D9EEFF}
.download-copy h2{font-size:43px;line-height:1.25;letter-spacing:-1.5px;margin:12px 0}
.download-copy>p{font-size:14px;color:rgba(255,255,255,.84);margin:0}
.download-meta{display:flex;gap:28px;margin-top:27px;flex-wrap:wrap}
.download-meta span{font-size:11px;color:rgba(255,255,255,.8)}
.download-meta b{display:block;font-size:10px;color:#fff;margin-bottom:3px}
.download-meta i{font-style:normal}
.download-panel{background:#fff;color:var(--ink);border-radius:17px;padding:25px;box-shadow:0 22px 55px rgba(10,70,160,.22);display:grid;grid-template-columns:55px 1fr;align-items:center;gap:12px}
.windows-mark{width:49px;height:49px;border-radius:13px;background:#eaf2ff;display:grid;place-items:center;color:#4384e8}
.windows-mark svg{width:27px;height:27px;fill:currentColor}
.download-panel-copy b{display:block;font-size:15px}.download-panel-copy span{display:block;font-size:11px;color:#7e8795;margin-top:2px}.download-panel-copy small{display:block;font-size:10px;color:#a1a8b3;margin-top:5px}.download-panel-copy em{font-style:normal}
.btn-dark{grid-column:1 / -1;height:48px;background:#242b3b;color:#fff;border-radius:10px;font-size:13px}
.btn-dark:hover{background:#111827}
.download-hint{grid-column:1 / -1;text-align:center;color:#a4aab4;font-size:9px;margin:0}
.download-decoration{position:absolute;border:1px solid rgba(255,255,255,.16);border-radius:50%;pointer-events:none}
.decoration-one{width:500px;height:500px;right:-120px;top:-260px}.decoration-two{width:330px;height:330px;left:-160px;bottom:-240px}
.faq-section{background:#fafbfc}
.faq-layout{display:grid;grid-template-columns:.65fr 1.35fr;gap:100px}
.faq-intro h2{font-size:36px;letter-spacing:-1px;margin:0 0 10px}.faq-intro p{font-size:13px;color:#858d9a;margin:0 0 23px}
.faq-list details{background:#fff;border:1px solid #edf0f4;border-radius:12px;margin-bottom:10px;padding:0 19px}
.faq-list summary{list-style:none;cursor:pointer;position:relative;padding:17px 30px 17px 0;font-size:13px;font-weight:700;color:#394253}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary span{position:absolute;right:0;top:17px;width:19px;height:19px;border-radius:50%;background:#EAF5FF}
.faq-list summary span:before,.faq-list summary span:after{content:"";position:absolute;left:5px;right:5px;top:9px;height:1.5px;background:var(--brand)}
.faq-list summary span:after{transform:rotate(90deg);transition:transform .2s}
.faq-list details[open] summary span:after{transform:rotate(0)}
.faq-list details p{font-size:12px;color:#858d9a;line-height:1.85;margin:0;padding:0 0 17px;max-width:680px}
.site-footer{background:#171d2b;color:#fff;padding:50px 0 20px}
.footer-main{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:45px;padding-bottom:40px}
.brand-light{color:#fff}.brand-light .brand-logo{width:35px;height:35px}
.footer-brand p{font-size:12px;color:#9da5b3;margin:12px 0 0}
.footer-col{display:flex;flex-direction:column;align-items:flex-start;gap:10px}
.footer-col b{font-size:12px;margin-bottom:5px}
.footer-col a{font-size:11px;color:#9da5b3;transition:color .2s}
.footer-col a:hover{color:#67C5FF}
.footer-bottom{border-top:1px solid rgba(255,255,255,.1);padding-top:18px;display:flex;justify-content:space-between;gap:15px;color:#7f899a;font-size:10px}
.footer-bottom i{font-style:normal}
.toast{position:fixed;left:50%;bottom:28px;z-index:100;transform:translate(-50%,20px);padding:12px 18px;border-radius:10px;background:#222a3a;color:#fff;font-size:12px;box-shadow:0 10px 30px rgba(0,0,0,.2);opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;max-width:min(90vw,500px);text-align:center}
.toast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:1100px){
  .main-nav{gap:20px}.hero-grid{gap:25px}.hero h1{font-size:58px}.app-body{grid-template-columns:125px 1fr}.app-sidebar{padding-left:8px;padding-right:8px}.sidebar-item{font-size:10px}.showcase-grid{gap:40px}.benefits-wrap{gap:55px}.faq-layout{gap:55px}
}
@media(max-width:850px){
  .container{width:min(var(--container),calc(100% - 36px))}
  .site-header{height:70px}.mobile-menu-btn{display:block;margin-left:auto}
  .main-nav{display:none;position:absolute;top:69px;left:0;right:0;background:#fff;padding:15px 22px 20px;border-bottom:1px solid var(--line);box-shadow:0 14px 20px rgba(31,41,55,.06);margin:0;flex-direction:column;align-items:flex-start;gap:16px}
  .main-nav.open{display:flex}.nav-actions{gap:13px}.nav-support{display:none}
  .hero{padding:68px 0 65px}.hero-grid{grid-template-columns:1fr;gap:30px}.hero-copy{max-width:650px}.hero h1{font-size:60px}
  .hero-visual{width:min(100%,680px);margin:0 auto;padding-left:0}
  .proof-inner{grid-template-columns:repeat(2,1fr);row-gap:18px}.proof-inner>div:nth-child(2){border:0}.proof-inner>div:nth-child(3){padding-left:0}
  .section{padding:78px 0}.feature-grid{grid-template-columns:repeat(2,1fr)}
  .showcase-grid{grid-template-columns:1fr;gap:35px}.showcase-copy{max-width:600px}
  .scenario-grid{gap:12px}.scenario-art{height:140px}
  .workflow-grid{grid-template-columns:1fr;gap:10px}.workflow-step{min-height:0}.step-connector{transform:rotate(90deg);height:22px}
  .benefits-wrap{grid-template-columns:1fr;gap:25px}.benefits-heading h2 br{display:none}
  .download-content{grid-template-columns:1fr 350px;gap:25px}.download-copy h2{font-size:36px}
  .faq-layout{grid-template-columns:1fr;gap:28px}
}
@media(max-width:600px){
  .container{width:calc(100% - 30px)}
  .brand{font-size:14px;gap:8px}.brand-logo{width:32px;height:32px}
  .btn-nav{height:38px;padding:0 12px;font-size:11px}.nav-wrap{gap:7px}
  .hero{padding:55px 0 48px}.hero h1{font-size:48px;letter-spacing:-2.5px;margin-top:19px}
  .hero-lead{font-size:14px}.hero-actions{display:grid;grid-template-columns:1fr;gap:10px}.btn-large{width:100%;min-height:50px}
  .hero-meta{gap:9px 14px;font-size:10px}
  .hero-visual{padding-top:10px;padding-bottom:23px}
  .app-window{transform:none;border-radius:12px}.app-titlebar{height:40px;padding:0 10px}.app-brand-mini{font-size:9px}.app-brand-mini img{width:20px;height:20px}
  .app-body{grid-template-columns:82px 1fr;min-height:270px}
  .app-sidebar{padding:12px 5px}.sidebar-caption{font-size:8px;padding-left:5px}.sidebar-item{height:31px;font-size:8px;padding:0 5px;gap:4px}.side-icon{font-size:12px;width:12px}.sidebar-bottom{left:7px;bottom:10px;font-size:7px}.side-avatar{width:17px;height:17px}
  .editor-area{padding:12px 8px 10px}.editor-heading{margin-bottom:9px}.editor-heading small{font-size:7px}.editor-heading strong{font-size:10px}.project-pill{font-size:7px}
  .track-panel{padding:8px 7px 10px}.track-toolbar{font-size:8px}.ruler{font-size:6px;padding:10px 0 5px 57px}
  .audio-track{height:48px;margin-bottom:6px}.track-label{width:57px;padding-left:4px;font-size:7px;gap:3px}.track-note{width:14px;height:14px;font-size:9px}.wave{height:31px;gap:1px;padding:0 3px}
  .playhead{top:37px;bottom:12px}.selection-tag{font-size:6px;right:7px;bottom:4px}
  .player-panel{padding:7px;margin-top:7px}.file-wave{width:21px;height:21px;font-size:12px}.player-file{gap:5px}.player-file b{font-size:7px}.player-file small{font-size:6px}.player-controls{gap:6px}.play-button{width:22px;height:22px;font-size:8px}.muted-control{font-size:8px}.player-time{font-size:7px}
  .tool-strip{font-size:7px;padding-top:7px}.tool-strip b{font-size:10px}
  .floating-note{padding:7px 9px;border-radius:8px;gap:6px}.floating-note b{font-size:8px}.floating-note small{font-size:6px}.note-icon,.note-check{width:22px;height:22px;font-size:12px}
  .note-top{right:-4px;top:-4px}.note-bottom{left:-4px;bottom:0}.visual-caption{font-size:7px;right:0}
  .proof-inner{padding:18px 0;row-gap:14px}.proof-inner>div{padding:0 12px}.proof-inner b{font-size:11px}.proof-inner span{font-size:9px}
  .section{padding:65px 0}.section-heading{margin-bottom:30px}.section-heading h2,.showcase-copy h2{font-size:30px;letter-spacing:-1px}.section-heading p{font-size:12px}
  .feature-grid{grid-template-columns:1fr 1fr;gap:9px}.feature-card,.feature-card-main{grid-column:span 1;min-height:194px;padding:16px 13px;border-radius:13px}
  .feature-card-main{grid-column:span 2;min-height:190px}.feature-icon{width:36px;height:36px;border-radius:11px;margin-bottom:12px}.feature-icon svg{width:18px;height:18px}
  .feature-index{font-size:7px;letter-spacing:.7px}.feature-card h3{font-size:14px}.feature-card p{font-size:10px;line-height:1.7}.mini-wave{width:38%;right:13px;bottom:22px;height:50px}
  .section-footnote{font-size:9px;text-align:left}
  .editor-showcase{padding:65px 0}.showcase-copy>p{font-size:12px}.check-list li{font-size:11px}
  .showcase-card{padding:15px 11px 12px;border-radius:13px}.showcase-card-head{font-size:10px;margin-bottom:20px}.large-ruler{font-size:7px;padding-left:70px}
  .large-track{height:65px}.large-track label{width:70px;padding-left:7px;font-size:8px}.large-wave{height:38px;margin-right:5px}.large-playhead{top:61px;bottom:60px}.showcase-controls{gap:9px;padding-top:9px}.time-label{font-size:8px}.control-play{width:29px;height:29px;font-size:10px}.control-volume{font-size:14px}.showcase-sticker{right:-4px;bottom:-10px;padding:7px 10px}.showcase-sticker b{font-size:9px}.showcase-sticker span{font-size:7px}
  .scenario-grid{grid-template-columns:1fr;gap:13px}.scenario-card{display:grid;grid-template-columns:115px 1fr;align-items:center}.scenario-art{height:125px}.scenario-card>div:last-child{padding:13px}.scenario-card h3{font-size:13px}.scenario-card p{font-size:10px}
  .workflow-step{padding:19px}.workflow-step h3{font-size:14px}.workflow-step p{font-size:11px}.step-icon{width:40px;height:40px;margin-bottom:13px}
  .benefits-section{padding:62px 0}.benefits-heading h2{font-size:31px}.benefit-list article{gap:15px;padding:17px 0}.benefit-list h3{font-size:14px}.benefit-list p{font-size:10px;line-height:1.7}
  .download-section{padding:58px 0}.download-content{grid-template-columns:1fr;gap:25px}.download-copy h2{font-size:35px}.download-copy>p{font-size:12px}.download-meta{margin-top:18px;gap:18px}.download-panel{padding:19px;grid-template-columns:45px 1fr}.windows-mark{width:42px;height:42px}.download-panel-copy b{font-size:13px}
  .faq-intro h2{font-size:30px}.faq-list details{padding:0 14px}.faq-list summary{font-size:11px;padding:15px 26px 15px 0}.faq-list summary span{top:14px}.faq-list details p{font-size:10px}
  .site-footer{padding-top:38px}.footer-main{grid-template-columns:1fr 1fr;gap:28px 18px;padding-bottom:28px}.footer-brand{grid-column:span 2}.footer-col b{font-size:11px}.footer-col a{font-size:10px}.footer-bottom{font-size:8px;flex-direction:column;gap:7px}
}