:root{
  --green-950:#063025;--green-900:#0B4F39;--green-800:#116649;--green-700:#18805A;--green-600:#28A873;--green-500:#38B87E;
  --mint-300:#83D2A2;--mint-200:#BCE6CA;--mint-100:#E5F6EC;--mint-50:#F6FBF8;
  --ink:#12352B;--muted:#5F746C;--line:#D7E8DF;--paper:#FCFEFD;--white:#fff;
  --orange:#FF7418;--cyan:#55C9EE;--pink:#F41475;--plum:#A33F74;--purple:#7859F5;
  --shadow:0 22px 60px -34px rgba(5,47,35,.42);
  --display:'Sora',Avenir Next,system-ui,sans-serif;--body:'Figtree',Avenir Next,system-ui,sans-serif;--mono:'Space Mono',ui-monospace,SFMono-Regular,monospace;
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font:400 16px/1.65 var(--body);-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}button{font:inherit}img{max-width:100%}:focus-visible{outline:3px solid rgba(56,184,126,.35);outline-offset:3px;border-radius:8px}
::selection{background:var(--mint-200);color:var(--green-950)}
.skip-link{position:fixed;left:16px;top:12px;z-index:200;padding:10px 14px;background:var(--green-950);color:#fff;border-radius:10px;transform:translateY(-150%);transition:transform .18s ease;font-weight:700;font-size:13px}
.skip-link:focus-visible{transform:translateY(0)}
.container{width:min(1180px,92vw);margin:0 auto}
.topbar{position:fixed;inset:0 0 auto;z-index:80;transition:.3s;padding:16px 0;background:rgba(252,254,253,.92);backdrop-filter:blur(12px);border-bottom:1px solid transparent}
.topbar.scrolled{border-color:rgba(215,232,223,.8);box-shadow:0 10px 30px -24px rgba(6,48,37,.28)}
.nav{display:flex;align-items:center;gap:28px;min-height:40px}.brand{display:inline-flex;align-items:center;flex:none}.brand img{width:104px;height:auto;display:block}
.navlinks{display:flex;gap:24px;margin-left:auto;font-size:14px;font-weight:700;color:#456258}.navlinks a{position:relative;padding:8px 0}.navlinks a::after{content:"";position:absolute;left:0;right:100%;bottom:3px;height:2px;background:var(--green-600);transition:.25s}.navlinks a:hover::after{right:0}.navlinks .mobile-cta{display:none}
.navcta,.primary{display:inline-flex;align-items:center;justify-content:center;gap:9px;border-radius:999px;font-weight:700;transition:.25s}.navcta{padding:10px 18px;background:var(--green-900);color:#fff;font-size:13px}.navcta:hover,.primary:hover{transform:translateY(-2px);box-shadow:0 12px 30px -15px rgba(11,79,57,.45)}
.menu{display:none;width:42px;height:42px;border:1px solid var(--line);background:#fff;border-radius:12px;align-items:center;justify-content:center}.menu span,.menu::before,.menu::after{content:"";display:block;width:18px;height:2px;background:var(--green-900);border-radius:2px;position:absolute}.menu::before{transform:translateY(-6px)}.menu::after{transform:translateY(6px)}
.hero{border-top:0;padding:120px 0 86px;background:var(--green-950);min-height:720px;display:flex;align-items:center;position:relative;overflow:hidden;color:#fff}.hero-grid{display:grid;grid-template-columns:1.04fr .96fr;gap:38px;align-items:center}
.kicker{display:inline-flex;align-items:center;gap:9px;font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:#9AE1B4;margin-bottom:18px}.kicker i{width:7px;height:7px;border-radius:50%;background:var(--green-600);box-shadow:0 0 0 4px rgba(40,168,115,.13)}
h1,h2,h3,h4{font-family:var(--display);line-height:1.13;letter-spacing:-.028em;margin:0}.hero h1{font-size:clamp(43px,6.6vw,77px);max-width:700px;color:#fff}.hero h1 span{color:#83D2A2}.lede{font-size:18px;max-width:610px;color:#C4DFD1;margin:24px 0 32px}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap}.primary{padding:14px 22px;background:#fff;color:var(--green-950);font-size:14px}.secondary{display:inline-flex;align-items:center;justify-content:center;padding:14px 21px;border-radius:999px;border:1px solid rgba(255,255,255,.58);color:#fff;font-weight:700;font-size:14px;transition:.25s}.secondary:hover{background:rgba(255,255,255,.1);transform:translateY(-2px)}
.hero-art{position:relative;min-height:560px;border-radius:0;background:transparent;overflow:visible;display:flex;align-items:center;justify-content:center;box-shadow:none}
.hero-art img{position:relative;z-index:2;width:92%;max-width:650px;filter:none;animation:floatPlane 7s ease-in-out infinite}
.corner{position:absolute;width:90px;height:90px;left:0;bottom:0;overflow:hidden;opacity:.65}.corner::before,.corner::after{content:"";position:absolute;bottom:0;left:0;clip-path:polygon(0 0,100% 100%,0 100%);background:var(--green-800)}.corner::before{width:90px;height:90px}.corner::after{width:52px;height:52px;background:var(--green-600)}
section{padding:104px 0;position:relative;border-top:1px solid rgba(215,232,223,.78)}.section-head{max-width:780px;margin-bottom:50px}.eyebrow{font-family:var(--mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--green-700);display:flex;align-items:center;gap:10px;margin-bottom:14px}.eyebrow::before{content:"";width:28px;height:2px;background:var(--green-600)}.section-head h2{font-size:clamp(30px,4.2vw,50px);color:var(--green-950)}.section-head p{color:var(--muted);font-size:17px;max-width:720px;margin:15px 0 0}
.about{background:#fff}.about-grid{display:grid;grid-template-columns:1.08fr .92fr;gap:70px;align-items:start}.about-copy h2{font-size:clamp(34px,5vw,57px);max-width:650px}.about-copy p{color:#456157;font-size:16.5px;max-width:640px;margin:18px 0 0}.about-note{margin-top:28px;padding:18px 0;border-top:1px solid var(--line);font-family:var(--display);font-size:18px;color:var(--green-800);max-width:600px}
.why{display:grid;grid-template-columns:1fr 1fr;gap:0;border-top:1px solid var(--line)}.why-item{padding:22px 18px 22px 0;border-bottom:1px solid var(--line)}.why-item:nth-child(even){padding-left:18px;padding-right:0;border-left:1px solid var(--line)}.why-item h3{font-size:18px;margin:10px 0 8px}.why-item p{margin:0;font-size:14px;color:var(--muted)}
.services{background:var(--mint-50)}.service-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.service{background:#fff;border:1px solid var(--line);min-height:184px;padding:25px 25px 24px;display:grid;grid-template-columns:62px 1fr;gap:18px;align-items:start;transition:.25s;position:relative;overflow:hidden}.service:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:#b6d9c7}.service::after{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--service)}.service img{width:56px;height:56px;object-fit:contain}.service h3{font-size:20px;margin:2px 0 8px}.service p{margin:0;color:var(--muted);font-size:14.5px}.service .tag{display:inline-block;margin-top:12px;font-family:var(--mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--service)}
.products{border-top-color:#cfe4d9;background:var(--mint-100);color:#184f3e}.products .section-head h2{color:#184f3e}.products .section-head p{color:#4d6d61}.products .eyebrow{color:#4aa875}.products .eyebrow::before{background:#4aa875}.product-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.product{background:#fff;border:1px solid #d7e5de;padding:24px;min-height:230px;position:relative;transition:.25s}.product:hover{transform:translateY(-4px);background:#fff;border-color:#b9d3c7}.product::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--prod)}
.product-logo{height:58px;display:flex;align-items:center;justify-content:flex-start;margin-bottom:16px}.product-logo img{max-height:58px;max-width:190px;object-fit:contain;background:transparent;padding:0}.product h3{font-size:18px;color:#184f3e;margin:8px 0 7px}.product small{font-family:var(--mono);font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:#184f3e}.product p{margin:11px 0 0;color:#4d6d61;font-size:13.8px}
.custom{background:#fff}.custom-grid{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:start}.custom-art{background:var(--green-900);position:relative;min-height:520px;padding:38px;overflow:hidden;color:#fff}.custom-art::before{content:"";position:absolute;inset:0;background:linear-gradient(140deg,rgba(56,184,126,.22),transparent 55%),radial-gradient(circle at 85% 15%,rgba(131,210,162,.2),transparent 35%)}.custom-art img{position:absolute;width:92%;right:-18%;bottom:-6%;opacity:.17;transform:rotate(-5deg)}.custom-art .quote{position:relative;z-index:2;font-family:var(--display);font-size:clamp(26px,3.2vw,42px);max-width:480px;line-height:1.17;margin:0}
.model-list{border-top:1px solid var(--line)}.model{display:block;padding:24px 0;border-bottom:1px solid var(--line)}.model h3{font-size:19px;margin:0 0 7px}.model p{margin:0;font-size:14px;color:var(--muted)}
.manage{background:var(--mint-100)}.manage-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:46px}.manage-card{background:#fff;border:1px solid var(--line);border-top:3px solid var(--green-600);padding:25px}.manage-card:nth-child(2){border-top-color:var(--plum)}.manage-card:nth-child(3){border-top-color:var(--cyan)}.manage-card h3{font-size:19px;margin-bottom:12px}.manage-card ul{padding:0;margin:0;list-style:none;display:grid;gap:9px}.manage-card li{font-size:13.8px;color:#506a61;padding-left:18px;position:relative}.manage-card li::before{content:"";position:absolute;left:0;top:.63em;width:6px;height:6px;background:var(--green-500);transform:rotate(45deg)}
.security-strip{margin-top:18px;background:var(--green-950);color:#fff;padding:28px;display:flex;align-items:center;gap:24px;justify-content:space-between}.security-strip h3{color:#fff;font-size:21px;margin-bottom:1em}.security-strip p{margin:0;color:#B8D2C5;font-size:14px;max-width:700px}
.ai{background:#fff}.ai-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:55px;align-items:center}.ai-copy h2{font-size:clamp(32px,4.4vw,52px)}.ai-copy p{color:var(--muted);max-width:650px}.ai-list{display:grid;gap:0;border-top:1px solid var(--line)}.ai-item{display:grid;grid-template-columns:1fr;gap:17px;padding:22px 0;border-bottom:1px solid var(--line)}.ai-item h3{font-size:18px;margin-bottom:5px}.ai-item p{margin:0;font-size:13.8px;color:var(--muted)}
.partners{background:var(--mint-50)}.partner-group{margin-top:30px}.group-title{font-family:var(--mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--green-700);display:flex;align-items:center;gap:12px;margin-bottom:13px}.group-title::after{content:"";height:1px;background:var(--line);flex:1}.logo-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.logo-tile{height:76px;border:1px solid #E1ECE7;background:#fff;display:flex;align-items:center;justify-content:center;padding:9px 12px;overflow:hidden;transition:.2s}.logo-tile:hover{border-color:#B7DBC7;box-shadow:0 10px 25px -24px rgba(6,48,37,.45)}.logo-tile img{max-width:100%;max-height:56px;object-fit:contain;transform:none}

.logo-tile img[alt="Nexthink"],
.logo-tile img[alt="Creatio"],
.logo-tile img[alt="BytePlus"],
.logo-tile img[alt="NetSfere"],
.logo-tile img[alt="Tencent Cloud"],
.client img[alt="Central Data Technology"],
.client img[alt="3Dolphins"],
.client img[alt="Mitra Integrasi Informatika"]{transform:scale(1.22)}

.clients{background:var(--mint-100)}.client-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-top:34px}.client{height:68px;background:#fff;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;padding:6px 10px;overflow:hidden}.client img{max-width:100%;max-height:52px;object-fit:contain;filter:grayscale(.08);transform:none}
.contact{border-top-color:rgba(255,255,255,.10);padding:0;background:var(--green-950);color:#fff}.contact-grid{display:grid;grid-template-columns:1fr 1fr;min-height:470px}.contact-copy{padding:74px 10% 74px 0;display:flex;flex-direction:column;justify-content:center}.contact-copy .eyebrow{color:#93D9AE}.contact-copy .eyebrow::before{background:#93D9AE}.contact-copy h2{color:#fff;font-size:clamp(34px,4.8vw,55px);max-width:600px}.contact-copy p{color:#B6D1C4;max-width:500px;margin:17px 0 26px}.contact-links{display:flex;flex-direction:column;align-items:flex-start;gap:11px}.contact-address{max-width:520px;color:#D7E9DF;font-size:13px;line-height:1.65}.contact-links a{display:inline-flex;align-items:center;gap:9px;border:1px solid rgba(255,255,255,.2);padding:11px 15px;color:#E6F3EC;font-size:13px}.contact-photo{min-height:470px;background-image:linear-gradient(90deg,rgba(6,48,37,.18),rgba(6,48,37,.04)),url("images/contact-photo.webp");background-size:cover;background-position:center;position:relative}
footer{background:#04231B;color:#9DB8AC;padding:22px 0;font-size:12px}.footer-row{display:flex;justify-content:space-between;gap:20px;align-items:center;flex-wrap:wrap}
.reveal{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s ease}.reveal.in{opacity:1;transform:none}
.floating{position:fixed;right:22px;bottom:20px;z-index:90;background:var(--green-900);color:#fff;border:none;border-radius:999px;padding:13px 18px;font-weight:700;box-shadow:0 18px 35px -18px rgba(0,0,0,.55);cursor:pointer;display:flex;align-items:center;gap:9px;transition:transform .22s ease,box-shadow .22s ease}.floating:hover{transform:translateY(-2px);box-shadow:0 22px 40px -18px rgba(0,0,0,.52)}
.modal{position:fixed;inset:0;background:rgba(5,25,20,.5);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:120;padding:24px;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .32s ease,visibility .32s ease}.modal.open{opacity:1;visibility:visible;pointer-events:auto}
.modal-card{width:min(680px,100%);background:#F8FCFA;border:1px solid rgba(215,232,223,.95);border-radius:24px;box-shadow:0 35px 100px -40px rgba(0,0,0,.55);padding:24px 24px 28px;max-height:min(84vh,720px);overflow:auto;overflow-anchor:none;transform:translateY(20px) scale(.97);opacity:0;transition:transform .42s cubic-bezier(.18,.82,.22,1),opacity .3s ease}.modal.open .modal-card{transform:none;opacity:1}
.modal-top{display:flex;justify-content:space-between;gap:14px;align-items:center;margin-bottom:10px}.modal-top h3{font-size:23px}.close{width:38px;height:38px;border:1px solid var(--line);background:#fff;border-radius:11px;cursor:pointer;transition:.2s}.close:hover{background:var(--mint-50);transform:rotate(3deg)}
.qa-grid{display:grid;gap:0;margin-top:15px;border-top:1px solid var(--line)}.qa-item{border-bottom:1px solid var(--line)}.qa-btn{width:100%;background:#F8FCFA;border:0;padding:16px 2px;text-align:left;cursor:pointer;font-weight:700;color:#244B3E;display:flex;align-items:center;justify-content:space-between;gap:16px;transition:color .2s ease,background .2s ease}.qa-btn::after{content:'+';font-family:var(--mono);font-size:16px;color:var(--green-600);transition:transform .24s ease}.qa-item.open .qa-btn::after{transform:rotate(45deg)}.qa-btn:hover{color:var(--green-900)}
.qa-answer{display:block;margin:0;background:var(--green-900);color:#E8F5EE;border-radius:14px;line-height:1.68;font-size:14px;padding:0;height:0;overflow:hidden;visibility:hidden;opacity:0;transform:scale(.96);transform-origin:top center;transition:height .32s cubic-bezier(.2,.8,.25,1),transform .28s cubic-bezier(.2,.8,.25,1),opacity .20s ease;will-change:height,transform,opacity;pointer-events:none}.qa-answer-inner{padding:16px 18px 18px}.qa-answer.show{visibility:visible;pointer-events:auto}.qa-answer.answer-opening{transform:scale(.96);opacity:0}.qa-answer.answer-closing{transform:scale(.96);opacity:0;pointer-events:none}.qa-contact-answer{min-height:0;max-height:none}.qa-contact-answer .contact-links{margin-top:0}.qa-contact-answer .contact-email-block{margin-top:10px}.qa-answer p{margin:0}.qa-address,.qa-email{display:block}.qa-address{margin-bottom:10px}.qa-answer strong{display:block;color:var(--mint-300);margin-bottom:5px}.qa-answer a{color:inherit;text-decoration:underline;text-underline-offset:2px}
@keyframes floatPlane{0%,100%{transform:translateY(0) rotate(-.5deg)}50%{transform:translateY(-8px) rotate(.4deg)}}
@media (min-width:981px){
  .about-grid{align-items:center}
}
@media(max-width:980px){
  .navlinks{display:none}.navlinks .mobile-cta{display:flex;align-items:center;justify-content:center;position:relative;gap:12px;margin-top:8px;padding:13px 42px 13px 15px;background:var(--green-900);color:#fff;border-radius:12px;font-weight:700;text-align:center}.navlinks .mobile-cta::after{display:none}.navlinks .mobile-cta span{font-size:16px;line-height:1;position:absolute;right:15px}.menu{display:flex;position:relative;margin-left:auto}.navcta{display:none}
  .hero{padding-top:100px}.hero-grid,.about-grid,.custom-grid,.ai-grid,.ask-wrap,.contact-grid{grid-template-columns:1fr}.hero-art{min-height:420px;order:-1}.product-grid{grid-template-columns:repeat(2,1fr)}.manage-grid{grid-template-columns:1fr}.client-grid{grid-template-columns:repeat(4,1fr)}.contact-copy{padding-right:0;padding-bottom:45px}
}
@media(max-width:640px){
  section{padding:76px 0}.container{width:min(92vw,540px)}.hero{padding-bottom:60px;min-height:auto}.hero-art{min-height:320px;border-radius:26px}.hero h1{font-size:clamp(38px,12vw,55px)}.lede{font-size:16px}.service-grid,.product-grid{grid-template-columns:1fr}.why{grid-template-columns:1fr}.why-item:nth-child(even){padding-left:0;border-left:none}.logo-grid{grid-template-columns:repeat(2,1fr)}.client-grid{grid-template-columns:repeat(2,1fr)}.contact-photo{min-height:300px}.modal{padding:14px}.modal-card{border-radius:22px;max-height:88svh;padding:20px 18px 22px}.floating{right:15px;bottom:14px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}}

html{overflow-x:hidden;-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{min-width:0;overflow-x:hidden;overscroll-behavior-x:none}
button,a{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
img{height:auto}
[id]{scroll-margin-top:76px}

@media (max-width:980px){
  .container{width:min(94vw,900px)}
  .topbar{padding:10px 0}
  .nav{min-height:44px;gap:14px}
  .brand img{width:94px}
  .menu{width:44px;height:44px;flex:none}
  .navlinks{display:none}.navlinks .mobile-cta{display:flex}

  .hero{padding:92px 0 56px;min-height:auto}
  .hero-grid{gap:28px;grid-template-columns:1fr}
  .hero-copy{order:1}
  .hero-art{order:2;min-height:clamp(250px,42svh,390px);margin-top:2px}
  .hero-art img{width:min(88vw,620px);max-height:42svh;object-fit:contain}
  .hero h1{max-width:760px;font-size:clamp(42px,8.4vw,68px);line-height:1.08}
  .lede{font-size:17px;line-height:1.62;max-width:700px}
  .hero-actions{gap:10px}
  .primary,.secondary{min-height:46px;padding:12px 18px}

  section{padding:82px 0}
  .section-head{margin-bottom:38px}
  .section-head p{font-size:16px;line-height:1.65}
  .about-grid,.custom-grid{grid-template-columns:1fr;gap:42px}
  .why{grid-template-columns:1fr 1fr}
  .why-item:nth-child(even){padding-left:18px;border-left:1px solid var(--line)}
  .service-grid{grid-template-columns:1fr}
  .service{min-height:0;grid-template-columns:58px 1fr;padding:22px;gap:15px}
  .product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .manage-grid{grid-template-columns:1fr}
  .ai-grid{grid-template-columns:1fr;gap:34px}
  .logo-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .client-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .contact-grid{grid-template-columns:1fr;min-height:0}
  .contact-copy{padding:60px 0 40px}
  .contact-photo{min-height:390px}

  .floating{right:16px;bottom:calc(14px + env(safe-area-inset-bottom,0px));min-height:46px;padding:11px 17px}

  .modal{align-items:center;padding:18px}
  .modal-card{width:min(760px,100%);max-height:90svh;border-radius:22px;padding:22px 20px 24px;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
  .modal-top{position:sticky;top:-22px;padding:2px 0 12px;background:#F8FCFA;z-index:20}
  .modal-top h3{font-size:24px}
  .close{width:44px;height:44px;flex:none}
  .qa-btn{min-height:48px;padding:15px 2px;font-size:15px;line-height:1.4}
  .qa-answer{font-size:14.5px;line-height:1.68}
}

@media (max-width:640px){
  section{border-top-color:rgba(215,232,223,.68)}
  .container{width:calc(100% - 32px);max-width:none}
  .topbar{padding:8px 0}
  .nav{min-height:44px}
  .brand img{width:88px}
  .menu{width:44px;height:44px}

  .hero{padding:84px 0 44px}
  .hero-grid{gap:20px}
  .hero-copy{order:1}
  .hero-art{order:2;min-height:260px;margin-top:0}
  .hero-art img{width:min(94vw,520px);max-height:34svh}
  .kicker{font-size:10px;letter-spacing:.14em;margin-bottom:15px}
  .hero h1{font-size:clamp(38px,11.5vw,54px);line-height:1.06;letter-spacing:-.03em}
  .lede{font-size:15.5px;line-height:1.62;margin:18px 0 24px}
  .hero-actions{display:grid;grid-template-columns:1fr;gap:10px}
  .primary,.secondary{width:100%;min-height:48px;font-size:14px}

  section{padding:68px 0}
  .section-head{margin-bottom:31px}
  .section-head h2{font-size:clamp(30px,8.2vw,42px)}
  .section-head p{font-size:15px;line-height:1.65}
  .about-copy h2{font-size:clamp(32px,9vw,46px)}
  .about-grid{gap:0}
  .about-copy p{font-size:15px;line-height:1.68}
  .why{grid-template-columns:1fr;border-top:1px solid var(--line)}
  .why-item{padding:15px 0!important;border-left:0!important}
  .why-item h3{font-size:18px}
  .why-item p{font-size:14px;line-height:1.62}

  .service{grid-template-columns:50px 1fr;padding:19px 18px;gap:14px}
  .service img{width:48px;height:48px}
  .service h3{font-size:18px}
  .service p{font-size:14px;line-height:1.62}
  .product-grid{grid-template-columns:1fr;gap:12px}
  .product{padding:21px;min-height:0}
  .product-logo{height:54px;margin-bottom:12px}
  .product-logo img{max-height:54px;max-width:175px}
  .custom-art{min-height:330px;padding:24px}
  .custom-art .quote{font-size:clamp(25px,7vw,34px)}
  .manage-card{padding:21px}
  .security-strip{padding:22px}
  .ai-grid{gap:28px}
  .ai-item{padding:20px 0}
  .logo-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .logo-tile{height:78px;padding:8px 10px}
  .logo-tile img{max-height:56px;max-width:100%}
  .logo-tile img[alt="Nexthink"],
  .logo-tile img[alt="Creatio"],
  .logo-tile img[alt="BytePlus"],
  .logo-tile img[alt="NetSfere"],
  .logo-tile img[alt="Tencent Cloud"]{transform:scale(1.14)}
  .client-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .client{height:76px;padding:7px 9px}
  .client img{max-height:58px;max-width:100%}
  .client img[alt="Central Data Technology"],
  .client img[alt="3Dolphins"],
  .client img[alt="Mitra Integrasi Informatika"]{transform:scale(1.14)}

  .contact-copy{padding:54px 0 36px}
  .contact-copy h2{font-size:clamp(34px,9vw,46px)}
  .contact-links{display:grid;grid-template-columns:1fr;gap:9px}
  .contact-links a{min-height:46px;padding:11px 14px}
  .contact-photo{min-height:280px}
  footer{padding:19px 0}
  .footer-row{font-size:11px}

  .floating{right:12px;bottom:calc(12px + env(safe-area-inset-bottom,0px));min-height:48px;padding:12px 16px}

  .modal{align-items:flex-end;padding:0;background:rgba(5,25,20,.58)}
  .modal-card{width:100%;max-height:92svh;border-radius:24px 24px 0 0;padding:18px 16px calc(20px + env(safe-area-inset-bottom,0px));transform:translateY(28px) scale(.985)}
  .modal.open .modal-card{transform:none}
  .modal-top{top:-18px;padding:1px 0 12px}
  .modal-top h3{font-size:22px}
  .modal> .modal-card> p{font-size:13.5px!important;line-height:1.55!important}
  .qa-grid{margin-top:13px}
  .qa-btn{min-height:52px;padding:15px 2px;font-size:14.5px}
  .qa-answer-inner{padding:15px 16px 17px}
  .qa-contact-answer .qa-answer-inner{padding:13px 16px 15px}.qa-contact-answer .contact-links{margin-top:0}.qa-contact-answer .contact-email-block{margin-top:8px}
}

@media (max-width:980px) and (orientation:landscape){
  .topbar{padding:7px 0}
  .nav{min-height:42px}
  .hero{padding:78px 0 34px;min-height:calc(100svh - 50px)}
  .hero-grid{grid-template-columns:minmax(0,1.08fr) minmax(260px,.92fr);gap:24px;align-items:center}
  .hero-copy{order:1}
  .hero-art{order:2;min-height:0;height:calc(100svh - 128px);max-height:360px;overflow:visible}
  
  .hero-art img{width:min(106%,610px);max-width:610px;max-height:none;height:auto;object-fit:contain;}
  .hero h1{font-size:clamp(34px,6vw,54px)}
  .lede{font-size:14.5px;margin:16px 0 20px;max-width:560px}
  .hero-actions{display:flex;position:relative;z-index:4}
  .primary,.secondary{width:auto;min-height:44px;padding:11px 16px}
  .primary{position:relative;z-index:5;background:#fff}
  .hero-copy{position:relative;z-index:6}
  .hero-art{z-index:1}
  section{padding:54px 0}
  .section-head{margin-bottom:30px}
  .about-grid,.custom-grid{grid-template-columns:1fr 1fr;gap:28px}
  .about-grid{align-items:center}
  .about-grid > .why{align-self:center}
  .why{grid-template-columns:1fr 1fr}
  .service-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .manage-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .manage-card:nth-child(3){grid-column:1 / -1;justify-self:center;width:calc((100% - 16px) / 2);margin-inline:auto}
  .ai-grid{grid-template-columns:1.05fr .95fr;gap:30px}
  .logo-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .client-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .contact-grid{grid-template-columns:1fr 1fr;min-height:360px}
  .contact-copy{padding:42px 8% 42px 0}
  .contact-photo{min-height:360px}
  .floating{right:15px;bottom:calc(12px + env(safe-area-inset-bottom,0px));min-height:44px}
  .modal{align-items:center;padding:12px}
  .modal-card{max-height:88svh;border-radius:20px;padding:18px 18px 20px}
}

@media (max-width:640px) and (orientation:landscape){
  .hero{padding-top:68px;padding-bottom:24px;min-height:calc(100svh - 44px)}
  .hero-grid{grid-template-columns:minmax(0,1.05fr) minmax(190px,.95fr);gap:18px}
  .hero-art{height:calc(100svh - 112px);max-height:270px;overflow:visible}
  .hero-art img{width:min(102%,520px);max-width:520px;max-height:none;height:auto}
  .hero h1{font-size:clamp(31px,7vw,43px)}
  .lede{font-size:13px;margin:12px 0 15px;line-height:1.52}
  .kicker{margin-bottom:10px}
  .primary,.secondary{min-height:42px;padding:9px 13px;font-size:12.5px}
  section{padding:42px 0}
  .service-grid,.product-grid,.manage-grid,.logo-grid,.client-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .about-grid,.custom-grid,.contact-grid{grid-template-columns:1fr 1fr}
  .contact-photo{min-height:280px}
  .modal-card{max-height:92svh;max-height:92dvh}
}

@media (max-width:980px){
  
.navlinks{
    display:flex;
    position:absolute;
    top:58px;
    left:auto;
    right:0;
    width:min(360px,calc(100vw - 32px));
    flex-direction:column;
    gap:4px;
    padding:12px;
    margin:0;
    background:#fff;
    border:1px solid var(--line);
    border-radius:18px;
    box-shadow:0 24px 55px -24px rgba(5,47,35,.42),0 8px 24px -18px rgba(5,47,35,.22);
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transform:scale(.90) translateY(-8px);
    transform-origin:top right;
    transition:opacity .24s ease,transform .34s cubic-bezier(.18,.82,.22,1),visibility .24s ease;
    z-index:85;
  }
  .navlinks.mobile-open{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:scale(1) translateY(0);
  }
  .navlinks>a:not(.mobile-cta){
    display:flex;
    align-items:center;
    min-height:46px;
    width:100%;
    padding:11px 13px;
    border-radius:12px;
  }
  .navlinks>a:not(.mobile-cta):hover{background:var(--mint-50)}
  .navlinks .mobile-cta{
    margin-top:7px;
    min-height:48px;
    border-radius:12px;
  }

  
.modal{
    align-items:center;
    justify-content:center;
    padding:14px;
  }
  .modal-card{
    width:min(92vw,620px);
    max-height:88svh;
    max-height:88svh;
    border-radius:22px;
    transform:scale(.88) translateY(8px);
    transform-origin:center center;
  }
  .modal.open .modal-card{transform:scale(1) translateY(0)}
}

@media (max-width:640px){
  .navlinks{
    top:56px;
    width:min(360px,calc(100vw - 24px));
    border-radius:17px;
    padding:10px;
    transform:scale(.90) translateY(-7px);
  }
  .navlinks>a:not(.mobile-cta){min-height:47px;padding:11px 13px}
  .navlinks .mobile-cta{margin-top:6px;min-height:49px}

  .modal{padding:12px}
  .modal-card{
    width:min(94vw,560px);
    max-height:88svh;
    max-height:88dvh;
    border-radius:21px;
    padding:18px 16px calc(20px + env(safe-area-inset-bottom,0px));
    transform:scale(.86) translateY(8px);
  }
  .modal.open .modal-card{transform:scale(1) translateY(0)}
}

@media (max-width:980px) and (orientation:landscape){
  .navlinks{
    top:54px;
    width:min(410px,calc(100vw - 28px));
  }
  .modal-card{
    width:min(86vw,700px);
    max-height:88dvh;
  }
}

@media (prefers-reduced-motion:reduce){
  .navlinks,.modal,.modal-card{transition:none!important}
}

.contact-links{
  display:block;
  margin-top:8px;
}
.contact-detail{
  padding:0;
}
.contact-label{
  display:block;
  margin-bottom:0;
  color:#93D9AE;
  font-size:10px;
  line-height:1;
  font-weight:800;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.contact-address{
  max-width:620px;
  margin:0;
  color:#D7E9DF;
  font-size:15px;
  line-height:1.65;
  font-style:normal;
  text-wrap:balance;
}
.contact-email-block{
  margin-top:23px;
}
.contact-email-block .contact-label{
  margin-bottom:0;
}
.contact-links .contact-email{
  display:block;
  width:max-content;
  max-width:100%;
  margin:0;
  padding:0 !important;
  border:0 !important;
  color:#D7E9DF;
  font-size:15px;
  line-height:1.65;
  font-weight:400;
  letter-spacing:normal;
  text-decoration:none;
}
.contact-email-address{
  color:#D7E9DF;
  transition:color .18s ease,text-decoration-color .18s ease;
}
.contact-email:hover .contact-email-address,
.contact-email:focus-visible .contact-email-address{
  color:#4DA3FF !important;
  text-decoration-line:underline;
  text-decoration-color:#4DA3FF;
  text-decoration-thickness:1.5px;
  text-underline-offset:4px;
}

@media(max-width:980px){
  .contact-email-block{margin-top:23px}
}

@media(max-width:640px){
  .contact-copy{padding:50px 0 34px}
  .contact-links{margin-top:6px}
  .contact-label{margin-bottom:0;font-size:9px}
  .contact-address{font-size:14px;line-height:1.62}
  .contact-email-block{margin-top:18px}
  .contact-links .contact-email{font-size:14px;line-height:1.62;padding:0 !important;border:0 !important}
}

@media (max-width:640px) and (orientation:portrait){
  .qa-contact-answer{
    display:block;
    box-sizing:border-box;
    min-height:0;
    max-height:none;
    padding:0;
  }
  .qa-contact-answer .qa-answer-inner{
    padding:13px 16px 15px;
  }
  .qa-contact-answer .contact-email-block{
    margin-top:0 !important;
    display:flex;
    flex-direction:column;
    justify-content:flex-start;
    transform:none;
  }
  .qa-contact-answer .contact-label{
    margin:0 0 4px !important;
    line-height:1.05;
  }
  .qa-contact-answer .contact-email{
    line-height:1.45;
  }
}



.service-accent-green{--service:#28A873}
.service-accent-orange{--service:#FF7418}
.service-accent-cyan{--service:#55C9EE}
.service-accent-plum{--service:#A33F74}
.service-accent-pink{--service:#F41475}
.service-accent-violet{--service:#7859F5}
.product-accent-green{--prod:#28A873}
.product-accent-teal{--prod:#14B8A6}
.product-accent-olive{--prod:#7AAE55}
.product-accent-blue{--prod:#1EA7D8}
.product-accent-yellow{--prod:#E8C93E}
.product-accent-sky{--prod:#35A8E0}
.eyebrow-mint{color:#98DDB2}
.eyebrow-rule{width:28px;height:2px;background:#98DDB2;display:block}
.section-head-gap{margin-bottom:30px}
.secure-label{color:#9AE1B4;font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;display:inline-flex;align-items:center;white-space:nowrap;flex:0 0 auto}.secure-label span{display:inline}.secure-label span+span::before{content:"·";display:inline-block;margin:0 .55em}
.modal-intro{margin:0;color:var(--muted);font-size:14px}


@media(max-width:980px) and (orientation:landscape){
  .security-strip{align-items:center}
  .security-strip > div{min-width:0}
  .security-strip .secure-label{display:flex;flex:0 0 auto;width:max-content;min-width:max-content;margin-left:auto;margin-right:0;justify-content:flex-end;align-items:center;text-align:right;white-space:nowrap;line-height:1.45}
  .security-strip .secure-label span{display:inline;white-space:nowrap}
  .security-strip .secure-label span+span::before{display:inline-block;width:auto;margin:0 .55em;line-height:inherit;text-align:initial}
}

@media(max-width:640px) and (orientation:portrait){
  .security-strip{align-items:center}
  .security-strip .secure-label{display:flex;flex-direction:column;align-items:stretch;justify-content:center;gap:.48em;line-height:1.45;text-align:center;flex:0 0 auto;width:max-content;min-width:max-content;margin-left:auto;margin-right:0;white-space:nowrap}
  .security-strip .secure-label span{display:block;width:100%;white-space:nowrap;text-align:center}
  .security-strip .secure-label span+span::before{content:"·";display:block;width:100%;margin:0;text-align:center;line-height:.7}
}

.modal-no-scroll{overflow:hidden}


@media (max-width:640px) and (orientation:landscape){
  .nav{gap:10px}
  .brand img{width:88px}
  .navlinks{gap:clamp(7px,1.8vw,11px);font-size:12.5px}
  .navcta{padding:9px 13px;font-size:12px}
}


@media (max-width:980px) and (orientation:landscape){
  .menu{display:none!important;visibility:hidden!important;pointer-events:none!important}
  .navlinks{
    display:flex!important;
    position:static!important;
    top:auto!important;
    right:auto!important;
    left:auto!important;
    width:auto!important;
    flex:0 0 auto!important;
    flex-direction:row!important;
    gap:clamp(10px,2vw,16px)!important;
    padding:0!important;
    margin-left:auto!important;
    margin-right:0!important;
    background:transparent!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    transform:none!important;
    transform-origin:initial!important;
    transition:none!important;
  }
  .navlinks>a:not(.mobile-cta){
    display:inline-flex!important;
    align-items:center;
    min-height:0;
    width:auto;
    padding:8px 0;
    border-radius:0;
    flex:0 0 auto;
  }
  .navlinks .mobile-cta{display:none!important}
  .navcta{display:inline-flex!important;flex:0 0 auto}
}



.service-grid > a.service {
  position:relative;
  z-index:1;
  cursor:pointer;
  pointer-events:auto;
  -webkit-tap-highlight-color:transparent;
}
.service-grid > a.service > * ,
.service-grid > a.service::after {
  pointer-events:none;
}


.qa-answer.show{
  visibility:visible;
  pointer-events:auto;
}
.qa-answer.answer-opening{
  transform:scale(.96);
  opacity:0;
}
.qa-answer.answer-closing{
  transform:scale(.96);
  opacity:0;
  pointer-events:none;
}
.modal-card{position:relative;isolation:isolate}
.modal-top{position:relative;z-index:50;isolation:isolate}
.modal-top .close{position:relative;z-index:51;pointer-events:auto}
.qa-grid{position:relative;z-index:1}
.qa-answer{position:relative;z-index:1}
.modal.open.closing{opacity:0;visibility:hidden;pointer-events:none}
.modal.open.closing .modal-card{transform:translateY(20px) scale(.97);opacity:0}
@media (prefers-reduced-motion:reduce){
  .qa-answer,
  .qa-answer.answer-opening,
  .qa-answer.answer-closing{transition:none!important;transform:none!important}
  .modal.open.closing .modal-card{transition:none!important;transform:none!important}
}


@media (max-width:640px) and (orientation:portrait){
  .qa-contact-answer .qa-answer-inner{
    padding:13px 16px 15px;
  }
  .qa-contact-answer .contact-email{
    min-height:0;
  }
}