*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#0b0d14;color:#e8eaf0;font-family:"IBM Plex Sans Thai",-apple-system,"Segoe UI","Noto Sans Thai",sans-serif;font-size:16px;line-height:1.75;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{margin:0;line-height:1.3;letter-spacing:-.01em;font-family:"Bai Jamjuree","IBM Plex Sans Thai",-apple-system,"Noto Sans Thai",sans-serif}
p{margin:0}
a{color:#8b7cff;text-decoration:none}
a:hover{color:#a99bff}
img,svg{max-width:100%}
.wrap{max-width:1200px;margin:0 auto;padding:0 48px}
.btn{cursor:pointer;font-family:inherit;border:0;transition:filter .16s,transform .16s,border-color .16s,background .16s,color .16s;text-decoration:none}
.btn:hover{filter:brightness(1.12);transform:translateY(-1px)}
.mono{font-family:"IBM Plex Mono",ui-monospace,Menlo,monospace}
::selection{background:#7c3aed;color:#fff}
.navlink{color:#b9c0d0;font-size:14.5px;font-weight:500}
.navlink:hover{color:#e8eaf0}
.line-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;background:#06C755;color:#fff;font-weight:600;border-radius:10px}
.card{border:1px solid #262b3d;border-radius:14px;background:#12151f;transition:border-color .16s}
.card:hover{border-color:#343b56}
.tab{display:flex;flex-direction:column;gap:2px;padding:15px 16px;border:1px solid #262b3d;border-radius:11px;background:#12151f;color:#8b93a7;cursor:pointer;text-align:left}
.tab:hover{border-color:#3d4468}
.tab[aria-selected="true"]{border-color:#7c3aed;background:#191634;color:#e8eaf0;box-shadow:0 8px 24px rgba(124,58,237,.22)}
.tab b{font-size:14.5px;font-weight:600}
.tab span{font-size:11px;opacity:.7}
.sec{padding:92px 0;border-top:1px solid #1c2030}
.kicker{color:#8b7cff;font-size:11.5px;font-weight:700;letter-spacing:.24em}
.h2{font-size:40px;font-weight:700}
.lead{color:#8b93a7;font-size:17px}
.faq-q{display:flex;align-items:center;gap:16px;width:100%;padding:19px 24px;background:none;color:#e8eaf0;font-size:16.5px;font-weight:500;text-align:left;cursor:pointer;font-family:inherit;min-height:60px}
.faq-q:hover{background:#161a26}
.faq-sign{display:grid;place-items:center;width:26px;height:26px;border:1px solid #2e3448;border-radius:7px;color:#6b7280;font-size:15px;line-height:1;flex-shrink:0}
.faq[open] .faq-sign{border-color:#7c3aed;color:#b6a8ff}
.grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.grid4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;border:1px solid #262b3d;border-radius:14px;background:#262b3d;overflow:hidden}
.grid5{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}
.split{display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:34px}
.split-stt{display:grid;grid-template-columns:minmax(0,1fr) 440px;gap:56px;align-items:start}
#nav-links{display:flex}
#menu{display:none}
#burger{display:none}
@media(max-width:900px){
  .wrap{padding:0 20px}
  header .wrap{gap:12px!important}
  .sec{padding:52px 0}
  .h2{font-size:28px}
  .lead{font-size:15.5px}
  .grid3,.grid5,.split,.split-stt{grid-template-columns:1fr;gap:12px}
  .grid4{grid-template-columns:repeat(2,minmax(0,1fr))}
  #nav-links{display:none}
  #burger{display:grid}
  #menu.open{display:flex}
  .hero h1{font-size:36px!important}
  .cta-row{flex-direction:column;align-items:stretch!important}
  .cta-row>*{width:100%}
  .tabs-scroll{display:flex;gap:10px;overflow-x:auto;padding-bottom:4px}
  .tabs-scroll .tab{flex:0 0 auto;min-width:170px}
}