:root{--bg:#f6f8fb;--surface:#fff;--surface2:#eef3f8;--ink:#0b1220;--soft:#475569;--muted:#64748b;--line:#dce4ee;--navy:#0b1220;--cyan:#22d3ee;--teal:#2dd4bf;--amber:#fbbf24;--blue:#3b82f6;--shadow:0 16px 50px rgba(15,23,42,.10);--radius:24px;--max:1180px}
[data-theme="dark"]{--bg:#07101d;--surface:#0e1929;--surface2:#122036;--ink:#eef6ff;--soft:#b6c3d4;--muted:#8493a8;--line:#203149;--navy:#050b14;--shadow:0 18px 60px rgba(0,0,0,.28)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font-family:"IBM Plex Sans Thai",system-ui,sans-serif;line-height:1.65;-webkit-font-smoothing:antialiased}a{text-decoration:none;color:inherit}button{font:inherit}.wrap{width:min(var(--max),calc(100% - 40px));margin:auto}.mono{font-family:"IBM Plex Mono",monospace}.display,h1,h2,h3{font-family:"Chakra Petch","IBM Plex Sans Thai",sans-serif}.topbar{position:sticky;top:0;z-index:50;background:color-mix(in srgb,var(--bg) 82%,transparent);backdrop-filter:blur(18px);border-bottom:1px solid color-mix(in srgb,var(--line) 70%,transparent)}.nav{height:74px;display:flex;align-items:center;gap:20px}.logo img{width:205px;display:block}.navlinks{margin-left:auto;display:flex;align-items:center;gap:4px}.navlinks a{padding:10px 12px;border-radius:12px;color:var(--soft);font-weight:600;font-size:14px}.navlinks a:hover{background:var(--surface);color:var(--ink)}.theme{width:42px;height:42px;border:1px solid var(--line);border-radius:12px;background:var(--surface);cursor:pointer;color:var(--ink)}.menu{display:none}.hero{padding:72px 0 54px;position:relative;overflow:hidden}.hero:before{content:"";position:absolute;width:540px;height:540px;border-radius:50%;right:-220px;top:-240px;background:radial-gradient(circle,var(--cyan),transparent 67%);opacity:.18;pointer-events:none}.hero-grid{display:grid;grid-template-columns:1.08fr .92fr;gap:48px;align-items:center}.eyebrow{font:700 12px "IBM Plex Mono";letter-spacing:2.1px;color:#0f9fb1;text-transform:uppercase}.hero h1{font-size:clamp(44px,7vw,78px);line-height:1.03;letter-spacing:-2.7px;margin:16px 0 20px}.hero h1 span{background:linear-gradient(100deg,#0891b2,#14b8a6,#eaa408);-webkit-background-clip:text;background-clip:text;color:transparent}.hero p{font-size:19px;color:var(--soft);max-width:690px;margin:0 0 28px}.actions{display:flex;gap:12px;flex-wrap:wrap}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 18px;border-radius:13px;font-weight:700;border:1px solid var(--line);background:var(--surface)}.btn.primary{background:var(--navy);border-color:var(--navy);color:#fff}.btn.accent{background:linear-gradient(110deg,var(--cyan),var(--teal));border:0;color:#06222a}.hero-card{background:linear-gradient(150deg,#0b1220,#14233a);color:#fff;border-radius:30px;padding:26px;box-shadow:0 26px 80px rgba(7,16,29,.25);position:relative;overflow:hidden}.hero-card:after{content:"";position:absolute;width:220px;height:220px;border-radius:50%;right:-90px;bottom:-120px;background:var(--cyan);opacity:.12}.terminal{font:500 12px "IBM Plex Mono";color:#91a6bd;display:flex;gap:7px}.terminal i{width:8px;height:8px;border-radius:50%;display:inline-block;background:#fb7185}.terminal i:nth-child(2){background:#fbbf24}.terminal i:nth-child(3){background:#34d399}.robot-flow{margin-top:25px;display:grid;gap:13px}.flow-node{border:1px solid #2b3a50;background:rgba(255,255,255,.04);border-radius:17px;padding:17px}.flow-node small{font:700 10px "IBM Plex Mono";letter-spacing:1.5px;color:#8ba0b8}.flow-node b{display:block;font:700 20px "Chakra Petch";margin-top:3px}.flow-node:nth-child(1){border-left:4px solid var(--cyan)}.flow-node:nth-child(2){border-left:4px solid var(--teal)}.flow-node:nth-child(3){border-left:4px solid var(--amber)}.stats{padding:0 0 30px}.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.stat{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:20px}.stat strong{font:700 32px "Chakra Petch";display:block}.stat span{color:var(--muted);font-size:14px}.section{padding:68px 0}.section.alt{background:var(--surface2)}.section-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:26px}.section h2{font-size:clamp(30px,4vw,45px);letter-spacing:-1.1px;margin:0}.section-head p{max-width:550px;color:var(--soft);margin:0}.path{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}.step{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:18px;min-height:165px;position:relative}.step .num{font:700 11px "IBM Plex Mono";color:#0891b2}.step h3{font-size:17px;margin:30px 0 5px}.step p{font-size:13px;color:var(--muted);margin:0}.step:after{content:"→";position:absolute;right:-13px;top:45%;z-index:2;color:var(--muted);font-weight:700}.step:last-child:after{display:none}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.card{background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:23px;box-shadow:0 4px 18px rgba(15,23,42,.03);transition:.18s}.card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}.card .tag{font:700 10px "IBM Plex Mono";letter-spacing:1.2px;color:#0891b2}.card h3{font-size:20px;margin:12px 0 7px}.card p{color:var(--soft);font-size:14px;margin:0 0 16px}.card .go{font-weight:700;font-size:14px}.feature{display:grid;grid-template-columns:1fr 1fr;gap:20px}.panel{background:var(--surface);border:1px solid var(--line);border-radius:24px;padding:28px}.panel.dark{background:linear-gradient(140deg,#0b1220,#14233a);color:#fff;border:0}.panel h3{font-size:25px;margin:4px 0 8px}.panel p{color:var(--soft)}.panel.dark p{color:#b9c6d6}.chipset{display:flex;gap:8px;flex-wrap:wrap;margin-top:15px}.chipset span{border:1px solid var(--line);border-radius:999px;padding:7px 10px;font-size:12px}.panel.dark .chipset span{border-color:#33455d;color:#d9e5f2}.profile{display:grid;grid-template-columns:180px 1fr;gap:28px;align-items:center}.avatar{aspect-ratio:1;border-radius:28px;background:linear-gradient(135deg,var(--cyan),var(--teal),var(--amber));padding:4px}.avatar-inner{height:100%;border-radius:25px;background:var(--navy);display:grid;place-items:center;color:#fff;font:800 54px "Chakra Petch"}.download-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.download{border:1px solid var(--line);background:var(--surface);padding:18px;border-radius:17px}.download b{display:block}.download small{color:var(--muted)}footer{padding:40px 0 56px;border-top:1px solid var(--line);color:var(--muted);font-size:13px}.footer-row{display:flex;gap:20px;justify-content:space-between;align-items:center}.footer-links{display:flex;gap:16px}.page-hero{padding:54px 0 34px}.page-hero h1{font-size:clamp(38px,6vw,64px);margin:8px 0}.page-hero p{max-width:720px;color:var(--soft);font-size:18px}.timeline{display:grid;gap:14px}.timeline-item{display:grid;grid-template-columns:150px 1fr;gap:20px;background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:22px}.timeline-item time{font:700 13px "IBM Plex Mono";color:#0891b2}.timeline-item h3{margin:0 0 6px}.timeline-item p{margin:0;color:var(--soft)}
@media(max-width:920px){.navlinks{display:none}.menu{display:block;margin-left:auto}.hero-grid,.feature{grid-template-columns:1fr}.stat-grid{grid-template-columns:repeat(2,1fr)}.path{grid-template-columns:repeat(3,1fr)}.step:nth-child(3):after,.step:nth-child(6):after{display:none}.cards{grid-template-columns:repeat(2,1fr)}.download-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.wrap{width:min(100% - 28px,var(--max))}.nav{height:66px}.logo img{width:175px}.hero{padding:48px 0 35px}.hero h1{font-size:46px;letter-spacing:-1.7px}.hero p{font-size:17px}.stat-grid,.cards,.download-grid{grid-template-columns:1fr 1fr}.path{grid-template-columns:1fr}.step{min-height:0}.step:after{content:"↓";right:50%;top:auto;bottom:-19px}.step:nth-child(3):after{display:block}.profile{grid-template-columns:1fr}.avatar{width:140px}.section{padding:50px 0}.section-head{display:block}.section-head p{margin-top:10px}.timeline-item{grid-template-columns:1fr}.footer-row{display:block}.footer-links{margin-top:12px;flex-wrap:wrap}}