:root{--ink:#13223b;--muted:#63718a;--bg:#f8f9fd;--surface:#fff;--accent:#2353d5;--accent2:#92e7e6;--line:rgba(30,54,91,.12);--display: 'Arial', sans-serif;--font: 'Arial',sans-serif;--radius:24px;--max:1220px;--shadow:0 24px 85px rgba(24,37,78,.07)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:84px}body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font);-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}button{cursor:pointer}button:disabled{opacity:.55;cursor:not-allowed}a,button{transition:transform .25s,background .25s,color .25s,border-color .25s}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--accent2);outline-offset:3px}::selection{background:var(--accent2);color:#101820}
.page{overflow:hidden}.shell{max-width:var(--max);padding:0 32px;margin:0 auto}.eyebrow{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.19em}.eyebrow:before{content:'';display:inline-block;width:17px;height:2px;background:currentColor;margin-right:10px;vertical-align:middle}h1,h2,h3,p{margin:0}h1,h2,h3{font-family:var(--display);letter-spacing:-.065em}h1{font-size:clamp(54px,7vw,110px);line-height:.98;max-width:1080px}h2{font-size:clamp(37px,4.8vw,71px);line-height:1.04}h3{font-size:clamp(22px,2.5vw,32px);line-height:1.15}.lead{font-size:clamp(17px,1.6vw,22px);line-height:1.56;color:var(--muted);max-width:680px}.muted{color:var(--muted)}.small{font-size:13px;line-height:1.6}.tiny{font-size:11px;line-height:1.5}.btn{appearance:none;border:1px solid transparent;min-height:52px;display:inline-flex;align-items:center;gap:24px;border-radius:100px;padding:0 24px;font-weight:750;font-size:14px;justify-content:center;white-space:nowrap}.btn:hover{transform:translateY(-3px)}.btn:after{content:'↗';font-size:20px;font-weight:400;line-height:1}.btn-primary{background:var(--accent);color:#fff}.btn-outline{color:var(--ink);border-color:var(--line);background:transparent}.btn-outline:hover{border-color:var(--ink)}.btn-light{background:#fff;color:#10223d}.btn-white-outline{border-color:rgba(255,255,255,.35);color:#fff;background:transparent}.arrow-link{font-size:13px;font-weight:800;border-bottom:1px solid currentColor;padding-bottom:5px;display:inline-flex;align-items:center;gap:20px}.arrow-link:after{content:'↗';font-size:19px}.arrow-link:hover{gap:27px}
.header{position:absolute;z-index:100;top:0;left:0;width:100%;border-bottom:1px solid var(--line);transition:background .3s}.header-inner{height:78px;display:flex;align-items:center;justify-content:space-between;gap:20px}.logo{font-weight:900;font-size:29px;letter-spacing:-.09em;line-height:1}.logo i{font-style:normal;color:var(--accent)}.nav{display:flex;align-items:center;gap:30px}.nav>a{font-size:13px;font-weight:700;white-space:nowrap}.nav>a:not(.btn):hover{opacity:.55}.nav .btn{min-height:42px;padding:0 19px}.menu-btn{display:none;width:43px;height:43px;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:50%;background:transparent;position:relative}.menu-btn span,.menu-btn:before,.menu-btn:after{content:'';display:block;height:2px;width:18px;background:currentColor;position:absolute}.menu-btn:before{transform:translateY(-6px)}.menu-btn:after{transform:translateY(6px)}.mobile-nav{display:none;position:absolute;top:78px;left:0;right:0;background:var(--surface);padding:16px 32px 24px;box-shadow:0 18px 35px rgba(0,0,0,.12);z-index:110}.mobile-nav.open{display:flex;flex-direction:column;gap:0}.mobile-nav a{padding:14px 4px;border-bottom:1px solid var(--line);font-weight:700}
.section{padding:120px 0;position:relative}.section-top{display:flex;align-items:start;justify-content:space-between;gap:45px;margin-bottom:50px}.section-top h2{max-width:800px}.section-top .lead{font-size:17px;max-width:320px;align-self:end}.section-kicker{font-weight:800;letter-spacing:.17em;text-transform:uppercase;font-size:11px;opacity:.65;margin-bottom:24px}.section-dark{background:#132441;color:#fff}.section-dark .lead,.section-dark .muted{color:#b8c6d7}.pain-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.pain-card{padding:30px;border:1px solid var(--line);border-radius:var(--radius);min-height:240px;display:flex;flex-direction:column;justify-content:space-between;background:var(--surface)}.pain-card .num{font-size:14px;opacity:.45;font-weight:750}.pain-card h3{margin-bottom:14px}.pain-card p{font-size:15px;line-height:1.55;color:var(--muted)}.expertise-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.expert-card{min-height:430px;padding:32px;border:1px solid var(--line);border-radius:var(--radius);position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;background:var(--surface)}.expert-card:hover{transform:translateY(-6px)}.expert-card .e-no{font-size:12px;font-weight:700;letter-spacing:.14em}.expert-card h3{margin:0 0 12px}.expert-card p{font-size:14px;line-height:1.65;max-width:330px;color:var(--muted)}.expert-card .expert-bottom{position:relative;z-index:2}.expert-card .arrow-link{margin-top:22px}.expert-art{width:100%;height:140px;position:relative;display:flex;align-items:center;justify-content:center;pointer-events:none}.expert-art svg{max-width:100%;max-height:100%;overflow:visible}.solution-strip{display:flex;flex-wrap:wrap;gap:10px;margin-top:45px}.solution-strip span{padding:12px 20px;border-radius:100px;border:1px solid var(--line);font-size:14px;font-weight:750}.portfolio-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}.work-card{position:relative;overflow:hidden;border-radius:var(--radius);border:1px solid var(--line);background:var(--surface)}.work-art{height:290px;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center}.work-text{padding:27px 29px 31px}.work-text .tiny{font-weight:800;letter-spacing:.12em;text-transform:uppercase;opacity:.55;margin-bottom:12px}.work-text p{font-size:15px;color:var(--muted);margin-top:12px;line-height:1.5}.work-art .screen{width:68%;padding:16px;background:rgba(255,255,255,.92);box-shadow:0 22px 70px rgba(12,21,50,.16);border-radius:13px;transform:rotate(-7deg);border:1px solid rgba(255,255,255,.7)}.screen-top{display:flex;gap:5px;margin-bottom:16px}.screen-top b{display:block;background:rgba(20,36,64,.2);width:6px;height:6px;border-radius:50%}.mini-bars{display:flex;align-items:end;gap:9px;height:77px}.mini-bars span{flex:1;background:#3d65e5;border-radius:5px 5px 0 0}.mini-bars span:nth-child(1){height:47%}.mini-bars span:nth-child(2){height:69%;background:#92cadb}.mini-bars span:nth-child(3){height:42%}.mini-bars span:nth-child(4){height:93%}.mini-bars span:nth-child(5){height:77%;background:#92cadb}.mini-bars span:nth-child(6){height:100%}.flow-art{width:78%;display:flex;align-items:center;justify-content:center;gap:8px;transform:rotate(-8deg)}.flow-art span{background:#fff;color:#1a3362;padding:14px 13px;border:1px solid #d1defb;border-radius:12px;box-shadow:0 11px 24px rgba(0,0,0,.07);font-size:12px;font-weight:800}.flow-art em{font-style:normal;color:#5381df}.loyalty-art{height:165px;width:270px;position:relative;background:#fff;border-radius:19px;padding:25px;transform:rotate(-9deg);box-shadow:0 30px 45px rgba(0,0,0,.14)}.loyalty-art .dots{display:flex;gap:7px;margin-top:20px}.loyalty-art .dots span{height:20px;width:20px;border-radius:50%;background:#ef8c75}.loyalty-art .dots span:nth-child(n+5){background:#f3e3de;border:1px dashed #ef8c75}.loyalty-art strong{display:block;font-size:25px;letter-spacing:-.06em}.auto-art{width:75%;height:166px;position:relative}.auto-art:before{content:'';position:absolute;top:30px;bottom:30px;left:50%;border-left:2px dashed rgba(255,255,255,.75)}.auto-art .a-box{position:absolute;background:#fff;color:#283f7e;box-shadow:0 12px 35px rgba(0,0,0,.12);padding:15px 19px;border-radius:12px;font-weight:800;font-size:12px}.auto-art .a-box:nth-child(1){left:0;top:8px}.auto-art .a-box:nth-child(2){right:0;top:65px}.auto-art .a-box:nth-child(3){left:10%;bottom:0}.auto-art .a-dot{width:60px;height:60px;border-radius:50%;background:#91def5;position:absolute;top:53px;left:calc(50% - 30px);border:12px solid rgba(255,255,255,.85);box-shadow:0 0 0 9px rgba(128,235,252,.2)}
.outcome-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:17px}.outcome-card{border-top:1px solid var(--line);padding:26px 12px 0 0}.outcome-card .metric{font-size:clamp(48px,6vw,86px);font-weight:900;letter-spacing:-.08em;line-height:1.05;margin:22px 0}.outcome-card h3{font-size:23px;letter-spacing:-.04em}.outcome-card p{color:var(--muted);font-size:14px;line-height:1.6;margin-top:14px;min-height:80px}.outcome-card a{font-size:12px;font-weight:800;text-decoration:underline;text-underline-offset:5px}.source-note{margin-top:30px;font-size:12px;line-height:1.55;color:var(--muted)}.about-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:70px;align-items:center}.about-lines{border-top:1px solid var(--line)}.about-lines>div{padding:21px 0;border-bottom:1px solid var(--line);display:flex;gap:22px;align-items:center}.about-lines b{font-size:12px;opacity:.5}.about-lines strong{font-size:18px}.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:50px}.step{border-top:1px solid var(--line);padding:25px 14px 15px 0}.step b{font-size:12px}.step h3{margin:38px 0 9px}.step p{font-size:14px;line-height:1.5;color:var(--muted)}
.contact{padding:100px 0 120px}.contact-shell{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:start}.contact-intro{position:sticky;top:120px}.contact-intro h2{font-size:clamp(45px,5.8vw,82px)}.contact-intro .lead{margin-top:28px}.contact-benefits{margin-top:65px;display:flex;flex-direction:column;gap:17px}.contact-benefits span{font-weight:700;font-size:14px;padding-bottom:14px;border-bottom:1px solid var(--line);max-width:400px}.form-box{background:var(--surface);color:#15243a;border:1px solid rgba(20,34,58,.12);border-radius:26px;padding:32px;box-shadow:var(--shadow)}.form-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}.form-head b{font-size:16px}.form-head small{color:#70809a;font-size:11px}.progress{height:4px;background:#e5ebf5;border-radius:20px;overflow:hidden;margin-bottom:26px}.progress>span{display:block;width:50%;height:100%;background:#285cdf;transition:width .3s}.f-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.f-field{margin-bottom:15px}.f-field.full{grid-column:1/-1}.f-field label{display:block;font-size:12px;font-weight:800;margin-bottom:9px;color:#24354c}.f-field input,.f-field select,.f-field textarea{width:100%;border-radius:12px;border:1px solid #dae2ed;padding:14px 13px;min-height:49px;outline:none;background:#fff;color:#15243a;font-size:13px}.f-field textarea{height:105px;resize:vertical}.f-field input:focus,.f-field select:focus,.f-field textarea:focus{border-color:#275acb;box-shadow:0 0 0 3px rgba(39,90,203,.12)}.consent{display:flex;gap:11px;font-size:12px;line-height:1.5;color:#55647c;align-items:flex-start;margin:15px 0 24px}.consent input{width:16px;height:16px;flex-shrink:0;accent-color:#285cdf}.form-actions{display:flex;gap:10px;align-items:center}.form-actions .btn{flex:1}.step-panel[hidden],.result-panel[hidden]{display:none!important}.result-panel{background:#eff4ff;border-radius:12px;padding:18px;margin:15px 0;max-height:250px;overflow:auto;color:#273a60;white-space:pre-wrap;font-size:12px;line-height:1.75}.form-notice{margin-top:15px;font-size:11px;color:#72809a;line-height:1.5}.footer{padding:37px 0;border-top:1px solid var(--line)}.footer-flex{display:flex;justify-content:space-between;align-items:center;gap:18px}.footer small{font-size:12px;color:var(--muted)}.footer a{font-size:12px;font-weight:700}
.reveal{opacity:0;transform:translateY(24px);transition:opacity .75s ease,transform .75s cubic-bezier(.21,.72,.21,1)}.reveal.visible{opacity:1;transform:none}.reveal.delay1{transition-delay:.1s}.reveal.delay2{transition-delay:.2s}.reveal.delay3{transition-delay:.3s}.demo-watermark{font-size:11px;opacity:.65}
@media(max-width:1000px){.nav{gap:15px}.nav>a:not(.btn){display:none}.section{padding:84px 0}.section-top{flex-direction:column;gap:20px}.section-top .lead{align-self:start}.contact-shell{grid-template-columns:1fr 1.2fr;gap:22px}.expert-card{padding:23px}.expert-card h3{font-size:25px}}
@media(max-width:700px){.shell{padding:0 20px}.header-inner{height:70px}.logo{font-size:25px}.nav{display:none}.menu-btn{display:flex}.mobile-nav{top:70px}.section{padding:78px 0}.section-top{margin-bottom:28px}.pain-grid,.expertise-grid,.portfolio-grid,.outcome-grid,.about-grid,.contact-shell{grid-template-columns:1fr}.pain-card{min-height:186px}.expert-card{min-height:360px}.expert-art{height:110px}.outcome-card p{min-height:auto}.about-grid{gap:35px}.steps{grid-template-columns:1fr 1fr;row-gap:32px}.step h3{margin-top:20px}.contact{padding:70px 0}.contact-intro{position:static}.contact-benefits{margin:25px 0 8px;gap:8px}.contact-benefits span{padding-bottom:9px}.form-box{padding:22px}.footer-flex{flex-direction:column;align-items:start}.f-grid{grid-template-columns:1fr}.f-field.full{grid-column:auto}.btn{white-space:normal;text-align:center}.work-art{height:240px}h1{font-size:clamp(47px,12.8vw,76px)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}}


:root{--bg:#fff8ed;--surface:#fffdf7;--ink:#191c20;--muted:#696b67;--accent:#fa523e;--accent2:#fee166;--line:rgba(29,30,29,.2);--radius:3px;--display:'Arial',sans-serif}.header{border:none}.logo i{color:#f8523a}.hero-gallery{padding-top:130px;background:#fff8ed;position:relative}.gallery-heading>.eyebrow{padding-bottom:22px}.gallery-headline{display:grid;grid-template-columns:1.3fr .7fr;align-items:end;gap:30px;padding:10px 0 65px}.gallery-headline h1{font-size:clamp(80px,11vw,175px);line-height:.85;letter-spacing:-.11em;max-width:850px}.gallery-headline h1 i{font-style:normal;color:#f05239}.gallery-side{padding:0 0 6px 35px;position:relative}.gallery-side .lead{font-size:17px;max-width:340px;margin-bottom:25px}.rotating-ring{display:inline-flex;align-items:center;justify-content:center;border:2px dashed #ef5845;color:#ea543d;font-size:9px;line-height:1.6;letter-spacing:.17em;width:120px;height:120px;border-radius:50%;padding:25px;text-align:center;font-weight:900;animation:slowturn 18s linear infinite;margin-bottom:25px}@keyframes slowturn{to{transform:rotate(360deg)}}.gallery-mosaic{display:grid;grid-template-columns:1.17fr .83fr 1fr;gap:0;height:380px}.tile{position:relative;overflow:hidden;padding:25px;display:flex;justify-content:space-between;flex-direction:column;isolation:isolate}.tile-one{background:#f9dc67}.tile-two{background:#f05c48;color:#fff}.tile-three{background:#292d32;color:#fff}.tile-label{font-size:10px;font-weight:850;letter-spacing:.15em;position:relative;z-index:2}.tile strong{font-size:clamp(30px,3.3vw,54px);letter-spacing:-.075em;line-height:1;z-index:2}.tile-symbol{position:absolute;inset:0;pointer-events:none;transition:transform .6s}.tile:hover .tile-symbol{transform:scale(1.13) rotate(5deg)}.rings i{position:absolute;width:230px;height:230px;border-radius:50%;border:35px solid #fff3bd;right:-40px;top:-60px}.rings i:nth-child(2){width:125px;height:125px;right:10px;top:15px;border-color:#e28f41;border-width:24px}.rings i:nth-child(3){width:45px;height:45px;right:47px;top:55px;border:0;background:#292d32}.bubbles i{position:absolute;background:#ffbca6;width:90px;height:90px;border-radius:50%;top:10%;left:20%;box-shadow:90px 90px 0 -15px #f4a58e}.bubbles i:nth-child(2){left:58%;top:35%;background:#ee3f36;width:80px;height:80px;border:2px solid #ffc7b4}.bubbles i:nth-child(3){left:12%;top:47%;width:38px;height:38px;background:#ffde88}.bubbles i:nth-child(4){left:62%;top:-12%;width:150px;height:150px;background:#f4836e}.bubbles i:nth-child(5){left:35%;top:15%;width:26px;height:26px;background:#ffe6b7}.slabs i{position:absolute;background:#e8e5ca;height:135px;width:150px;top:20%;left:25%;transform:rotate(-25deg);border:4px solid #292d32;box-shadow:18px 18px 0 #81dbc2}.slabs i:nth-child(2){transform:rotate(-8deg);top:14%;left:35%;background:#f47d62;box-shadow:none}.slabs i:nth-child(3){transform:rotate(11deg);top:25%;left:48%;background:#ffda6f;box-shadow:none}.marquee{white-space:nowrap;overflow:hidden;border-top:2px solid #1b1b1b;border-bottom:2px solid #1b1b1b;padding:16px 0;font-weight:900;font-size:24px;letter-spacing:.03em}.marquee>div{display:inline-block;animation:marquee 24s linear infinite}@keyframes marquee{to{transform:translateX(-45%)}}.pains{background:#f6e9d9}.pain-card,.expert-card,.work-card,.form-box{border-radius:2px}.expertise{background:#fffdfa}.portfolio{background:#ffdf6c}.outcome-card .metric{color:#ef523d}.about{background:#d1e8dd}.contact{background:#212b30}
@media(max-width:700px){.hero-gallery{padding-top:112px}.gallery-headline{grid-template-columns:1fr;padding-bottom:30px;gap:25px}.gallery-headline h1{font-size:clamp(72px,18vw,125px)}.gallery-side{padding:0}.rotating-ring{display:none}.gallery-side .lead{font-size:16px}.gallery-mosaic{grid-template-columns:1fr 1fr;height:auto}.tile{min-height:225px;padding:18px}.tile:nth-child(3){grid-column:1/-1;min-height:225px}.tile strong{font-size:31px}.marquee{font-size:18px;padding:12px 0}}

/* Production refinements while preserving Concept 04 aesthetic */
:root{--accent:#f05239}html{scroll-padding-top:94px}body{overflow-x:hidden}.header{background:rgba(255,248,237,.90);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);position:sticky;top:0}.hero-gallery{padding-top:54px}nav a:focus-visible,.btn:focus-visible{outline:3px solid #191c20;outline-offset:5px}a{word-break:normal}.source-note{max-width:900px}.footer-flex{flex-wrap:wrap}.f-field input,.f-field select,.f-field textarea{font-size:16px}.f-field label{font-size:13px}.form-box{box-shadow:0 20px 72px rgba(0,0,0,.15)}.form-box a{color:#1b4fbd;text-decoration:underline;text-underline-offset:3px}.consent a{font-weight:750}.form-alert{background:#ffebe6;color:#8b2713;border-left:4px solid #d9472c;padding:14px;margin:14px 0;border-radius:3px;font-size:13px;line-height:1.5}.form-alert[hidden]{display:none}.captcha-container{min-height:18px;margin:10px 0 18px}.honeypot{position:absolute!important;left:-9999px!important;opacity:0!important;pointer-events:none!important}.form-actions .btn{min-width:0}.tile-symbol{will-change:transform}.gallery-mosaic{contain:layout paint}.work-art{transition:filter .35s}.work-card:hover .work-art{filter:saturate(1.15)}.work-card:hover .screen{transform:rotate(-4deg) translateY(-4px)}.work-art .screen{transition:transform .4s}.skip-link{position:fixed;left:16px;top:-80px;z-index:999;background:white;color:black;padding:12px}.skip-link:focus{top:12px}.form-notice{font-size:12px}.result-panel{white-space:normal;font-size:14px}.tile strong{max-width:95%}
@media(max-width:700px){.header{position:sticky;top:0}.hero-gallery{padding-top:40px}.gallery-headline h1{font-size:clamp(64px,17vw,118px)}.gallery-mosaic{grid-template-columns:1fr 1fr}.tile{min-width:0}.tile strong{overflow-wrap:break-word}.contact-shell{gap:26px}.footer-flex{gap:15px}.contact-intro h2{font-size:clamp(44px,11vw,70px)}.form-box{padding:18px}.section-top h2{max-width:100%}}
@media(max-width:370px){.tile strong{font-size:26px}.gallery-headline h1{font-size:62px}}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1!important;transform:none!important}.rotating-ring,.marquee>div{animation:none!important}}

/* Progressive enhancement: content remains visible without JavaScript. */
.reveal{opacity:1;transform:none}.js .reveal{opacity:0;transform:translateY(24px)}.js .reveal.visible{opacity:1;transform:none}
@media(max-width:700px){.tile strong{font-size:clamp(23px,6.7vw,29px)}}
.work-text .arrow-link{margin-top:20px}

/* Odoo marketplace connectivity visual. */
.integration-canvas{background:linear-gradient(135deg,#c8e9e8 0%,#9db6e8 52%,#7d91df 100%)}.integration-map{position:relative;width:min(92%,520px);height:250px}.integration-hub{position:absolute;z-index:3;left:50%;top:50%;width:142px;height:76px;transform:translate(-50%,-50%);display:grid;place-items:center;background:#fff;border:2px solid #191c20;border-radius:14px;box-shadow:8px 8px 0 rgba(113,75,103,.28)}.integration-hub:after{content:'ERP HUB';position:absolute;bottom:7px;font-size:7px;font-weight:900;letter-spacing:.18em;color:#714b67}.integration-hub img{width:92px;height:34px;object-fit:contain;margin-top:-10px}.market-node{position:absolute;z-index:3;width:104px;height:54px;padding:8px 9px;display:flex;align-items:center;gap:7px;background:#fff;border:1.5px solid #191c20;border-radius:10px;box-shadow:4px 4px 0 rgba(25,28,32,.13);animation:market-float 4s ease-in-out infinite}.market-node img{width:25px;height:25px;object-fit:contain;flex:none}.market-node span{font-size:8px;font-weight:900;line-height:1.05}.market-shopee{left:1%;top:6%}.market-tokopedia{right:0;top:7%;animation-delay:-.8s}.market-tiktok{left:0;bottom:4%;animation-delay:-1.6s}.market-lazada{left:50%;bottom:0;transform:translateX(-50%);animation-name:market-float-center;animation-delay:-2.4s}.market-blibli{right:0;bottom:5%;animation-delay:-3.2s}.integration-line{position:absolute;z-index:1;left:50%;top:50%;height:2px;width:145px;transform-origin:left;background:repeating-linear-gradient(90deg,#fff 0 7px,transparent 7px 13px);opacity:.9}.integration-line:after{content:'';position:absolute;width:8px;height:8px;border-radius:50%;top:-3px;left:0;background:#fa523e;box-shadow:0 0 0 4px rgba(250,82,62,.18);animation:data-travel 2.4s linear infinite}.line-shopee{transform:rotate(-151deg)}.line-tokopedia{transform:rotate(-29deg)}.line-tiktok{transform:rotate(151deg)}.line-lazada{width:92px;transform:rotate(90deg)}.line-blibli{transform:rotate(29deg)}.line-tokopedia:after{animation-delay:-.5s}.line-tiktok:after{animation-delay:-1s}.line-lazada:after{animation-delay:-1.5s}.line-blibli:after{animation-delay:-2s}@keyframes data-travel{from{left:100%}to{left:0}}@keyframes market-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}@keyframes market-float-center{0%,100%{transform:translate(-50%,0)}50%{transform:translate(-50%,-5px)}}
@media(max-width:700px){.integration-map{width:94%;transform:scale(.92)}.market-node{width:92px}.integration-hub{width:126px}.integration-line{width:125px}}
@media(prefers-reduced-motion:reduce){.market-node,.integration-line:after{animation:none!important}}

/* Challenge cards: animated visual metaphors for each business pain point. */
.pain-card{min-height:360px;overflow:hidden;transition:transform .35s ease,box-shadow .35s ease}.pain-card:hover{transform:translateY(-5px);box-shadow:8px 8px 0 rgba(25,28,32,.10)}.pain-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;min-height:155px}.pain-art{width:210px;height:142px;position:relative;flex:0 1 210px;color:#191c20}.manual-sheet{position:absolute;right:20px;top:4px;width:118px;height:126px;background:#fff8ed;border:2px solid currentColor;padding:24px 16px 12px;box-shadow:7px 7px 0 #fee166;transform:rotate(2deg)}.manual-sheet:before{content:'';position:absolute;left:15px;top:13px;width:36px;border-top:5px solid #fa523e}.manual-sheet i{display:block;height:8px;margin-bottom:10px;border-bottom:2px solid rgba(25,28,32,.26);position:relative}.manual-sheet i:before{content:'';position:absolute;left:0;top:-2px;width:7px;height:7px;border:1px solid #191c20}.manual-sheet i:after{content:'';position:absolute;left:15px;right:0;top:2px;border-top:2px solid rgba(25,28,32,.55)}.manual-cursor{position:absolute;right:10px;top:60px;width:18px;height:26px;background:#fa523e;clip-path:polygon(0 0,100% 70%,60% 72%,78% 100%,62% 100%,45% 75%,17% 100%);animation:manual-work 3.2s ease-in-out infinite}.manual-clock{position:absolute;left:23px;bottom:2px;width:50px;height:50px;border:2px solid #191c20;border-radius:50%;display:grid;place-items:center;background:#68bda4;font-size:10px;font-weight:900;box-shadow:4px 4px 0 #191c20}.manual-clock:before,.manual-clock:after{content:'';position:absolute;left:23px;top:10px;width:2px;height:14px;background:#191c20;transform-origin:bottom}.manual-clock:after{transform:rotate(105deg);height:11px;top:13px}.pain-art-disconnected .system-node{position:absolute;padding:9px 11px;border:2px solid #191c20;background:#fff8ed;font-size:9px;font-weight:900;z-index:2;box-shadow:4px 4px 0 #fee166}.node-sales{left:3px;top:10px}.node-stock{right:3px;top:48px}.node-finance{left:35px;bottom:5px}.broken-link{position:absolute;width:74px;border-top:2px dashed #fa523e;transform-origin:left;animation:broken-signal 2.4s ease-in-out infinite}.link-one{left:61px;top:31px;transform:rotate(20deg)}.link-two{left:87px;top:95px;transform:rotate(-25deg);animation-delay:.8s}.broken-link:after{content:'×';position:absolute;left:34px;top:-11px;background:#fffdf7;color:#fa523e;font-style:normal;font-weight:900;padding:0 3px}.software-window{position:absolute;left:4px;top:10px;width:142px;height:112px;border:2px solid #191c20;background:#fff8ed;box-shadow:6px 6px 0 #d1e8dd;padding:35px 13px 10px}.software-window:before{content:'';position:absolute;inset:0 0 auto;height:23px;border-bottom:2px solid #191c20;background:#fee166}.software-window>i{position:relative;z-index:1;display:inline-block;width:6px;height:6px;border-radius:50%;background:#191c20;top:-29px;margin-right:3px}.software-window>span{display:block;height:55px;border:2px solid rgba(25,28,32,.25);background:repeating-linear-gradient(135deg,transparent 0 9px,rgba(25,28,32,.06) 9px 18px)}.needed-piece{position:absolute;right:5px;top:44px;width:54px;height:54px;background:#fa523e;border:2px solid #191c20;animation:piece-fit 3s ease-in-out infinite}.needed-piece:before{content:'';position:absolute;left:-13px;top:17px;width:20px;height:20px;border-radius:50%;background:#fa523e;border:2px solid #191c20;border-right:0}.needed-piece i{position:absolute;right:-7px;top:17px;width:16px;height:20px;border-radius:50%;background:#f6e9d9;border-left:2px solid #191c20}
@keyframes manual-work{0%,100%{transform:translate(-2px,-12px)}45%{transform:translate(-58px,20px)}65%{transform:translate(-58px,20px) scale(.78)}}@keyframes broken-signal{0%,100%{opacity:.25}45%{opacity:1}60%{opacity:.25}}@keyframes piece-fit{0%,100%{transform:translateX(0) rotate(0)}48%{transform:translateX(-24px) rotate(-7deg)}64%{transform:translateX(-20px) rotate(-4deg)}}
@media(max-width:1000px){.pain-art{width:150px;flex-basis:150px;transform:scale(.84);transform-origin:top right}.pain-head{min-height:135px}}
@media(max-width:700px){.pain-card{min-height:310px}.pain-head{min-height:145px}.pain-art{width:190px;flex-basis:190px;transform:scale(.9)}}
@media(prefers-reduced-motion:reduce){.manual-cursor,.broken-link,.needed-piece{animation:none!important}}

/* Hero motion: adaptable application features become measurable business outcomes. */
.business-motion{width:min(100%,360px);height:172px;margin:0 0 24px;position:relative;color:#191c20}.motion-app{position:absolute;left:0;top:0;width:190px;height:112px;padding:12px;background:#fffdf7;border:2px solid #191c20;box-shadow:7px 7px 0 #fee166;overflow:hidden}.motion-bar{display:flex;align-items:center;gap:4px;padding-bottom:9px;border-bottom:1px solid rgba(25,28,32,.18)}.motion-bar i{width:5px;height:5px;border-radius:50%;background:#fa523e}.motion-bar b{margin-left:auto;font-size:7px;letter-spacing:.12em}.motion-feature{position:relative;height:48px;margin-top:12px}.motion-feature span{position:absolute;inset:0;display:flex;align-items:center;padding:0 13px;background:#f6e9d9;border-left:5px solid #fa523e;font-size:13px;font-weight:900;opacity:0;animation:feature-swap 6s infinite}.motion-feature span:nth-child(2){animation-delay:2s}.motion-feature span:nth-child(3){animation-delay:4s}.motion-cursor{position:absolute;z-index:4;left:143px;top:72px;font-size:27px;line-height:1;color:#fa523e;text-shadow:1px 1px 0 #fff;animation:feature-click 2s ease-in-out infinite}.motion-flow{position:absolute;left:190px;top:55px;width:45px;border-top:2px dashed #fa523e}.motion-flow:after{content:'';position:absolute;right:-1px;top:-5px;width:8px;height:8px;border-top:2px solid #fa523e;border-right:2px solid #fa523e;transform:rotate(45deg)}.motion-results{position:absolute;right:0;top:8px;width:116px;display:grid;gap:8px}.motion-results span{padding:9px 10px;background:#191c20;color:#fff;font-size:9px;font-weight:900;letter-spacing:.04em;transform:translateX(-8px);opacity:.3;animation:result-pop 6s infinite}.motion-results span:nth-child(2){background:#fa523e;animation-delay:2s}.motion-results span:nth-child(3){background:#68bda4;animation-delay:4s}.business-motion:after{content:'FITUR BERUBAH · HASIL BERTUMBUH';position:absolute;left:0;bottom:0;font-size:8px;font-weight:900;letter-spacing:.15em}.business-motion:hover .motion-app{box-shadow:11px 11px 0 #fee166}@keyframes feature-swap{0%,30%{opacity:1;transform:translateY(0)}33%,97%{opacity:0;transform:translateY(8px)}98%,100%{opacity:1}}@keyframes feature-click{0%,100%{transform:translate(12px,12px) scale(1)}45%{transform:translate(0,0) scale(1)}55%{transform:translate(0,0) scale(.78)}}@keyframes result-pop{0%,30%{opacity:1;transform:translateX(0)}33%,97%{opacity:.3;transform:translateX(-8px)}98%,100%{opacity:1;transform:translateX(0)}}
@media(max-width:700px){.rotating-ring{display:none}.business-motion{display:block;width:320px;max-width:100%;height:160px}.motion-app{width:174px}.motion-flow{left:174px;width:36px}.motion-results{width:108px}}
@media(prefers-reduced-motion:reduce){.motion-feature span,.motion-results span,.motion-cursor{animation:none!important}.motion-feature span:not(:first-child){display:none}.motion-results span{opacity:1;transform:none}}
.logo{display:inline-flex;align-items:center;flex:none}.logo img{display:block;width:154px;height:auto}.footer .logo img{width:154px}@media(max-width:700px){.logo img{width:139px}}