/* Motion and art direction: content stays visible before libraries load. */
html.motion-scroll{scroll-behavior:auto}
body{font-family:'Manrope',Arial,Helvetica,sans-serif}
h1{font-size:clamp(52px,6.5vw,88px);letter-spacing:-4.8px}
h1 em,h2 em{color:#60764a}
.dark h2 em{color:#d8ec9c}
.hero{position:relative;isolation:isolate}
.hero:before{content:'';position:absolute;z-index:-1;inset:0;background-image:radial-gradient(#172b2612 .7px,transparent .7px);background-size:8px 8px;mask-image:linear-gradient(90deg,transparent 45%,black)}
.hero-copy h1 .headline-line{display:block;overflow:hidden;padding:0 0 .1em;margin-bottom:-.1em}
.headline-line>span{display:block;transform-origin:left bottom}
.preview{border-radius:120px 120px 12px 12px;padding-top:45px;background:#e4e8d9;box-shadow:0 30px 80px #172b260d}
.browser{position:relative}
.hero-orbit{position:absolute;right:-18px;top:-24px;width:92px;height:92px;border-radius:50%;background:var(--ink);color:var(--lime);display:grid;place-items:center;transform:rotate(12deg);z-index:2}
.hero-orbit span{font-size:10px;line-height:1.5;letter-spacing:1px;text-align:center}
.hero-orbit b{display:block;font-family:Georgia,serif;font-size:23px;font-weight:400;letter-spacing:-1px}
.service{position:relative;overflow:hidden;transition:background .3s,border-color .3s}
.service:hover{background:#e9eddc}
.service .number{display:flex;justify-content:space-between;align-items:center}
.service .number:after{content:'↗';font-size:23px;color:#748566}
.button{position:relative;overflow:hidden;box-shadow:0 3px 0 #172b2610}
.button>span[aria-hidden]{transition:transform .25s}
.button:hover>span[aria-hidden]{transform:translate(3px,-3px)}
.navigation a{position:relative;padding:6px 0}
.navigation a:after{content:'';position:absolute;bottom:0;left:0;width:100%;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .3s}
.navigation a:hover:after{transform:scaleX(1)}
.scroll-progress{position:fixed;inset:0 0 auto;height:3px;background:#78934c;transform:scaleX(0);transform-origin:left;z-index:30;pointer-events:none}
.motion-band{overflow:hidden;border-block:1px solid var(--line);padding:25px 0;background:#e9eddf}
.band-track{display:flex;gap:32px;width:max-content;align-items:center;will-change:transform}
.band-set{display:flex;align-items:center;gap:32px;flex-shrink:0;padding-left:32px;font-size:clamp(26px,4vw,54px);line-height:1.2;letter-spacing:-1.8px;font-weight:500}
.band-set em{font-family:Georgia,serif;font-weight:400;color:#637a4c}
.band-set i{font-style:normal;color:#8a9b67;font-size:.65em}
.process{position:relative}.step{position:relative}.step:before{content:'';position:absolute;top:-3px;left:0;width:5px;height:5px;border-radius:50%;background:#658044}
.contact-box{position:relative;overflow:hidden}.contact-box:after{content:'↗';position:absolute;right:35px;bottom:-85px;font-size:300px;line-height:1;color:#172b2605;pointer-events:none}.contact-box>div{position:relative;z-index:1}
@media(max-width:760px){h1{font-size:clamp(41px,8vw,56px);letter-spacing:-3px}.hero-orbit{right:0;top:-18px;width:76px;height:76px}.hero-orbit b{font-size:20px}.hero-orbit span{font-size:8px}.preview{padding-top:35px}.motion-band{padding:20px 0}.band-set{letter-spacing:-1px}}
@media(max-width:420px){h1{font-size:clamp(38px,11.5vw,48px)}.hero-orbit{right:-4px}.preview{border-radius:85px 85px 8px 8px}}
@media(prefers-reduced-motion:reduce){.band-track{will-change:auto}.button>span[aria-hidden]{transition:none}}