:root{--blue:#0867ff;--navy:#071747;--muted:#526584;--line:#dce7f5;--pale:#eef8ff;--purple:#713bee;--radius:18px}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:95px}body{margin:0;color:var(--navy);font-family:'Be Vietnam Pro',Arial,sans-serif;font-size:14px;line-height:1.7;background:#fff}a{color:inherit;text-decoration:none}button{font:inherit}img{display:block;max-width:100%;height:auto}figure,p,h1,h2,h3,ul,ol{margin:0}h1,h2,h3{line-height:1.25;letter-spacing:-.04em}h1{font-size:clamp(38px,3.7vw,59px);font-weight:800}h2{font-size:clamp(29px,2.7vw,42px);font-weight:800}h3{font-size:17px;font-weight:700;letter-spacing:-.025em}p{color:var(--muted)}ul,ol{padding:0;list-style:none}.container{width:min(1240px,calc(100% - 64px));margin-inline:auto}.section{padding:76px 0}section[id]{scroll-margin-top:15px}.blue{background:linear-gradient(115deg,#f1faff,#e2f3ff)}.eyebrow{font-size:12px;font-weight:700;letter-spacing:.065em;color:var(--blue);text-transform:uppercase;margin-bottom:14px}.pill{display:inline-block;padding:7px 14px;border-radius:30px;background:#e5efff}.intro{font-size:15px;line-height:1.85;margin-top:20px;max-width:560px}.lead{font-size:17px;max-width:510px;margin:24px 0}.actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.btn{min-height:48px;display:inline-flex;gap:14px;align-items:center;justify-content:center;padding:12px 21px;border:1px solid transparent;border-radius:9px;font-weight:600;font-size:14px;line-height:1.4;transition:background .2s,box-shadow .2s}.btn span{font-size:22px;font-weight:400;line-height:1}.primary{background:var(--blue);color:white;box-shadow:0 5px 15px #0867ff1a}.primary:hover{background:#0456db}.outline{color:var(--blue);border-color:#94baff;background:white}.outline:hover{background:#eef5ff}.small{min-height:39px;font-size:12px;padding:10px 15px}.white{background:#fff;color:var(--blue)}.white:hover{background:#eaf3ff}a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid #7c4aff;outline-offset:5px}.skip{position:fixed;top:-100px;left:20px;background:white;color:var(--blue);z-index:99;padding:10px 20px}.skip:focus{top:10px}.header{position:sticky;top:0;z-index:30;border-bottom:1px solid #e9eff7;background:#fffffff5;backdrop-filter:blur(12px)}.header-inner{height:82px;display:flex;align-items:center;gap:42px}.brand{display:inline-flex;flex-shrink:0}.brand img{width:170px;height:auto}.header nav{display:flex;gap:24px;align-items:center;flex:1;font-size:12px;font-weight:600}.header nav>a:hover{color:var(--blue)}.nav-actions{display:flex;gap:10px;margin-left:auto}.menu-toggle{display:none}.hero{position:relative;overflow:hidden;background:#eff8fe url('assets/backgrounds/01-warehouse.webp') center/cover no-repeat}.hero:before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#ffffffef 0,#ffffffe6 27%,#ffffff66 52%,#ffffff00 73%)}.hero-grid{position:relative;display:grid;grid-template-columns:48% 52%;min-height:650px;align-items:center}.hero-copy{position:relative;z-index:3;padding:60px 0 68px}.hero h1 span{color:var(--blue)}.hero-checks{display:flex;flex-wrap:wrap;gap:12px 20px;font-size:11px;margin-top:26px}.hero-checks li{display:flex;gap:7px;align-items:center}.hero-checks li:before{content:'✓';background:#00b37d;color:#fff;display:grid;place-items:center;width:19px;height:19px;border-radius:50%;font-weight:700;flex-shrink:0}.hero-art{position:relative;height:650px;width:112%;margin-left:-4%}.hero-people{position:absolute;top:8px;right:-2%;width:98%;height:66%;object-fit:contain;object-position:center top}.hero-monitor{position:absolute;bottom:28px;right:1%;width:91%;height:auto;z-index:2}.hero-phone{position:absolute;bottom:25px;right:-4%;width:18.5%;height:auto;z-index:3}.demo{font-size:10px;color:#6a7b94;font-style:normal;letter-spacing:0;line-height:1.5}.hero-demo{position:absolute;bottom:9px;right:18%;z-index:4}.workflow{padding:24px 0;background:white}.workflow-inner{display:flex;gap:30px;align-items:center;padding:24px;border:1px solid var(--line);border-radius:var(--radius)}.workflow h2{font-size:20px;flex:0 0 240px;letter-spacing:-.03em}.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;flex:1}.steps li{text-align:center;position:relative;display:flex;align-items:center;flex-direction:column}.steps li:not(:last-child):after{content:'→';position:absolute;right:-20px;top:20px;color:var(--blue);font-size:23px}.icon{width:52px;height:52px;flex:0 0 52px;object-fit:contain}.steps .icon{width:43px;height:43px}.steps strong{font-size:12px;margin-top:8px}.steps span{font-size:10px;color:var(--muted);margin-top:3px}.module{padding:80px 0}.split{display:grid;grid-template-columns:.94fr 1.06fr;gap:42px;align-items:center}.reverse{grid-template-columns:1.08fr .92fr}.features{display:grid;grid-template-columns:1fr 1fr;gap:25px 16px;margin-top:30px}.features li{display:flex;align-items:flex-start;gap:11px}.features h3{font-size:14px;line-height:1.55;letter-spacing:-.025em;margin-bottom:4px}.features p{font-size:12px;line-height:1.8}.features .icon{width:40px;height:40px;flex-basis:40px}.one-col{grid-template-columns:1fr;gap:18px}.callout{display:flex;gap:12px;align-items:center;border:1px solid #d3e8fa;background:#ffffff9c;padding:17px;border-radius:12px;margin-top:30px;font-size:13px;font-weight:600;color:#1359ce}.callout .icon{width:36px;height:36px;flex-basis:36px}.screen-figure{width:100%;min-width:0}.screen-figure>img{width:100%;height:auto}.screen-figure>.demo{text-align:right;margin-top:5px;padding-right:12px}.tags{display:flex;gap:10px;justify-content:center;margin-top:18px;flex-wrap:wrap}.tags li{padding:6px 13px;background:#fff;border:1px solid #d9e9fa;border-radius:25px;color:#244572;font-size:11px;font-weight:600}.purchasing{background:#fff}.purchasing-person{margin-top:48px;background:#f3faff none center/cover;border:1px solid var(--line);border-radius:20px;display:grid;grid-template-columns:1fr 1fr;align-items:center;overflow:hidden;height:270px}.purchasing-person>div{padding:30px 44px;max-width:530px}.purchasing-person h3{font-size:25px;margin:8px 0 15px}.purchasing-person p{font-size:13px}.purchasing-person>img{height:320px;width:100%;object-fit:contain;align-self:start;object-position:center top}.section-heading{text-align:center;max-width:780px;margin:0 auto 34px}.cards{display:grid;gap:20px}.three{grid-template-columns:repeat(3,1fr)}.four{grid-template-columns:repeat(4,1fr)}.cards article{padding:27px;border:1px solid var(--line);border-radius:var(--radius);background:#fff;box-shadow:0 7px 25px #122d5f04}.cards .icon{margin-bottom:18px}.cards h3{margin-bottom:12px}.cards p{font-size:13px;line-height:1.9}.devices .split{grid-template-columns:.8fr 1.2fr}.devices .features{margin-top:24px}.device-figure{min-width:0}.device-row{position:relative;height:345px;display:flex;align-items:flex-end}.device-desktop{position:absolute;width:78%;height:auto;left:0;bottom:12px;z-index:1}.device-mobile{position:absolute;width:auto;height:64%;object-fit:contain;bottom:13px;z-index:2}.device-mobile.first{right:12%}.device-mobile.second{right:-2%}.device-figure .demo{text-align:center;margin-top:8px}.why .cards article{padding:23px}.why h3{font-size:15px}.faq{padding-top:10px}.faq-grid{display:grid;grid-template-columns:.65fr 1.35fr;gap:70px}.faq-grid>div>p:last-child{font-size:14px;margin-top:18px;max-width:320px}.faq-list{display:grid;gap:12px}.faq details{border:1px solid var(--line);border-radius:12px;background:#fff}.faq summary{cursor:pointer;padding:21px 52px 21px 23px;position:relative;list-style:none;font-weight:600;line-height:1.7}.faq summary::-webkit-details-marker{display:none}.faq summary:after{content:'+';position:absolute;right:22px;top:19px;font-size:21px;color:var(--blue);font-weight:400}.faq details[open] summary:after{content:'−'}.faq details[open]{background:#f7fbff}.faq details p{padding:0 23px 23px;font-size:13px;line-height:1.9}.cta-banner{background:#0867ff url('assets/backgrounds/03-cta-blue.svg') center/cover;color:white;overflow:hidden}.cta-inner{min-height:310px;display:flex;position:relative;align-items:center}.cta-inner>div{position:relative;z-index:2;width:65%;padding:40px 0}.cta-inner h2{font-size:36px}.cta-inner p{color:#e3f0ff;margin:15px 0 22px;max-width:550px}.cta-inner>img{position:absolute;right:15px;bottom:-10px;width:36%;height:112%;object-fit:contain;object-position:center bottom}.cta-phone{font-size:16px;color:white;font-weight:600;padding:9px}.footer{padding:52px 0 0}.footer-grid{display:grid;grid-template-columns:1.05fr .65fr .65fr 1.45fr;gap:40px}.footer h3{font-size:15px;margin-bottom:18px}.footer p,.footer a,.footer address,.footer strong{font-size:13px;line-height:1.9}.footer-grid>div:first-child p{margin-top:16px;max-width:220px}.footer-grid>div>a:not(.brand){display:block;margin-bottom:8px;color:#5e7396}.footer-grid>div>a:hover{color:var(--blue)}.footer strong{display:block;margin-bottom:11px}.footer address{font-style:normal;color:#5e7396;margin-bottom:10px}.footer-bottom{border-top:1px solid var(--line);margin-top:35px;padding:20px 0;display:flex;justify-content:space-between;gap:20px;color:#6a7b94;font-size:11px}
@media(min-width:1600px){.hero-grid{min-height:680px}.hero-art{height:680px}}
@media(max-width:1150px){.container{width:calc(100% - 44px)}.header-inner{gap:24px}.header nav{gap:16px;font-size:11px}.nav-actions{gap:6px}.nav-actions .btn{padding:10px;font-size:11px}.brand img{width:145px}.hero-grid{grid-template-columns:49% 51%;min-height:600px}.hero-art{height:570px}.hero h1{font-size:43px}.hero .lead{font-size:15px}.hero .btn{padding:12px 16px;font-size:12px}.hero-checks{font-size:10px;gap:10px}.split{gap:25px}.features{grid-template-columns:1fr;gap:17px}.workflow h2{flex-basis:210px;font-size:18px}.workflow-inner{gap:20px}.steps{gap:16px}.steps strong{font-size:11px}.cards article{padding:22px}.four{gap:14px}.four h3{font-size:14px}.device-row{height:300px}.footer-grid{gap:25px}}
@media(max-width:900px){.header-inner{height:72px;justify-content:space-between}.brand img{width:155px}.menu-toggle{display:flex;flex-direction:column;gap:5px;align-items:center;justify-content:center;width:44px;height:44px;border:1px solid var(--line);border-radius:9px;background:white;cursor:pointer}.menu-toggle span{display:block;width:20px;height:2px;background:var(--navy)}.header nav{display:none;position:absolute;top:71px;left:0;width:100%;padding:20px 24px 25px;background:white;border-bottom:1px solid var(--line);box-shadow:0 10px 20px #15315c14}.header nav.is-open{display:flex;flex-direction:column;align-items:stretch;gap:0}.header nav>a{padding:11px;font-size:14px}.nav-actions{margin:14px 0 0;display:flex}.nav-actions .btn{font-size:13px;flex:1}.hero-grid{min-height:550px}.hero-art{height:530px;width:117%;margin-left:-8%}.hero-copy{padding:50px 0}.hero h1{font-size:35px}.hero .lead{font-size:14px}.hero .actions{gap:9px}.hero .btn{font-size:11px;padding:12px}.hero-checks{gap:8px}.workflow-inner{flex-direction:column;align-items:stretch}.workflow h2{flex:initial;font-size:22px;text-align:center}.workflow h2 br{display:none}.steps{width:100%}.steps strong{font-size:12px}.split,.reverse,.devices .split{grid-template-columns:1fr;gap:30px}.module-copy{max-width:none}.features{grid-template-columns:1fr 1fr}.screen-figure{max-width:750px;margin-inline:auto}.reverse .screen-figure{order:2}.reverse .module-copy{order:1}.purchasing-person{height:275px}.purchasing-person>div{padding:25px}.purchasing-person h3{font-size:22px}.section,.module{padding:55px 0}.four{grid-template-columns:1fr 1fr}.three{gap:14px}.cards article{padding:20px}.cards h3{font-size:15px}.cards p{font-size:12px}.device-row{height:auto;aspect-ratio:1.8;max-width:720px;margin:auto}.device-mobile{height:62%}.faq-grid{grid-template-columns:1fr;gap:25px}.faq-grid h2 br{display:none}.faq-grid>div>p:last-child{max-width:none}.cta-inner h2{font-size:31px}.cta-inner>img{right:-25px;width:42%;height:100%}.cta-inner>div{width:65%}.cta-inner p{font-size:13px}.footer-grid{grid-template-columns:1fr 1fr;gap:30px 45px}}
@media(max-width:640px){.container{width:calc(100% - 36px)}body{font-size:14px}.hero:before{background:linear-gradient(180deg,#ffffffee 0,#ffffffee 43%,#ffffff55 80%)}.hero-grid{grid-template-columns:1fr}.hero-copy{padding:36px 0 18px}.hero h1{font-size:clamp(33px,8.5vw,47px)}.hero .lead{font-size:15px;margin:19px 0 23px}.eyebrow{font-size:10px}.pill{padding:7px 11px}.hero .btn{font-size:12px;min-height:47px;padding:12px 17px}.hero-checks{font-size:10px;gap:10px 13px;margin-top:20px}.hero-checks li:before{width:16px;height:16px;font-size:10px}.hero-art{height:auto;aspect-ratio:1.1;width:100%;margin:0}.hero-people{width:90%;height:70%;right:1%}.hero-monitor{width:92%;right:4%;bottom:23px}.hero-phone{width:18%;right:0;bottom:20px}.hero-demo{bottom:4px;font-size:8px}.workflow{padding:18px 0}.workflow-inner{padding:19px 13px;gap:20px}.workflow h2{font-size:18px}.steps{grid-template-columns:1fr 1fr;gap:22px 24px}.steps li:not(:last-child):after{display:none}.steps li:nth-child(odd):after{display:block;right:-17px}.steps strong{font-size:11px}.steps span{font-size:9px}.steps .icon{width:40px;height:40px}.module,.section{padding:43px 0}h2{font-size:30px}.intro{font-size:14px;margin-top:16px}.features{grid-template-columns:1fr;gap:19px;margin-top:23px}.features h3{font-size:14px}.features p{font-size:12px}.features .icon{width:43px;height:43px;flex-basis:43px}.callout{margin-top:24px;font-size:12px;padding:14px}.split{gap:25px}.tags{gap:6px;margin-top:11px}.tags li{font-size:10px;padding:5px 10px}.demo{font-size:8px}.purchasing-person{height:auto;grid-template-columns:1fr;margin-top:32px}.purchasing-person>div{padding:24px 24px 0}.purchasing-person h3{font-size:24px}.purchasing-person>img{height:260px;width:auto;max-width:100%;justify-self:center;align-self:end;margin-top:15px}.three,.four{grid-template-columns:1fr}.cards article{display:grid;grid-template-columns:52px 1fr;column-gap:17px;padding:21px}.cards article .icon{grid-row:1/3;width:48px;height:48px;margin:0}.cards article h3{margin-bottom:7px;font-size:15px}.cards article p{font-size:12px}.section-heading{text-align:left;margin-bottom:25px}.section-heading h2 br{display:none}.why .cards article{padding:21px}.why .cards h3{font-size:15px}.devices .features{gap:16px}.device-row{aspect-ratio:1.65}.device-desktop{width:78%;bottom:10px}.device-mobile{height:60%;bottom:10px}.device-mobile.second{right:0}.device-mobile.first{right:14%}.faq summary{padding:18px 42px 18px 17px;font-size:13px}.faq details p{padding:0 17px 18px;font-size:12px}.faq summary:after{right:16px;top:16px}.cta-inner{min-height:480px;align-items:flex-start}.cta-inner>div{width:100%;padding:32px 0;z-index:2}.cta-inner h2{font-size:29px}.cta-inner p{max-width:340px;margin:13px 0 19px}.cta-inner .actions{gap:9px}.cta-inner .btn{padding:11px 16px;font-size:12px}.cta-phone{font-size:14px}.cta-inner>img{width:64%;height:245px;right:-14px;bottom:-5px;object-position:right bottom}.footer{padding-top:36px}.footer-grid{grid-template-columns:1fr 1fr;gap:29px 20px}.footer-grid>div:first-child,.footer-grid .contact{grid-column:1/-1}.footer-grid>div:first-child p{max-width:320px}.footer h3{font-size:14px;margin-bottom:13px}.footer p,.footer a,.footer address,.footer strong{font-size:12px}.footer-bottom{flex-direction:column;gap:5px;font-size:10px;margin-top:25px;padding:17px 0}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important}}

/* Warehouse-specific composition. SVG icon colors can be overridden below. */
.hero h1{font-size:clamp(35px,3.1vw,48px)}.hero-grid{grid-template-columns:49% 51%;min-height:630px}.hero-art{height:630px}.hero-people{height:68%;width:100%;top:5px;right:0}.hero-monitor{width:94%;right:0;bottom:25px}.hero-phone{width:17.5%;right:-5%;bottom:23px}.hero-demo{right:12%;bottom:7px}.hero-copy{padding:50px 0}.hero-checks{font-size:12px}.icon{display:block}.features.one-col{grid-template-columns:1fr}.module .features{margin-top:26px;gap:23px}.module .features h3{font-size:15px}.module .features p{font-size:13px}.module .features .icon{width:46px;height:46px;flex-basis:46px}.module .split{grid-template-columns:.77fr 1.23fr;gap:48px}.module .split.reverse{grid-template-columns:1.23fr .77fr}.pain{padding:35px 0}.pain h2{font-size:27px;margin-bottom:22px}.compact article{display:flex;gap:16px;padding:21px;align-items:flex-start}.compact .icon{margin:0;width:47px;height:47px;flex-basis:47px}.compact h3{font-size:15px;margin-bottom:7px}.compact p{font-size:12px;line-height:1.85}.overview{padding:43px 0}.overview .section-heading{margin-bottom:25px}.overview-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:17px}.overview-grid li{display:flex;gap:17px;align-items:center;background:#fff;border:1px solid #e2eefb;border-radius:15px;padding:23px}.overview-grid .icon{width:55px;height:55px;flex-basis:55px}.overview-grid h3{font-size:15px;margin-bottom:6px}.overview-grid p{font-size:12px;line-height:1.8}.mobile-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:38px;align-items:center}.mobile-grid .features{gap:20px;margin-top:26px}.mobile-grid .features .icon{width:43px;height:43px;flex-basis:43px}.mobile-art{display:grid;grid-template-columns:.85fr 1.15fr;gap:8px;align-items:end;min-width:0}.scanner-person{height:340px;display:flex;align-items:flex-end;background:url('assets/backgrounds/01-warehouse.webp') 75% center/cover;border-radius:18px;overflow:hidden}.scanner-person>img{width:100%;height:100%;object-fit:cover;object-position:40% bottom}.mobile-pair{display:grid;grid-template-columns:1fr 1fr;gap:6px;align-items:end;min-width:0}.mobile-pair img{width:100%;height:390px;object-fit:contain;object-position:center bottom}.report-grid{display:grid;grid-template-columns:1.5fr .65fr;align-items:center;gap:38px;border-radius:20px;background:#f1f9ff;padding:25px}.report-grid .features{margin:0;gap:25px}.report-grid .features .icon{width:43px;height:43px;flex-basis:43px}.report-grid .features h3{font-size:15px}.report-grid .features p{font-size:12px}.ecosystem{padding-top:30px}.ecosystem .section-heading p{margin-top:15px}.ecosystem-grid{display:grid;grid-template-columns:1fr 220px 1fr;gap:45px;align-items:center;max-width:1080px;margin:40px auto 0}.eco-side{display:grid;gap:22px}.eco-side article{position:relative;display:flex;gap:14px;align-items:center;border:1px solid #deebfa;border-radius:16px;padding:19px;background:#fff;box-shadow:0 7px 25px #0867ff06}.eco-side article:after{content:'↔';position:absolute;right:-37px;top:22px;font-size:26px;color:#84b6ff}.eco-side.right article:after{left:-37px;right:auto}.eco-side .icon{width:47px;height:47px;flex-basis:47px}.eco-side h3{font-size:15px;margin-bottom:5px}.eco-side p{font-size:11px}.eco-core{border-radius:50%;aspect-ratio:1;background:#e0f2ff;outline:1px solid #cce8ff;outline-offset:9px;display:flex;align-items:center;justify-content:center;flex-direction:column;color:#0643b4}.eco-core .icon{width:74px;height:74px;margin-bottom:6px}.eco-core strong{font-size:24px;line-height:1.3;letter-spacing:.01em}.eco-core span{font-size:13px;font-weight:700}.why{padding-top:30px}.why .icon--04-cong-no-thanh-toan .tone-start{stop-color:#1aa8ff}.why .icon--04-cong-no-thanh-toan .tone-end{stop-color:#0867ff}.roles{padding:48px 0}.role-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.role-grid article{display:grid;grid-template-columns:43% 57%;border:1px solid #e0ebf8;border-radius:17px;background:#fff;overflow:hidden}.role-grid article>img{width:100%;height:100%;object-fit:cover;min-height:200px}.role-grid article>div{padding:22px 17px}.role-grid .icon{width:42px;height:42px;margin-bottom:12px}.role-grid h3{font-size:15px;margin-bottom:7px}.role-grid p{font-size:12px;line-height:1.85}.role-note{margin-top:14px;text-align:right}.cta-inner{min-height:330px}.cta-inner>img{height:112%;width:37%;bottom:-7px}.cta-inner h2{font-size:35px}.faq{padding-top:65px}.section-heading h2{line-height:1.3}
@media(max-width:1150px){.hero h1{font-size:37px}.hero-art{height:570px}.hero-grid{min-height:570px}.hero-checks{font-size:11px}.module .split,.module .split.reverse{gap:30px;grid-template-columns:.9fr 1.1fr}.module .split.reverse{grid-template-columns:1.1fr .9fr}.module h2{font-size:33px}.overview-grid li{padding:18px;gap:12px}.overview-grid .icon{width:48px;height:48px;flex-basis:48px}.mobile-grid{gap:24px}.mobile-pair img{height:340px}.scanner-person{height:290px}.ecosystem-grid{grid-template-columns:1fr 180px 1fr;gap:32px}.eco-side article{padding:15px;gap:10px}.eco-side article:after{right:-28px;font-size:21px}.eco-side.right article:after{left:-28px}.role-grid{gap:13px}.role-grid article{grid-template-columns:40% 60%}.role-grid article>div{padding:18px 13px}.role-grid article>img{min-height:215px}.report-grid{grid-template-columns:1.45fr .75fr;gap:25px;padding:20px}}
@media(max-width:900px){.hero h1{font-size:33px}.hero-grid{grid-template-columns:49% 51%}.hero-art{height:535px}.hero-people{height:69%}.hero-monitor{width:98%}.hero-checks{font-size:10px}.module .split,.module .split.reverse{grid-template-columns:1fr;gap:30px}.module h2{font-size:36px}.module .module-copy{max-width:650px}.module .features.one-col{grid-template-columns:1fr 1fr;gap:22px}.module .split.reverse .screen-figure{order:2}.module .split.reverse .module-copy{order:1}.overview-grid{grid-template-columns:1fr 1fr}.compact article{display:block}.compact .icon{margin-bottom:13px}.mobile-grid{grid-template-columns:1fr;gap:30px}.mobile-grid .features.one-col{grid-template-columns:repeat(3,1fr);gap:20px}.mobile-grid .features li{flex-direction:column}.mobile-art{max-width:720px;margin:auto;width:100%;grid-template-columns:.9fr 1.1fr;gap:16px}.scanner-person{height:360px}.mobile-pair img{height:400px}.report-grid{grid-template-columns:1fr;padding:22px}.report-grid .features.one-col{grid-template-columns:repeat(3,1fr);gap:20px}.report-grid .features li{flex-direction:column}.ecosystem-grid{grid-template-columns:1fr 145px 1fr;gap:27px}.eco-side article{flex-direction:column;align-items:flex-start}.eco-side article:after{right:-23px;top:50px}.eco-side.right article:after{left:-23px}.eco-side h3{font-size:14px}.eco-core strong{font-size:20px}.eco-core .icon{width:60px;height:60px}.role-grid{grid-template-columns:1fr}.role-grid article{grid-template-columns:155px 1fr}.role-grid article>img{min-height:170px;height:170px}.role-grid article>div{padding:19px 24px}.role-grid article .icon{margin-bottom:9px;width:37px;height:37px}.role-grid p{font-size:13px}.cta-inner h2{font-size:31px}.cta-inner>img{width:41%;height:103%;right:-10px}}
@media(max-width:640px){.hero-grid{grid-template-columns:1fr}.hero h1{font-size:clamp(29px,7.6vw,43px);letter-spacing:-.045em}.hero-copy{padding:34px 0 10px}.hero-art{height:auto;aspect-ratio:1.1;width:100%;margin:0}.hero-people{height:69%;width:96%;right:0}.hero-monitor{width:96%;right:2%;bottom:22px}.hero-phone{width:17%;right:-1%;bottom:20px}.hero-checks{font-size:11px}.hero-demo{bottom:3px;right:12%;font-size:8px}.pain{padding:30px 0}.pain h2{font-size:24px}.compact article{display:flex;gap:15px;padding:20px}.compact .icon{margin:0}.compact h3{font-size:14px}.compact p{font-size:12px}.overview{padding:35px 0}.overview-grid{grid-template-columns:1fr;gap:12px}.overview-grid li{padding:18px;gap:16px}.overview-grid .icon{width:51px;height:51px;flex-basis:51px}.overview-grid h3{font-size:15px}.module h2{font-size:30px}.module .features.one-col{grid-template-columns:1fr;gap:20px}.module .features h3{font-size:14px}.module .features p{font-size:12px}.module .split,.module .split.reverse{gap:25px}.module .features .icon{width:42px;height:42px;flex-basis:42px}.mobile-grid .features.one-col{grid-template-columns:1fr}.mobile-grid .features li{flex-direction:row}.mobile-art{gap:8px;grid-template-columns:.8fr 1.2fr}.scanner-person{height:auto;aspect-ratio:.6;border-radius:12px}.scanner-person>img{min-height:230px}.mobile-pair img{height:auto;max-height:none;aspect-ratio:.5;object-fit:contain;object-position:center bottom}.mobile-pair{gap:5px}.report-grid{padding:13px;gap:22px}.report-grid .features.one-col{grid-template-columns:1fr;padding:0 10px 10px}.report-grid .features li{flex-direction:row}.ecosystem{padding-top:35px}.ecosystem-grid{grid-template-columns:1fr 1fr;gap:22px 14px;margin-top:27px}.eco-core{grid-row:1;grid-column:1/-1;width:150px;justify-self:center;margin-bottom:8px}.eco-side{gap:14px}.eco-side article{min-height:155px;padding:14px;gap:9px}.eco-side article:after,.eco-side.right article:after{display:none}.eco-side h3{font-size:13px}.eco-side p{font-size:11px}.eco-side .icon{width:40px;height:40px;flex-basis:40px}.eco-core .icon{width:55px;height:55px;margin-bottom:3px}.eco-core strong{font-size:20px}.eco-core span{font-size:11px}.why{padding-top:20px}.role-grid article{grid-template-columns:38% 62%}.role-grid article>img{min-height:192px;height:100%}.role-grid article>div{padding:20px 17px}.role-grid h3{font-size:14px}.role-grid p{font-size:12px}.role-note{font-size:8px}.faq{padding-top:40px}.cta-inner{min-height:470px}.cta-inner h2{font-size:29px}.cta-inner>img{height:240px;width:63%;right:-10px;bottom:-7px}}

/* ===== Hero theo ảnh demo (01/11): hai người dịch trái, màn hình chỉ che phần dưới ===== */
@media(min-width:901px){
.hero-people{top:auto;bottom:0;right:auto;left:-20%;width:104%;height:auto;object-fit:contain;object-position:left bottom;z-index:1}
.hero-monitor{right:5%;width:60%;bottom:20px}
.hero-phone{right:-1%;bottom:18px;width:13.5%}
}

/* ===== Banner cuối: đầu người nhô lên khỏi mép trên ===== */
@media(min-width:641px){
.cta-banner{overflow:visible;clip-path:inset(-200px 0 0 0);position:relative;z-index:1}
.cta-inner>img{height:136%;width:46%;right:0;bottom:-10px;object-position:right bottom}
.faq{padding-bottom:120px}
}

/* ===== Chân trang theo trang DMS ===== */
.footer-grid{grid-template-columns:1fr 1.3fr .9fr 1.8fr}
.eco-links{display:grid;grid-template-columns:repeat(2,max-content);grid-auto-flow:column;grid-template-rows:repeat(5,auto);column-gap:40px;row-gap:8px}
.eco-links a{display:block;color:#5e7396;font-size:13px;line-height:1.9;white-space:nowrap}
.eco-links a:before{content:"- "}
.eco-links a:hover{color:var(--blue)}
.contact p{display:flex;align-items:flex-start;gap:10px;margin:0 0 12px;color:#5e7396}
.contact p>svg{width:18px;height:18px;color:var(--blue);flex-shrink:0;margin-top:4px;transition:scale .3s cubic-bezier(.2,.75,.25,1)}
.contact p:hover>svg{scale:1.18}
.contact strong{display:inline;margin:0;color:var(--navy)}
.footer-bottom,.footer-bottom a{font-size:13px}
.footer-bottom>a{color:var(--blue);font-weight:600}
@media(max-width:1100px){.footer-grid{grid-template-columns:1fr 1fr 1fr}.footer-grid .contact{grid-column:2/4}.eco-links{column-gap:26px}}
@media(max-width:640px){.footer-grid{grid-template-columns:1fr 1fr}.footer-grid>div:first-child,.footer-grid .footer-eco,.footer-grid .contact{grid-column:1/-1}.eco-links{column-gap:48px}.footer-bottom{flex-direction:column;gap:8px}}

/* ===== Hiệu ứng: rê chuột + bay vào khi cuộn ===== */
:root{--ease:cubic-bezier(.2,.75,.25,1)}
.cards article:hover,.role-grid article:hover,.ecosystem-grid article:hover,.faq-list details:hover{translate:0 -6px;border-color:#cfe0ff;box-shadow:0 14px 32px #0867ff1f}
.icon{transition:scale .45s var(--ease),rotate .45s var(--ease),filter .45s}
article:hover .icon,.features li:hover .icon,.overview-grid li:hover .icon{scale:1.14;rotate:-6deg;filter:drop-shadow(0 8px 12px #0867ff33)}
article h3,.features h3,.overview-grid h3{transition:color .25s}
article:hover h3,.features li:hover h3,.overview-grid li:hover h3{color:var(--blue)}
.features li,.overview-grid li{border-radius:14px;transition:translate .3s var(--ease),background .3s}
.features li:hover{translate:4px 0;background:#f2f7ff}
.overview-grid li:hover{translate:0 -4px}
.role-grid article>img{transition:scale .5s var(--ease)}.role-grid article:hover>img{scale:1.05}
.screen-figure>img,.device-figure img,.mobile-grid img{transition:translate .45s var(--ease),filter .45s}
.screen-figure:hover>img,.mobile-grid img:hover{translate:0 -6px;filter:drop-shadow(0 16px 22px #10376c26)}
.hero-monitor,.hero-phone{transition:translate .45s var(--ease)}
.hero-monitor:hover,.hero-phone:hover{translate:0 -8px}
.cta-inner>img{transform-origin:60% 100%;transition:scale .55s var(--ease),filter .55s}
.cta-banner:hover .cta-inner>img{scale:1.06;filter:drop-shadow(0 18px 26px #0b2a6b40)}
.footer-grid>div>a:not(.brand),.eco-links a{transition:color .2s,translate .25s var(--ease)}
.footer-grid>div>a:not(.brand):hover,.eco-links a:hover{translate:4px 0}
.header nav>a{position:relative}.header nav>a:after{content:'';position:absolute;left:0;right:0;bottom:-4px;height:2px;border-radius:2px;background:var(--blue);scale:0 1;transition:scale .3s var(--ease)}
.header nav>a:hover:after{scale:1 1}

main,.footer{overflow-x:clip}
.js .reveal{opacity:0;transform:translate3d(var(--rx,0),var(--ry,40px),0) scale(var(--rs,1));transition:opacity .75s var(--ease) var(--d,0s),transform .9s var(--ease) var(--d,0s),translate .35s var(--ease),scale .35s var(--ease),box-shadow .35s,border-color .35s,background .35s}
.js .reveal.in{opacity:1;transform:none}
.js .reveal.from-left{--rx:-70px;--ry:0}
.js .reveal.from-right{--rx:70px;--ry:0}
.js .reveal.zoom{--ry:24px;--rs:.92}

@keyframes rise{from{opacity:0;translate:0 28px}to{opacity:1;translate:0 0}}
@keyframes slide-in{from{opacity:0;translate:-50px 0}to{opacity:1;translate:0 0}}
.hero-copy>*{animation:rise .8s var(--ease) backwards}
.hero-copy>:nth-child(2){animation-delay:.1s}.hero-copy>:nth-child(3){animation-delay:.2s}.hero-copy>:nth-child(4){animation-delay:.3s}.hero-copy>:nth-child(5){animation-delay:.4s}
.hero-people{animation:slide-in 1s var(--ease) .15s backwards}
.hero-monitor{animation:rise 1s var(--ease) .45s backwards}
.hero-phone{animation:rise 1s var(--ease) .7s backwards}

@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.js .reveal{opacity:1;transform:none}}
@media(max-width:640px){.hero-monitor{width:78%;right:12%;bottom:12px}.hero-phone{width:20%;right:0;bottom:10px}}