@import "https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap";:root{color:#181f1c;font-synthesis:none;background:#f5f6f2;font-family:DM Sans,system-ui,sans-serif;line-height:1.65}*{box-sizing:border-box}body{margin:0}a{color:inherit;text-decoration:none}a:hover{text-underline-offset:5px;text-decoration:underline}:focus-visible{outline-offset:5px;outline:3px solid #60712f}.wrap{max-width:1200px;margin:auto;padding-left:40px;padding-right:40px}.nav{border-bottom:1px solid #d6ddcf;justify-content:space-between;align-items:center;min-height:100px;display:flex}.brand{letter-spacing:-1px;align-items:center;gap:10px;font-size:26px;font-weight:800;display:flex}.nav nav{gap:30px;font-size:14px;display:flex}.hero{padding-top:92px;padding-bottom:68px}.eyebrow{letter-spacing:2px;color:#526052;font-size:11px;font-weight:700;display:block}h1,h2,h3,p{margin-top:0}h1,h2,h3{font-family:Manrope,system-ui,sans-serif}h1{letter-spacing:-4px;margin:26px 0;font-size:clamp(46px,6.9vw,88px);font-weight:500;line-height:1.12}h1 em{color:#315c2b;font-style:normal}.intro{color:#526052;max-width:610px;font-size:19px;line-height:1.8}.actions{align-items:center;gap:28px;margin-top:32px;display:flex}.button{color:#fff;background:#315c2b;border-radius:6px;align-items:center;gap:35px;padding:14px 23px;font-size:14px;font-weight:600;display:inline-flex}.button:hover{background:#274029;text-decoration:none}.text-link{font-size:14px}.hero-note{color:#526052;margin-top:25px;font-size:11px}.workbench-bar{color:#cbd3c6;letter-spacing:1.5px;background:#274029;border-radius:10px 10px 0 0;justify-content:space-between;align-items:center;padding:13px 20px;font-size:9px;display:flex}.bench-grid{border:1px solid #d6ddcf;border-top:0;border-radius:0 0 10px 10px;grid-template-columns:1.3fr 1fr;display:grid;overflow:hidden}.code-pane{color:#cbd3c6;background:#181f1c;min-width:0}.pane-label{border-bottom:1px solid #d6ddcf;justify-content:space-between;padding:15px 22px;font-size:11px;display:flex}.code-pane .pane-label{border-color:#364337}.pane-label span{letter-spacing:1px;font-size:9px}.code-pane pre{margin:0;font-size:11px;line-height:1.9;overflow:auto;background:#181f1c!important;padding:25px 22px!important}.preview-pane{background:#edf2e8;flex-direction:column;display:flex}.counter{width:100%;max-width:340px;margin:auto;padding:45px}.small-label{letter-spacing:2px;color:#526052;font-size:9px}.counter h2{letter-spacing:-1px;margin:14px 0 24px;font-size:38px;font-weight:500}.sample-button{color:#fff;background:#315c2b;border-radius:5px;justify-content:space-between;padding:12px 18px;font-size:13px;display:flex}.counter p{color:#526052;margin-top:17px;font-size:11px}.connection{text-align:center;color:#526052;border-top:1px solid #d6ddcf;padding:17px;font:10px monospace}.section{padding-top:110px;padding-bottom:100px}.section-heading{justify-content:space-between;align-items:end;gap:40px;margin-bottom:45px;display:flex}.section-heading h2{letter-spacing:-1.2px;margin:16px 0 0;font-size:38px;font-weight:500;line-height:1.4}.section-heading>p{color:#526052;max-width:350px;margin:0;font-size:15px}.steps{border-top:1px solid #d6ddcf;grid-template-columns:repeat(3,1fr);gap:40px;display:grid}.steps article{padding-top:26px}.steps article>span{color:#60712f;font-size:12px}.steps h3{margin:22px 0 10px;font-size:18px;font-weight:600}.steps p,.paths p{color:#526052;font-size:14px}.dashboard-section{background:#e8eddf;padding:70px 0}.dashboard-section figure{margin:0}.dashboard-section img{border:1px solid #d6ddcf;border-radius:8px;width:100%;height:auto;display:block}.dashboard-section figcaption{color:#526052;text-align:center;margin-top:14px;font-size:11px}.paths{border-top:1px solid #d6ddcf;grid-template-columns:repeat(3,1fr);margin-top:28px;display:grid}.paths>a{padding:30px 26px 0 0}.paths>a+a{border-left:1px solid #d6ddcf;padding-left:26px}.paths span{letter-spacing:2px;color:#526052;font-size:10px}.paths h3{margin:18px 0 12px;font-size:20px;font-weight:500}.closing{text-align:center;border-top:1px solid #d6ddcf;padding-top:65px;padding-bottom:80px}.closing h2{letter-spacing:-1px;margin:20px 0 30px;font-size:36px;font-weight:500}footer{border-top:1px solid #d6ddcf;align-items:center;gap:30px;min-height:100px;display:flex}footer p{color:#526052;flex:1;margin:0;font-size:12px}footer>a:last-child{font-size:12px}.skip{background:#fff;padding:15px;position:absolute;top:-100px}.skip:focus{z-index:10;top:0}html[lang=ja] h1{letter-spacing:-2px;font-size:clamp(38px,5vw,68px)}html[lang=ja] h2{letter-spacing:0}@media (width<=760px){.wrap{padding-left:22px;padding-right:22px}.nav{min-height:78px}.nav nav{gap:18px;font-size:12px}.hero{padding-top:58px;padding-bottom:45px}h1{letter-spacing:-2px}.intro{font-size:16px}.actions{flex-wrap:wrap;gap:20px}.bench-grid{grid-template-columns:1fr}.workbench-bar{padding:13px;font-size:8px}.workbench-bar>span:last-child{display:none}.counter{padding:30px}.section{padding-top:65px;padding-bottom:60px}.section-heading{display:block}.section-heading>p{max-width:none;margin-top:24px}.section-heading h2{font-size:29px}.steps,.paths{grid-template-columns:1fr;gap:0}.steps article{border-bottom:1px solid #d6ddcf}.steps h3{margin-top:12px}.paths>a{border-bottom:1px solid #d6ddcf;border-left:0!important;padding:24px 0!important}.closing h2{font-size:27px}footer{flex-wrap:wrap;gap:15px;padding-top:25px;padding-bottom:25px}footer p{flex-basis:65%}}