:root{--ink:#07182d;--paper:#f5f3ee;--white:#fff;--blue:#315dcc;--cyan:#1acac2;--orange:#f27945;--violet:#7969d8;--muted:#68758a;--line:rgba(7,24,45,.13)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.65 -apple-system,BlinkMacSystemFont,"SF Pro Text","PingFang SC","Noto Sans CJK SC",sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit}main{overflow:hidden}.site-header{height:82px;display:flex;align-items:center;justify-content:space-between;max-width:1240px;margin:auto;padding:0 32px}.brand{display:flex;align-items:center;gap:11px;text-decoration:none;font-size:20px;letter-spacing:-.02em}.brand-mark{width:34px;height:34px;border-radius:10px;background:var(--ink);display:flex;align-items:center;justify-content:center;gap:2px}.brand-mark i{display:block;width:3px;border-radius:3px;background:var(--cyan)}.brand-mark i:nth-child(1){height:10px}.brand-mark i:nth-child(2){height:20px}.brand-mark i:nth-child(3){height:15px}.brand-mark i:nth-child(4){height:7px}.site-header nav,footer nav{display:flex;align-items:center;gap:24px}.site-header nav a,footer a{text-decoration:none;color:var(--muted);font-size:14px}.site-header select{height:34px;border:1px solid var(--line);border-radius:9px;background:transparent;padding:0 9px;color:var(--ink)}article{display:none}.one-language article.current{display:block}.hero{min-height:720px;background:var(--ink);color:white;display:grid;grid-template-columns:minmax(0,1fr) minmax(520px,1fr);align-items:center;gap:8vw;padding:86px max(32px,calc((100vw - 1240px)/2)) 98px;position:relative}.hero:after{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(to bottom,transparent 0,transparent 87px,rgba(255,255,255,.045) 88px)}.hero-copy,.hero-instrument{position:relative;z-index:1}.edition{color:#9ca9bc;font-size:13px;letter-spacing:.08em;margin:0 0 28px}.hero h1{font-size:clamp(52px,5vw,78px);line-height:1.08;letter-spacing:-.055em;margin:0;max-width:720px}.lead{max-width:600px;color:#c4cedc;font-size:20px;line-height:1.7;margin:30px 0}.hero-actions{display:flex;align-items:center;gap:24px}.primary{background:var(--cyan);color:var(--ink);font-weight:700;text-decoration:none;padding:13px 20px;border-radius:12px}.text-link{color:#d9e3f0;text-underline-offset:4px}.hero-instrument{border-left:1px solid rgba(255,255,255,.12);padding:18px 0 18px 28px}.measure{display:flex;justify-content:space-between;color:#6f7e93;font-size:12px;margin-left:84px}.track{height:84px;display:grid;grid-template-columns:74px repeat(6,1fr);align-items:center;gap:8px;border-bottom:1px solid rgba(255,255,255,.09);position:relative}.track b{font-size:13px;color:#aeb9c8}.track i{height:var(--h,28px);border-radius:4px;background:currentColor;opacity:.85}.track i:nth-of-type(1){--h:22px}.track i:nth-of-type(2){--h:42px}.track i:nth-of-type(3){--h:31px}.track i:nth-of-type(4){--h:54px}.track i:nth-of-type(5){--h:18px}.track i:nth-of-type(6){--h:38px}.vocal{color:var(--violet)}.guitar{color:#f2af35}.bass{color:var(--cyan)}.drums{color:var(--orange)}.playhead{position:absolute;left:48%;top:20px;bottom:18px;width:1px;background:white}.playhead span{position:absolute;top:-5px;left:-4px;width:9px;height:9px;background:white;border-radius:50%}.statement{max-width:1000px;margin:0 auto;padding:150px 32px}.statement p{color:var(--blue);font-weight:700;margin:0 0 16px}.statement h2{font-size:clamp(36px,4.2vw,62px);line-height:1.2;letter-spacing:-.045em;margin:0}.product-shot,.score-shot{max-width:1240px;margin:0 auto 150px;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:8vw;padding:0 32px}.shot-copy h2{font-size:clamp(34px,3vw,52px);line-height:1.15;letter-spacing:-.04em;margin:16px 0 20px}.shot-copy p{color:var(--muted);font-size:19px;max-width:480px}.track-dot{display:block;width:15px;height:15px;border-radius:50%}.track-dot.guitar{background:#f2af35}.track-dot.vocal{background:var(--violet)}figure{margin:0}.phone{width:min(390px,100%);justify-self:center;border:10px solid #101d31;border-radius:58px;overflow:hidden;background:white;box-shadow:0 44px 100px -45px rgba(7,24,45,.55)}.phone img{display:block;width:100%}.tablet{border:10px solid #101d31;border-radius:28px;overflow:hidden;background:white;box-shadow:0 44px 100px -45px rgba(7,24,45,.45)}.tablet img{display:block;width:100%}.workflow{background:#e9e5dd;padding:120px max(32px,calc((100vw - 1240px)/2))}.workflow h2,.formats h2{font-size:clamp(36px,4vw,58px);line-height:1.15;letter-spacing:-.04em;margin:0 0 54px}.workflow ol{list-style:none;padding:0;margin:0;border-top:1px solid var(--line);counter-reset:step}.workflow li{counter-increment:step;display:grid;grid-template-columns:70px 1fr 1.4fr;gap:24px;padding:23px 0;border-bottom:1px solid var(--line);align-items:baseline}.workflow li:before{content:counter(step,decimal-leading-zero);color:var(--blue);font-variant-numeric:tabular-nums}.workflow li b{font-size:20px}.workflow li span{color:var(--muted)}.formats{max-width:1240px;margin:auto;padding:140px 32px}.formats div{display:flex;flex-wrap:wrap;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.formats div span{flex:1 1 220px;padding:24px 16px 24px 0;font-size:19px}.formats p{color:var(--muted);max-width:720px;margin-top:32px}footer{max-width:1240px;margin:auto;border-top:1px solid var(--line);padding:34px 32px 54px;display:flex;justify-content:space-between;color:var(--muted);font-size:13px}
@media(max-width:860px){.site-header{padding:0 20px}.site-header nav a{display:none}.hero{grid-template-columns:1fr;padding:64px 24px 70px}.hero h1{font-size:48px}.hero-instrument{margin-top:30px;padding-left:12px}.track{grid-template-columns:60px repeat(6,1fr);height:68px}.statement{padding:100px 24px}.product-shot,.score-shot{grid-template-columns:1fr;padding:0 24px;margin-bottom:100px;gap:48px}.score-shot .tablet{order:2}.workflow{padding:90px 24px}.workflow li{grid-template-columns:48px 1fr}.workflow li span{grid-column:2}.formats{padding:100px 24px}footer{padding:30px 24px;gap:20px;flex-direction:column}}
@media(prefers-reduced-motion:no-preference){.playhead{animation:sweep 5s ease-in-out infinite alternate}@keyframes sweep{from{left:32%}to{left:82%}}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
