:root{--ink:#111614;--mu:#5F6865;--li:#E6E9E7;--bg2:#F3F5F4;--ac:#056F74;--wm:#13605C;--dk:#0E2B29;--y:#E0B83E;--e:cubic-bezier(.2,.7,.1,1)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:96px}
body{margin:0;font:400 17px/1.6 'Onest',system-ui,sans-serif;color:var(--ink);background:#fff;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}a{color:inherit}h1,h2,h3{font-weight:500;letter-spacing:-.035em;margin:0}p{margin:0}
.w{width:min(1344px,100% - 48px);margin-inline:auto}
.skip{position:absolute;left:-999px}.skip:focus{left:16px;top:16px;z-index:99;background:#fff;padding:8px 12px}
:focus-visible{outline:2px solid var(--ac);outline-offset:3px}
.lb{font-size:13px;color:var(--mu);letter-spacing:.01em}
.btn{display:inline-flex;align-items:center;gap:10px;height:52px;padding:0 24px;border-radius:999px;background:var(--ac);color:#fff;text-decoration:none;font-weight:500;font-size:15px;border:0;cursor:pointer;transition:background .3s,gap .3s var(--e)}
.btn:hover{background:var(--wm);gap:14px}.btn.sm{height:42px;padding:0 18px}.btn.lt{background:#fff;color:var(--dk)}.btn.lt:hover{background:var(--y)}
.ar{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;transition:transform .3s var(--e)}
.lk{display:inline-flex;align-items:center;gap:8px;font-weight:500;font-size:15px;text-decoration:none;background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;transition:background-size .4s var(--e)}
.lk:hover{background-size:100% 1px}.lk:hover .ar,.nx:hover .ar{transform:translateX(4px)}
/* header */
.hd{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.86);backdrop-filter:blur(14px);border-bottom:1px solid transparent;transition:border-color .3s}
.hd.sc{border-color:var(--li)}.hd-in{height:80px;display:flex;align-items:center;gap:40px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;font-size:26px;font-weight:600;letter-spacing:-.03em;color:var(--wm)}.mk{width:34px;height:36px}
.nv{display:flex;align-items:center;gap:36px;margin-left:auto;font-size:15px}.nv>a{text-decoration:none}.nv>a[aria-current]{color:var(--ac)}.lang{color:var(--mu)}
.dd{position:relative}.dd-b{all:unset;cursor:pointer;display:flex;align-items:center;gap:6px}.dd-b svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.6;transition:transform .3s}
.dd-p{position:absolute;top:calc(100% + 22px);left:-24px;width:680px;display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:16px;background:#fff;border:1px solid var(--li);border-radius:6px;box-shadow:0 24px 48px -24px rgba(14,43,41,.25);opacity:0;visibility:hidden;transform:translateY(-6px);transition:.3s var(--e)}
.dd-p::before{content:"";position:absolute;inset:-24px 0 auto;height:24px}
.dd:hover .dd-p,.dd.op .dd-p,.dd:focus-within .dd-p{opacity:1;visibility:visible;transform:none}.dd:hover .dd-b svg,.dd.op .dd-b svg{transform:rotate(180deg)}
.dd-p a{display:flex;flex-direction:column;padding:14px 16px;border-radius:4px;text-decoration:none;transition:background .2s}.dd-p a:hover{background:var(--bg2)}.dd-p small{color:var(--mu);font-size:13px}
.mb{display:none}
/* motion */
.rv{opacity:0;transform:translateY(24px);transition:opacity .9s var(--e),transform .9s var(--e)}.rv.in{opacity:1;transform:none}
.ph{overflow:hidden;border-radius:4px;background:var(--bg2)}.ph img{width:100%;height:100%;object-fit:cover}

/* hero */
.hero{padding:112px 0 64px;display:grid;grid-template-columns:repeat(12,1fr);column-gap:24px;align-items:end}
.eb{grid-column:1/-1;margin-bottom:28px;font-size:13px;color:var(--mu)}
.hero h1{grid-column:span 8;font-size:clamp(46px,6.4vw,92px);line-height:1.02;letter-spacing:-.045em}
.rot{display:inline-block;color:var(--ac);position:relative}.rot-w{display:inline-block;transition:opacity .45s,transform .45s var(--e)}.rot-w.out{opacity:0;transform:translateY(-.3em)}
.rot::after{content:"";position:absolute;left:0;right:0;bottom:.06em;height:.08em;background:var(--y);transform-origin:left;animation:ln 2.8s var(--e) infinite}
@keyframes ln{0%{transform:scaleX(0)}35%,80%{transform:scaleX(1)}100%{transform:scaleX(1);opacity:0}}
.hero-b{grid-column:9/-1;display:flex;flex-direction:column;gap:28px;padding-bottom:10px}.hero-b p{color:#3F4845;font-size:16px}.acts{display:flex;align-items:center;gap:24px;flex-wrap:wrap}
.hero-img .ph{aspect-ratio:21/9}.ph img{object-position:center 55%}
.fw{display:flex;flex-wrap:wrap;gap:12px 32px;padding:22px 0;font-size:14px;color:var(--mu);border-top:1px solid var(--li);border-bottom:1px solid var(--li)}.fw .lb{width:180px}
/* services tabs */
.sv{padding:128px 0;display:grid;grid-template-columns:repeat(12,1fr);column-gap:24px;row-gap:56px}
.sv-h{grid-column:1/-1;display:flex;justify-content:space-between;align-items:flex-end;flex-direction:row-reverse}
h2{font-size:clamp(32px,3.4vw,48px);line-height:1.08}
.sv-g{grid-column:1/-1;display:grid;grid-template-columns:5fr 7fr;gap:64px}
.sv-t{display:flex;flex-direction:column;border-top:1px solid var(--ink)}
.sv-t button{all:unset;cursor:pointer;display:flex;gap:20px;align-items:baseline;padding:22px 0;border-bottom:1px solid var(--li);font-size:21px;font-weight:500;letter-spacing:-.02em;color:#8A938F;position:relative;transition:color .3s,padding .4s var(--e)}
.sv-t button em{font-style:normal;font-size:13px;color:inherit;width:24px}
.sv-t button::after{content:"";position:absolute;left:0;bottom:-1px;height:1px;width:100%;background:var(--ac);transform:scaleX(0);transform-origin:left;transition:transform .6s var(--e)}
.sv-t button:hover{color:var(--ink)}.sv-t button[aria-selected=true]{color:var(--ink);padding-left:12px}.sv-t button[aria-selected=true]::after{transform:scaleX(1)}.sv-t button[aria-selected=true] em{color:var(--ac)}
.sv-p{display:flex;flex-direction:column;gap:24px;animation:fi .6s var(--e)}.sv-p .ph{aspect-ratio:3/2}.sv-p .lead{font-size:19px;line-height:1.5}
.sv-p ul{margin:0;padding:0;list-style:none;display:grid;gap:10px}.sv-p li{padding-left:22px;position:relative;color:#3F4845;font-size:15px}.sv-p li::before{content:"";position:absolute;left:0;top:.7em;width:10px;height:1px;background:var(--ac)}
@keyframes fi{from{opacity:0;transform:translateY(12px)}}
/* about band */
.ab{background:var(--bg2);padding:128px 0}.ab-g{display:grid;grid-template-columns:5fr 7fr;gap:64px}.ab-g .lb{display:block;margin-bottom:16px}.ab-g>div:last-child{display:grid;gap:18px;color:#3F4845}
.st{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:88px}.st div{padding-top:24px;border-top:1px solid #C9CFCC}.st em{font-style:normal;font-size:13px;font-weight:600;color:var(--ac)}.st h3{font-size:clamp(28px,2.6vw,40px);margin-top:12px}.st p{grid-column:1/-1;color:var(--mu);font-size:15px}
/* inner pages */
.pg{padding:96px 0 56px}.bc{display:flex;gap:10px;font-size:13px;color:var(--mu);margin-bottom:32px}.bc a{text-decoration:none}.bc a:hover{color:var(--ac)}
.pg h1{font-size:clamp(40px,5.6vw,80px);line-height:1.03;max-width:16ch}.pg-l{margin-top:36px;max-width:760px;display:grid;gap:16px;font-size:19px;line-height:1.55;color:#3F4845}.pg-l strong{color:var(--ink);font-weight:500}
.ls{padding:112px 0 0;display:grid;grid-template-columns:repeat(12,1fr);column-gap:24px}.ls h2{grid-column:span 4;font-size:clamp(28px,2.6vw,38px);align-self:start;position:sticky;top:120px}
.ls ol{grid-column:6/-1;margin:0;padding:0;list-style:none;border-top:1px solid var(--ink)}.ls li{display:grid;grid-template-columns:56px 1fr;gap:16px;padding:22px 0;border-bottom:1px solid var(--li);transition:background .3s,padding .4s var(--e)}
.ls li:hover{background:var(--bg2);padding-left:12px}.ls em{font-style:normal;font-size:13px;color:var(--ac);font-weight:600;padding-top:3px}.ls p{color:#3F4845}.ls strong{color:var(--ink);font-weight:500}
.qt{padding:112px 0 0}.qt p{font-size:clamp(28px,3.4vw,48px);line-height:1.18;letter-spacing:-.03em;max-width:24ch}.qt span{color:var(--ac)}
.nx{margin-top:112px;display:flex;align-items:center;gap:24px;padding:40px 0;border-top:1px solid var(--li);border-bottom:1px solid var(--li);text-decoration:none}.nx strong{font-weight:500;font-size:clamp(22px,2.4vw,34px);letter-spacing:-.03em;flex:1}.nx .ar{width:28px;height:28px;color:var(--ac)}
/* contact */
.ct{display:grid;grid-template-columns:4fr 7fr;gap:64px;padding:24px 0 0}.ct-i{display:grid;gap:32px;align-content:start}.ct-i div{display:grid;gap:6px;padding-top:20px;border-top:1px solid var(--li)}.ct-i address{font-style:normal}
.fm{display:grid;gap:20px}.fm-r{display:grid;grid-template-columns:1fr 1fr;gap:20px}.fm label{display:grid;gap:8px;font-size:14px;color:var(--mu)}
.fm input,.fm select,.fm textarea{font:inherit;color:var(--ink);padding:14px 0;border:0;border-bottom:1px solid #C9CFCC;background:transparent;border-radius:0;transition:border-color .3s}.fm input:focus,.fm select:focus,.fm textarea:focus{outline:0;border-color:var(--ac)}
.fm .ck{display:flex;gap:10px;align-items:flex-start}.fm .ck input{width:18px;height:18px;margin-top:3px;accent-color:var(--ac)}.fm .btn{justify-self:start}
/* cta + footer */
.cta{margin-top:128px;padding:80px 64px;background:var(--dk);color:#fff;border-radius:4px;display:flex;justify-content:space-between;align-items:flex-end;gap:48px;flex-wrap:wrap}.cta h2{font-size:clamp(34px,4vw,56px)}.cta h2 span{color:#8FB5B1}.cta>div{display:grid;gap:24px;max-width:380px}.cta p{color:#C3D3D0}
.ft{padding:88px 0 40px}.ft-g{display:grid;grid-template-columns:3fr 3fr 2fr 3fr;gap:32px}.ft-g>div{display:flex;flex-direction:column;gap:10px;font-size:14px;color:var(--mu)}.ft-g a{text-decoration:none}.ft-g a:hover{color:var(--ac)}.ft h3{font-size:13px;font-weight:500;color:var(--ink);letter-spacing:0;margin-bottom:6px}.ft address{font-style:normal}.ft .brand{font-size:22px}
.ft-b{display:flex;justify-content:space-between;margin-top:64px;padding-top:24px;border-top:1px solid var(--li);font-size:13px;color:var(--mu)}
/* responsive */
@media (max-width:960px){
 .hd-in{gap:16px}.hd .btn.sm{display:none}.mb{display:grid;gap:6px;margin-left:auto;width:44px;height:44px;place-content:center;background:none;border:0;cursor:pointer}.mb span{width:22px;height:1.5px;background:var(--ink);transition:.3s}
 .mb[aria-expanded=true] span:first-child{transform:translateY(3.75px) rotate(45deg)}.mb[aria-expanded=true] span:last-child{transform:translateY(-3.75px) rotate(-45deg)}
 .nv{position:fixed;inset:80px 0 0;background:#fff;flex-direction:column;align-items:flex-start;gap:0;padding:16px 24px;overflow:auto;transform:translateX(100%);transition:transform .45s var(--e)}.nv.op{transform:none}
 .nv>a,.dd-b{font-size:22px;padding:14px 0}.dd{width:100%}.dd-p{position:static;width:auto;grid-template-columns:1fr;opacity:1;visibility:visible;transform:none;box-shadow:none;border:0;padding:0 0 12px;display:none}.dd.op .dd-p{display:grid}
 .hero,.sv,.ls{display:block}.hero-b{margin-top:32px}.sv-h{flex-direction:column;align-items:flex-start;gap:12px}.sv-g,.ab-g,.ct{grid-template-columns:1fr;gap:40px}.st{grid-template-columns:1fr}.ls h2{position:static;margin-bottom:24px}
 .ft-g{grid-template-columns:1fr 1fr}.hero-img .ph{aspect-ratio:4/3}.fm-r{grid-template-columns:1fr}.cta{padding:48px 28px}.hero{padding-top:64px}.sv,.ab{padding:88px 0}.ft-b{flex-direction:column;gap:8px}
}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.rv{opacity:1;transform:none}}
/* image treatment v2 */
.ph img{filter:grayscale(1) contrast(1.08);transform:translate3d(0,var(--py,0px),0) scale(var(--sc,1.14));clip-path:inset(0 0 100% 0);transition:clip-path 1.4s var(--e),filter 1.8s .5s ease,transform 1.8s var(--e)}
.ph.in img,.sv-p .ph img{clip-path:inset(0);filter:none;--sc:1.06}
.ph.bw.in img{filter:grayscale(1) contrast(1.1) brightness(.78)}
.sv-p .ph img{animation:tint 1.6s ease both}@keyframes tint{from{filter:grayscale(1)}to{filter:none}}
.leaf{border-radius:4px clamp(80px,14vw,240px) 4px clamp(80px,14vw,240px)}.leaf-s{border-radius:4px 96px 4px 4px}
.hero-img.bleed{margin-left:max(24px,calc((100vw - 1344px)/2));position:relative}.hero-img .ph{aspect-ratio:21/9;border-top-right-radius:0;border-bottom-right-radius:0}
.hero-img figcaption{position:absolute;left:28px;bottom:24px;display:flex;align-items:center;gap:10px;padding:8px 14px 8px 8px;background:rgba(255,255,255,.92);backdrop-filter:blur(8px);border-radius:999px;font-size:13px}
.hero-img figcaption span{background:var(--ac);color:#fff;border-radius:999px;padding:3px 10px;font-size:12px}
.pg-s{display:grid;grid-template-columns:7fr 5fr;gap:64px;align-items:end}.pg-s h1{font-size:clamp(38px,4.6vw,68px)}.pg-f{margin:0}.pg-f .ph{aspect-ratio:4/5}
.pano{margin:24px 0 0;position:relative}.pano .ph{aspect-ratio:21/8;border-radius:0}
.pano figcaption{position:absolute;inset:auto 0 clamp(24px,6vw,72px);left:0;right:0;color:#fff}.pano figcaption p{font-size:clamp(24px,3.2vw,46px);line-height:1.18;letter-spacing:-.03em;max-width:22ch;opacity:0;transform:translateY(20px);transition:1s .9s var(--e)}
.pano .in~figcaption p,.pano figcaption.in p{opacity:1;transform:none}.pano figcaption span{color:var(--y)}
@media (max-width:960px){.pg-s{grid-template-columns:1fr;gap:40px}.pg-f .ph{aspect-ratio:4/3}.hero-img .ph{aspect-ratio:4/3}.pano .ph{aspect-ratio:3/4}.leaf{border-radius:4px 96px 4px 96px}}
@media (prefers-reduced-motion:reduce){.ph img{clip-path:none;filter:none;transform:none}}
/* products */
.pr{padding:128px 0 0;display:grid;gap:24px}.pr .sv-h{margin-bottom:32px}
.pr-c{display:grid;grid-template-columns:5fr 7fr;gap:48px;align-items:center;padding:48px;border-radius:4px 120px 4px 4px;text-decoration:none;overflow:hidden;transition:transform .5s var(--e),box-shadow .5s var(--e)}
.pr-x{display:flex;flex-direction:column;gap:18px}
.pr-a{background:var(--dk);color:#fff}.pr-a p{color:#C3D3D0}.pr-a:hover{transform:translateY(-4px);box-shadow:0 30px 60px -30px rgba(14,43,41,.6)}.pr-a:hover .ar{transform:translateX(4px)}
.pr-m{background:var(--bg2);border-radius:4px 4px 120px 4px;grid-template-columns:7fr 5fr}.pr-m p{color:#3F4845}.pr-m .pr-x{order:1}.pr-m .fd{order:2}
.pr-top{display:flex;justify-content:space-between;align-items:center;gap:16px}.pr-n{font-size:28px;font-weight:600;letter-spacing:-.03em;display:flex;align-items:center;gap:8px}.ca{color:var(--y);letter-spacing:-.18em;font-weight:600}
.pr-s{font-size:20px;font-weight:500;letter-spacing:-.02em}.pr-a .pr-s{color:var(--y)!important}
.pr-b{display:inline-flex;align-items:center;gap:8px;font-size:12px;font-weight:500;padding:5px 12px;border-radius:999px;white-space:nowrap}.live{background:rgba(255,255,255,.12);color:#fff}.soon{background:#fff;color:var(--ac);border:1px solid var(--li)}
.soon em{width:8px;height:8px;border-radius:50%;background:var(--y);animation:pu 1.8s ease infinite}@keyframes pu{0%{box-shadow:0 0 0 0 rgba(224,184,62,.7)}70%{box-shadow:0 0 0 10px rgba(224,184,62,0)}100%{box-shadow:0 0 0 0 rgba(224,184,62,0)}}
.pr-k{display:flex;flex-wrap:wrap;gap:6px;counter-reset:k}.pr-k span{font-size:12px;padding:5px 10px;border:1px solid rgba(255,255,255,.18);border-radius:999px;color:#C3D3D0;counter-increment:k}.pr-k span::before{content:"0" counter(k) " ";color:var(--y)}
.pr-t{display:flex;flex-wrap:wrap;gap:8px}.pr-t span{font-size:13px;padding:6px 12px;border:1px solid #C9CFCC;border-radius:999px;color:var(--ink);background:#fff}.pr-m .lk{color:var(--ac)}
/* dashboard mock */
.db{display:grid;grid-template-columns:132px 1fr;background:#F7F8F6;color:var(--ink);border-radius:10px;overflow:hidden;box-shadow:0 40px 80px -30px rgba(0,0,0,.5);transform:perspective(1400px) rotateY(-7deg) rotateX(3deg) translateY(24px);opacity:0;transition:transform 1.4s var(--e),opacity 1s}
.pr-a.in .db{transform:perspective(1400px) rotateY(-7deg) rotateX(3deg);opacity:1}.pr-a:hover .db{transform:perspective(1400px) rotateY(-2deg) rotateX(1deg)}
.db-s{background:#fff;border-right:1px solid var(--li);padding:18px 12px;display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--mu)}.db-s b{color:var(--dk);letter-spacing:-.18em;margin:0 0 14px 6px}.db-s span{padding:7px 8px;border-radius:6px}.db-s .on{background:#E4EFEE;color:var(--dk);font-weight:500}
.db-m{padding:20px;display:grid;gap:12px}.db-h{display:flex;justify-content:space-between;font-size:12px;color:var(--mu)}.db-h em,.fd-h em{font-style:normal;font-size:11px;padding:2px 8px;border-radius:999px;background:#fff;border:1px solid var(--li)}
.db-m strong{font-size:30px;font-weight:600;letter-spacing:-.03em}.db-m small{font-size:13px;color:var(--mu);font-weight:400}
.db-c{height:90px;display:grid;grid-template-columns:repeat(12,1fr);gap:5px;align-items:end;padding:8px;background:#fff;border-radius:6px}.db-c i{height:var(--h);background:#8FB5B1;border-radius:3px 3px 0 0;transform:scaleY(0);transform-origin:bottom;transition:transform 1s var(--e)}
.db-c i:nth-child(n+11){background:var(--ac)}.pr-a.in .db-c i{transform:scaleY(1)}
.db-c i:nth-child(2){transition-delay:.05s}.db-c i:nth-child(3){transition-delay:.1s}.db-c i:nth-child(4){transition-delay:.15s}.db-c i:nth-child(5){transition-delay:.2s}.db-c i:nth-child(6){transition-delay:.25s}.db-c i:nth-child(7){transition-delay:.3s}.db-c i:nth-child(8){transition-delay:.35s}.db-c i:nth-child(9){transition-delay:.4s}.db-c i:nth-child(10){transition-delay:.45s}.db-c i:nth-child(11){transition-delay:.5s}.db-c i:nth-child(12){transition-delay:.55s}
.db-g{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.db-g div{background:#fff;border-radius:6px;padding:10px;display:grid;gap:2px}.db-g span{font-size:11px;color:var(--mu)}.db-g b{font-size:17px;font-weight:600}
.db-bar{display:flex;height:6px;border-radius:99px;overflow:hidden;gap:2px}.db-bar i{width:var(--w);background:var(--dk)}.db-bar i:nth-child(2){background:var(--ac)}.db-bar i:nth-child(3){background:var(--y)}
/* feed mock */
.fd{background:#fff;border:1px solid var(--li);border-radius:10px;padding:18px;box-shadow:0 30px 60px -40px rgba(14,43,41,.35)}.fd-h{display:flex;justify-content:space-between;font-size:12px;color:var(--mu);margin-bottom:12px}
.fd-w{height:280px;overflow:hidden;mask:linear-gradient(transparent,#000 12%,#000 88%,transparent)}.fd-t{display:grid;gap:10px;animation:fd 18s linear infinite}.fd:hover .fd-t{animation-play-state:paused}@keyframes fd{to{transform:translateY(calc(-50% - 5px))}}
.fd-i{display:grid;gap:4px;padding:12px;border-radius:8px;background:var(--bg2)}.fd-i p{font-size:14px;font-weight:500;color:var(--ink)!important}.fd-i small{font-size:11px;color:var(--mu)}
.tg{justify-self:start;font-size:11px;font-weight:500;padding:2px 8px;border-radius:999px}.c1{background:#DDEEE3;color:#1F6B3A}.c2{background:#FBE9D2;color:#8A4B0F}.c3{background:#FFF3C9;color:#7A5A00}.c4{background:#DCEDEC;color:var(--ac)}.c5{background:#E6E6F3;color:#3D3D7A}
@media (max-width:960px){.pr-c,.pr-m{grid-template-columns:1fr;padding:28px;gap:32px}.pr-m .fd{order:3}.db{grid-template-columns:1fr}.db-s{display:none}}
@media (prefers-reduced-motion:reduce){.db-c i{transform:none}.db{opacity:1;transform:none}.fd-t{animation:none}}
.sl{display:inline-flex;align-items:center;gap:12px;margin-right:18px;color:var(--ac);font-weight:500}.sl::before{content:"";width:32px;height:2px;background:var(--y)}
.fm-ok{padding:16px 20px;border-radius:6px;background:#DDEEE3;color:#1F6B3A;font-weight:500}.hp{position:absolute;left:-9999px}
.bt{display:flex;flex-direction:column;line-height:1;gap:3px}.bt small{font-size:11.5px;font-weight:500;font-style:italic;letter-spacing:0;color:#8C6A0E;white-space:nowrap}.ft .bt small{font-size:12px}
