:root{--navy:#071c35;--blue:#0879d9;--cyan:#4dd9e8;--cream:#f4f7f8;--ink:#10263c;--muted:#627589;--line:#dbe4e9;--white:#fff;--orange:#ff7a45}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:'IBM Plex Sans Thai',sans-serif;color:var(--ink);background:#fff}a{text-decoration:none;color:inherit}.scroll-progress{position:fixed;left:0;top:0;height:3px;background:linear-gradient(90deg,var(--cyan),var(--blue));z-index:100;width:0}.topbar{position:fixed;z-index:50;top:0;left:0;right:0;height:86px;padding:0 5vw;display:flex;align-items:center;justify-content:space-between;color:#fff;transition:.3s;border-bottom:1px solid rgba(255,255,255,.12)}.topbar.scrolled{height:72px;background:rgba(7,28,53,.94);backdrop-filter:blur(15px)}.brand{display:flex;align-items:center;gap:12px}.brand-mark{display:grid;place-items:center;width:43px;height:43px;border-radius:12px;background:linear-gradient(135deg,var(--cyan),var(--blue));font-weight:800;letter-spacing:-1px;color:#fff}.brand b,.brand small{display:block}.brand b{font-size:15px}.brand small{font-size:11px;opacity:.7}.topbar nav{display:flex;gap:25px;align-items:center;font-size:14px}.topbar nav a{opacity:.8;transition:.2s}.topbar nav a:hover{opacity:1;color:var(--cyan)}.nav-cta{border:1px solid rgba(255,255,255,.5);border-radius:99px;padding:9px 17px}.menu-btn{display:none;background:none;border:0;color:#fff;font-size:25px}.hero{min-height:760px;padding:150px 7vw 90px;background:radial-gradient(circle at 80% 20%,#103e69 0,transparent 35%),linear-gradient(145deg,#061a31,#092b4e);color:#fff;display:grid;grid-template-columns:1.05fr .95fr;align-items:center;overflow:hidden;position:relative}.hero-copy{max-width:700px;z-index:2}.eyebrow{font-size:12px;font-weight:700;letter-spacing:2px;color:var(--cyan);margin:0 0 20px}.eyebrow span{display:inline-block;width:25px;height:1px;background:currentColor;vertical-align:middle;margin-right:8px}.eyebrow.dark{color:var(--blue)}h1{font-size:clamp(46px,6vw,82px);line-height:1.05;letter-spacing:-3px;margin:0 0 28px}h1 em{font-style:normal;color:var(--cyan)}.lead{font-size:19px;line-height:1.85;color:#bfd0df;max-width:650px}.hero-actions{display:flex;gap:13px;margin:34px 0}.btn{border:0;display:inline-flex;align-items:center;justify-content:center;gap:18px;padding:14px 22px;border-radius:10px;font:600 15px inherit;cursor:pointer;transition:.25s}.btn:hover{transform:translateY(-2px)}.btn.primary{background:linear-gradient(135deg,var(--cyan),#22a9e5);color:#06223d;box-shadow:0 12px 30px rgba(77,217,232,.2)}.btn.ghost{border:1px solid rgba(255,255,255,.2);color:#fff}.trust{display:flex;gap:25px;color:#8fa8bd;font-size:12px}.trust span:first-child{color:#78eab0}.network-card{height:480px;position:relative;display:grid;place-items:center}.node{position:absolute;display:grid;place-items:center;text-align:center;border-radius:50%;background:rgba(11,44,75,.8);border:1px solid rgba(77,217,232,.35);box-shadow:0 0 45px rgba(77,217,232,.12);font-size:10px;letter-spacing:1px}.node.center{width:145px;height:145px;font-size:14px}.node.center b{font-size:36px;color:var(--cyan)}.n1,.n2,.n3{width:92px;height:92px}.n1{left:8%;top:14%}.n2{right:4%;top:18%}.n3{right:15%;bottom:8%}.pulse{position:absolute;border:1px solid rgba(77,217,232,.16);border-radius:50%;animation:pulse 4s infinite}.p1{width:260px;height:260px}.p2{width:400px;height:400px;animation-delay:1s}.p3{width:520px;height:520px;animation-delay:2s}.status-card{position:absolute;left:3%;bottom:5%;background:#fff;color:var(--ink);padding:15px 22px;border-radius:12px;box-shadow:0 20px 50px rgba(0,0,0,.2)}.status-card span,.status-card b{display:block}.status-card span{font-size:9px;letter-spacing:2px;color:#8394a3}.status-card b{font-size:25px}.status-card i{position:absolute;width:8px;height:8px;background:#42d48b;border-radius:50%;right:14px;top:14px}@keyframes pulse{50%{transform:scale(1.04);opacity:.5}}.section{padding:105px 7vw}.section-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:48px}.section-head h2,.about h2,.contact h2{font-size:clamp(34px,4vw,53px);line-height:1.15;letter-spacing:-1.5px;margin:0}.section-head>p{max-width:360px;color:var(--muted);line-height:1.7}.system-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.system-card{position:relative;min-height:310px;border:1px solid var(--line);padding:27px;border-radius:18px;transition:.3s;overflow:hidden}.system-card:hover{transform:translateY(-7px);box-shadow:0 25px 55px rgba(16,38,60,.11);border-color:transparent}.system-card .num{position:absolute;right:22px;top:19px;font-size:12px;color:#99a9b5}.card-icon{width:55px;height:55px;border-radius:14px;background:#eaf7fb;color:var(--blue);display:grid;place-items:center;font-size:27px;margin:35px 0 30px}.system-card h3{font-size:21px;margin:0 0 10px}.system-card p{color:var(--muted);line-height:1.65}.card-foot{position:absolute;left:27px;right:27px;bottom:24px;padding-top:15px;border-top:1px solid var(--line);display:flex;justify-content:space-between;font-size:12px;color:#758899}.card-foot b{font-size:20px;color:var(--blue)}.dark-section{background:var(--navy);color:#fff;padding:105px 7vw}.dark-section .section-head>p{color:#9eb1c4}.duty-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #24405d;border-left:1px solid #24405d}.duty{padding:38px 30px;min-height:235px;border-right:1px solid #24405d;border-bottom:1px solid #24405d;transition:.25s}.duty:hover{background:#0b2a4a}.duty>span{color:var(--cyan);font-size:12px}.duty h3{font-size:21px;margin:35px 0 12px}.duty p{color:#9eb1c4;line-height:1.7;margin:0}.docs{border-top:1px solid var(--line)}.docs a{display:grid;grid-template-columns:70px 1fr auto;align-items:center;gap:22px;padding:25px 12px;border-bottom:1px solid var(--line);transition:.2s}.docs a:hover{padding-left:22px;background:#f7fafb}.doc-icon{width:54px;height:54px;border-radius:12px;background:#ffeceb;color:#db4e46;display:grid;place-items:center;font-size:11px;font-weight:800}.doc-icon.form{background:#e8f6ee;color:#168754}.docs small{color:var(--muted)}.docs h3{margin:3px 0;font-size:18px}.docs b{font-size:13px;color:var(--blue)}.about{display:grid;grid-template-columns:1fr 1fr;gap:10vw;background:#eef4f6;padding:105px 7vw;align-items:center}.about-copy>p:not(.eyebrow){color:var(--muted);line-height:1.9;font-size:17px}.quote{margin-top:35px;padding-left:20px;border-left:3px solid var(--cyan);font-size:22px;font-weight:600}.about-panel{display:grid;grid-template-columns:1fr 1fr;gap:15px}.metric{background:#fff;border-radius:18px;padding:32px;min-height:160px;display:flex;flex-direction:column;justify-content:end}.metric.wide{grid-column:span 2;background:linear-gradient(135deg,var(--blue),#0a4c88);color:#fff}.metric b{font-size:48px;color:var(--blue)}.metric.wide b{color:var(--cyan)}.metric span{color:var(--muted)}.metric.wide span{color:#c4d9eb}.contact{background:linear-gradient(145deg,#061a31,#0a3159);color:#fff;padding:105px 7vw;display:grid;grid-template-columns:1fr 1fr;gap:10vw}.contact-info>p:not(.eyebrow){color:#a9bdd0;line-height:1.8}.contact-info ul{list-style:none;padding:0;margin-top:35px}.contact-info li{display:grid;grid-template-columns:90px 1fr;padding:15px 0;border-bottom:1px solid #294761;font-size:14px}.contact-info li span{color:#7792aa}.contact-form{background:#fff;color:var(--ink);padding:34px;border-radius:20px}.contact-form h3{font-size:24px;margin:0 0 25px}.contact-form label{display:block;font-size:12px;font-weight:600;margin-bottom:17px}.contact-form input,.contact-form textarea{display:block;width:100%;margin-top:7px;border:1px solid var(--line);border-radius:9px;padding:12px 14px;font:14px inherit;outline:none}.contact-form input:focus,.contact-form textarea:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(8,121,217,.1)}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.contact-form .btn{width:100%}.notice{padding:11px;border-radius:8px;font-size:13px}.notice.success{background:#e8f8ef;color:#157a47}.notice.error{background:#fff0ed;color:#bd3a2c}footer{padding:35px 7vw;background:#041426;color:#fff;display:flex;align-items:center;justify-content:space-between}footer p,footer>a{font-size:12px;color:#7590a8}.reveal{opacity:0;transform:translateY(24px);transition:opacity .65s,transform .65s}.reveal.visible{opacity:1;transform:none}@media(max-width:920px){.topbar nav{display:none;position:absolute;top:72px;left:0;right:0;padding:20px 5vw;background:#071c35;flex-direction:column;align-items:flex-start}.topbar nav.open{display:flex}.menu-btn{display:block}.hero{grid-template-columns:1fr;padding-top:135px}.network-card{height:380px}.system-grid,.duty-grid{grid-template-columns:1fr 1fr}.about,.contact{grid-template-columns:1fr;gap:55px}.section-head{align-items:start;flex-direction:column}.section-head>p{margin-top:15px}}@media(max-width:620px){.hero{padding-left:6vw;padding-right:6vw}.network-card{display:none}h1{letter-spacing:-2px}.trust{flex-direction:column;gap:5px}.section,.dark-section,.about,.contact{padding:75px 6vw}.system-grid,.duty-grid{grid-template-columns:1fr}.duty-grid{border-left:0}.form-row{grid-template-columns:1fr}.docs a{grid-template-columns:55px 1fr}.docs a>b{display:none}.topbar .brand small{display:none}footer{align-items:flex-start;gap:25px;flex-direction:column}}
