:root{--bg:#020a14;--text:#f7f9fd;--muted:#aab7c8;--blue:#27bfff;--orange:#ff7a2f}*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at 75% 0,#163d68 0,transparent 28%),linear-gradient(#04101f,#020811);color:var(--text);font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}.top{height:82px;max-width:1440px;margin:auto;padding:0 28px;display:flex;align-items:center;gap:45px}.brand{display:flex;align-items:center;text-decoration:none;color:white;min-width:330px}.logo{width:64px;height:64px;border-radius:50%;background:#fff;border:2px solid #2ab9ff;display:flex;align-items:center;justify-content:center;font-size:26px;font-style:italic;font-weight:950;box-shadow:0 0 20px #159dff55}.logo b,.brand strong>b{color:var(--orange)}.logo i,.brand strong>i{color:#159cff}.brand strong{font-size:37px;font-style:italic;letter-spacing:-3px;margin-left:12px;position:relative;padding-bottom:15px}.brand em{font-style:italic;color:white}.brand strong small{position:absolute;bottom:0;left:0;font-size:8px;letter-spacing:2px;color:#b5c0ce;white-space:nowrap}.top nav{display:flex;gap:30px;flex:1}.top nav a{color:#e0e6ee;text-decoration:none;font-size:14px}.top button{border:0;border-radius:22px;padding:12px 22px;color:white;background:linear-gradient(90deg,#147dff,#25c8ff)}.hero{max-width:1440px;margin:auto;padding:45px 28px 38px;display:grid;grid-template-columns:.9fr 1.1fr;gap:42px;align-items:center}.hero h1{font-size:clamp(48px,5vw,76px);line-height:.96;font-style:italic;letter-spacing:-3px;margin:0}.hero h1 span{background:linear-gradient(90deg,#36a8ff,#42dcff);-webkit-background-clip:text;color:transparent}.hero p{font-size:21px;color:#d5dfeb;max-width:620px;line-height:1.55}.benefit{display:flex;gap:28px;color:#dbe6f2;font-size:13px;margin-top:28px}.screen{min-height:320px;border-radius:28px;border:1px solid #218dd1;background:#061321;box-shadow:0 25px 70px #000a,0 0 40px #1b9fff22;padding:18px;display:grid;grid-template-columns:1.2fr repeat(3,.45fr);grid-template-rows:1fr 1fr;gap:10px}.screen>div{border:1px solid #28bfff55;border-radius:14px;background:#0d263b;padding:14px}.map{grid-row:span 2;position:relative}.map>b{display:grid;place-items:center;width:58px;height:58px;border-radius:50%;background:white;color:#111;border:7px solid #f33}.map span{position:absolute;bottom:25px;font-size:18px}.map small{font-size:11px}.app{text-align:center;font-size:24px}.app small{display:block;font-size:9px}.music{grid-column:2/5}.products{max-width:1440px;margin:auto;padding:15px 18px 55px;display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.card{min-height:510px;border-radius:20px;padding:18px;background:#07111e;border:1px solid #27415d;box-shadow:0 18px 55px #0007;position:relative}.orange{border-color:#ff7a2f88;background:linear-gradient(145deg,#28170d,#07111e 55%)}.blue{border-color:#168fff88;background:linear-gradient(145deg,#08294b,#07111e 55%)}.purple{border-color:#8a4dff88;background:linear-gradient(145deg,#21103b,#07111e 55%)}.green{border-color:#18d78a88;background:linear-gradient(145deg,#073123,#07120f 55%)}.cyan{border-color:#188fff88;background:linear-gradient(145deg,#092c55,#07111e 55%)}.head{display:flex;align-items:center;gap:13px}.head h2{margin:0;font-size:25px}.head h2 span{color:#35b9ff}.orange .head h2 span{color:#ff7a2f}.purple .head h2 span{color:#b169ff}.green .head h2 span{color:#3de7a8}.head small{font-size:9px;color:#b2bdca}.ico{width:64px;height:64px;border-radius:15px;display:grid;place-items:center;position:relative;font-weight:950}.play{background:linear-gradient(135deg,#ff4a3c,#ff8c39);font-size:28px}.ico>i{position:absolute;right:-5px;bottom:-4px;font-size:10px;color:#25aaff;font-style:italic;text-shadow:0 1px white}.speed{border-radius:50%;background:#fff;border:7px solid #f33;color:#111;font-size:20px}.split{display:flex;gap:4px;padding:10px;background:#602be7}.split i{height:40px;flex:1;border-radius:5px}.split i:first-child{background:#168fff}.split i:last-child{background:#ff7a2f}.clean{background:linear-gradient(135deg,#2be4a2,#0d9169);font-size:31px}.home{background:linear-gradient(135deg,#2d91ff,#8a4dff);font-size:25px}.demo{height:155px;border-radius:14px;margin:18px 0;background:#091523;border:1px solid #ffffff16;display:flex;align-items:center;justify-content:center;overflow:hidden}.appsdemo{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:18px;background:linear-gradient(145deg,#131e32,#29172d)}.appsdemo b{padding:12px;background:#192a41;border-radius:9px;text-align:center;font-size:11px}.bubbledemo{gap:18px;background:#12344b}.bubbledemo strong{width:92px;height:92px;border-radius:50%;background:white;border:9px solid #f33;color:#111;display:grid;place-items:center;font-size:29px}.bubbledemo strong small{font-size:8px;margin-top:-25px}.bubbledemo div{line-height:2;background:#10283d;padding:10px;border-radius:10px}.splitdemo>div{height:100%;width:50%;display:grid;place-items:center;font-size:30px}.splitdemo>div:first-child{background:#12384d}.splitdemo>div:last-child{background:#291b32}.splitdemo small{font-size:10px}.cleandemo{gap:30px;background:#0c2b21}.cleandemo>b{font-size:65px;color:#55e8ae}.cleandemo span{line-height:2;color:#c6f8e4}.homedemo{font-size:25px;background:linear-gradient(145deg,#10264c,#132b5e);box-shadow:inset 0 0 35px #168fff55}.card p{color:#d1d9e3;font-size:14px;line-height:1.55}.card>a{position:absolute;bottom:18px;left:18px;padding:11px 18px;border-radius:20px;background:#168fff;color:white;text-decoration:none;font-size:12px}.orange>a{background:#ff8238}.purple>a{background:#873cff}.green>a{background:#19cf80}.next{display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;border-style:dashed;color:#8da0b6}.next>b{font-size:60px;color:#2daeff}.trust{max-width:1380px;margin:0 auto 45px;padding:25px 30px;border-top:1px solid #26384d;border-bottom:1px solid #26384d;display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.trust>div{display:flex;align-items:center;gap:13px;font-size:29px}.trust span{display:flex;flex-direction:column;font-size:13px}.trust small{color:#8f9bac;margin-top:5px}.repo{max-width:1380px;margin:35px auto;padding:35px;border:1px solid #24415d;border-radius:22px;background:#081522;display:flex;justify-content:space-between;align-items:center}.repo h2{margin:5px 0}.repo code{color:#9fb0c4}.repo button{margin-left:12px;padding:10px;border:0;border-radius:8px}footer{max-width:1380px;margin:auto;padding:40px 25px 60px;text-align:center;color:#718096;letter-spacing:2px;font-size:11px}@media(max-width:950px){.top nav,.top>button{display:none}.hero{grid-template-columns:1fr}.products{grid-template-columns:repeat(2,1fr)}.trust{grid-template-columns:1fr 1fr}.brand{min-width:0}}@media(max-width:620px){.top{height:72px;padding:0 16px}.logo{width:50px;height:50px;font-size:21px}.brand strong{font-size:28px}.hero{padding:35px 16px}.hero h1{font-size:44px}.benefit{flex-direction:column;gap:10px}.screen{min-height:250px;grid-template-columns:1fr 1fr}.map{grid-column:1;grid-row:1/3}.music{grid-column:2}.products{grid-template-columns:1fr;padding:12px}.card{min-height:500px}.trust{grid-template-columns:1fr;padding:20px}.repo{margin:20px 12px;display:block}.repo>div:last-child{margin-top:20px;overflow:auto}.top .brand small{display:none}}
/* polish pass */
.hero h1{line-height:1.04}.hero h1 .experience{display:inline-block;margin-top:10px;font-family:"Segoe Script","Brush Script MT",cursive;font-style:italic;font-weight:700;letter-spacing:-1px;text-transform:none;font-size:.78em;line-height:1.05;background:linear-gradient(90deg,#29a8ff,#55e5ff);-webkit-background-clip:text;color:transparent;text-shadow:none}
.card{min-height:455px}.card p{margin-bottom:62px}.card>a{bottom:18px}.demo{height:145px}
.appsdemo b{display:flex;align-items:center;justify-content:center;gap:7px}.yt-mark{display:grid;place-items:center;width:26px;height:19px;border-radius:6px;background:#ff2d2d;color:white;font-size:10px}.zalo-mark{display:grid;place-items:center;width:25px;height:25px;border-radius:7px;background:#168cff;color:white;font-size:13px}.tt-mark{font-size:20px;text-shadow:-2px 0 #20e6ef,2px 0 #ff3567}.music-mark{font-size:19px;color:#ff67b8}
.homedemo{height:160px;padding:10px;background:linear-gradient(145deg,#071326,#133a72)}.ios27-home{width:100%;height:100%;border-radius:13px;padding:10px;background:radial-gradient(circle at 70% 20%,#357cff88,transparent 35%),linear-gradient(135deg,#071b3a,#183967);box-shadow:inset 0 0 25px #54b9ff33}.ios-status{display:flex;justify-content:space-between;font-size:8px;color:#fff}.ios-apps{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin:12px 5px}.ios-apps i{height:30px;border-radius:8px;background:#ffffff1c;display:grid;place-items:center;font-style:normal;font-size:15px;backdrop-filter:blur(8px)}.ios-dock{height:34px;margin:5px 12px 0;border-radius:13px;background:#d7e8ff25;display:flex;align-items:center;justify-content:space-around;backdrop-filter:blur(12px)}.ios-dock i{font-style:normal;font-size:15px}
@media(max-width:620px){.card{min-height:430px}.card p{margin-bottom:48px}.demo{height:135px}.hero h1 .experience{margin-top:8px;font-size:.72em}}

/* refinement: typography, app artwork, compact cards */
.hero h1{line-height:1.04}.hero h1 .experience{display:block;margin-top:14px;font-family:"Snell Roundhand","Segoe Script","Brush Script MT",cursive;font-weight:600;font-style:italic;text-transform:none;letter-spacing:0;font-size:.92em;line-height:1.02;background:linear-gradient(90deg,#2ba7ff,#51e0ff);-webkit-background-clip:text;color:transparent;text-shadow:none}
.appsdemo b{display:flex;align-items:center;justify-content:center;gap:8px}.appsdemo i{width:29px;height:29px;border-radius:8px;display:grid;place-items:center;color:white;font-style:normal;font-weight:900}.yt{background:#ff202c}.zalo{background:#168cff}.tt{background:linear-gradient(135deg,#111 45%,#22d5df 46%,#ff315e)}.musicapp{background:linear-gradient(135deg,#ff496f,#a34bff)}
.homedemo{padding:10px;background:linear-gradient(145deg,#112b5c,#0a1734)}.ios27home{width:100%;height:100%;border-radius:12px;padding:10px;background:radial-gradient(circle at 72% 18%,#31c9ff55,transparent 30%),linear-gradient(145deg,#183e7a,#542f8d);display:flex;flex-direction:column;justify-content:space-between}.ios27home .status{display:flex;justify-content:space-between;font-size:9px;color:#fff}.homeapps{display:flex;justify-content:center;gap:13px}.homeapps i,.dock27 i{font-style:normal;width:31px;height:31px;border-radius:9px;background:#ffffffdf;display:grid;place-items:center;font-size:16px;box-shadow:0 5px 12px #0005}.dock27{margin:auto;width:max-content;display:flex;gap:9px;padding:7px 10px;border-radius:16px;background:#ffffff2d;backdrop-filter:blur(12px);border:1px solid #ffffff38}.dock27 i:last-child{background:linear-gradient(135deg,#3a9cff,#8b4cff);color:white;font-weight:800}
.card{min-height:445px}.demo{height:135px;margin:15px 0}.card p{margin:12px 0 58px}.card>a{bottom:16px}.next{min-height:300px}
@media(max-width:620px){.hero h1 .experience{margin-top:12px;font-size:.88em}.card{min-height:0;padding-bottom:74px}.demo{height:130px}.card p{margin-bottom:10px}.card>a{position:static;display:inline-block;margin-top:16px}.next{padding-bottom:25px;min-height:260px}}

/* richer CarPlay hero artwork */
.screen{position:relative;padding:42px 16px 16px 66px;background:radial-gradient(circle at 25% 35%,#123f58 0,transparent 28%),linear-gradient(145deg,#07131f,#0b2033);overflow:hidden}.cpbar{position:absolute;top:12px;left:72px;right:18px;display:flex;justify-content:space-between;color:#dceafa;font-size:10px}.cpdock{position:absolute;left:12px;top:48px;bottom:15px;width:42px;border-radius:14px;background:#08121d99;border:1px solid #ffffff14;display:flex;flex-direction:column;justify-content:center;gap:15px;align-items:center}.cpdock i{font-style:normal;font-size:18px}.screen .map{overflow:hidden;background:linear-gradient(145deg,#0b3347,#0b2638)!important}.road{position:absolute;height:8px;background:#38738a55;border-radius:20px;transform-origin:left}.r1{width:120%;left:-15%;top:42%;transform:rotate(-22deg)}.r2{width:100%;left:10%;top:64%;transform:rotate(28deg)}.r3{width:80%;left:28%;top:25%;transform:rotate(67deg)}.screen .map>b{position:relative;z-index:2}.route{z-index:2}.route small{display:block}.arrow{position:absolute;bottom:18px;right:24px;color:#2a9dff;font-style:normal;font-size:26px;transform:rotate(15deg);text-shadow:0 0 16px #28aaff}.screen .app{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px}.screen .app i{width:38px;height:38px;border-radius:10px;display:grid;place-items:center;color:white;font-style:normal;font-weight:900;font-size:18px}.screen .youtube i{background:#ff2530}.screen .zaloapp i{background:#168cff}.screen .tiktokapp i{background:linear-gradient(135deg,#111 42%,#22d5df 43%,#ff315e)}.screen .music{display:flex;align-items:center;gap:12px}.cover{width:48px;height:48px;border-radius:10px;background:linear-gradient(135deg,#ff7a2f,#168cff);display:grid;place-items:center;font-weight:900}.screen .music>div:last-child{display:flex;flex-direction:column;gap:3px}.screen .music span{font-size:12px;margin-top:5px}

/* responsive navigation and account entry */
.menu-toggle{display:none;width:44px;height:44px;flex:none;align-items:center;justify-content:center;flex-direction:column;gap:5px;border:1px solid #ffffff24;border-radius:13px;background:#0a1b2c;color:#fff;cursor:pointer}
.menu-toggle span{width:19px;height:2px;border-radius:2px;background:#eaf5ff;transition:transform .2s,opacity .2s}
.menu-toggle[aria-expanded="true"] span:first-child{transform:translateY(7px) rotate(45deg)}
.menu-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.menu-toggle[aria-expanded="true"] span:last-child{transform:translateY(-7px) rotate(-45deg)}
.top nav .mobile-login{display:none}
.login-notice{position:fixed;z-index:100;left:50%;bottom:22px;transform:translate(-50%,12px);max-width:calc(100vw - 28px);padding:13px 18px;border:1px solid #36bfff88;border-radius:14px;background:#091a2b;color:#f7f9fd;font-size:13px;line-height:1.45;box-shadow:0 12px 40px #000b;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s}
.login-notice.visible{opacity:1;transform:translate(-50%,0)}
@media(max-width:950px){
.top{position:relative;z-index:20;justify-content:space-between}
.top nav{display:none;flex:none}
.top>button.desktop-login{display:none}
.menu-toggle{display:flex}
.top.menu-open nav{display:flex;position:absolute;top:calc(100% - 1px);left:16px;right:16px;z-index:30;flex-direction:column;gap:0;padding:8px;border:1px solid #2c4c69;border-radius:17px;background:linear-gradient(145deg,#0b1d30,#06111f);box-shadow:0 24px 55px #000b}
.top.menu-open nav a{display:block;padding:14px 13px;border-bottom:1px solid #ffffff12;font-size:15px}
.top nav .mobile-login{display:block;width:100%;margin-top:8px;padding:13px 16px;border:0;border-radius:12px;color:white;font-weight:700;background:linear-gradient(90deg,#147dff,#25c8ff);text-align:center}
}
@media(max-width:620px){
.top.menu-open nav{left:12px;right:12px}
.login-notice{bottom:14px;font-size:12px}
}
@media(max-width:950px){.top>button.menu-toggle{display:flex}}