*,:before,:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:5rem}body{background:var(--bg,#0b0f1a);color:var(--text,#e8ecf5);margin:0;font:16px/1.7 system-ui,-apple-system,Segoe UI,Roboto,Noto Sans,Noto Sans Thai,Leelawadee UI,Tahoma,sans-serif}html[lang^=th] body{line-height:1.85}img{max-width:100%;height:auto;display:block}a{color:var(--accent,#3ba7e5);text-underline-offset:3px}a:hover{text-decoration:none}h1,h2,h3,h4{margin:0 0 .6em;line-height:1.25}h1{font-size:clamp(1.7rem,4vw,2.5rem)}h2{margin-top:1.8em;font-size:clamp(1.35rem,3vw,1.8rem)}h3{font-size:1.15rem}p{margin:0 0 1em}.muted{color:var(--muted,#9aa6c2)}.plain{margin:0;padding:0;list-style:none}.plain li{margin:.35rem 0}.wrap{width:min(1120px,100% - 2rem);margin-inline:auto}.narrow{width:min(780px,100% - 2rem);margin-inline:auto}.skip{background:var(--primary);color:var(--primary-text);z-index:100;padding:.5rem 1rem;position:absolute;top:0;left:-999px}.skip:focus{left:0}:focus-visible{outline:2px solid var(--primary);outline-offset:2px}.agebar{color:var(--muted);text-align:center;background:#000;padding:.35rem 1rem;font-size:.8rem}.badge18{border:1.5px solid var(--danger);color:var(--danger);vertical-align:middle;border-radius:999px;padding:0 .45rem;font-size:.75rem;font-weight:700;line-height:1.5;display:inline-block}.site-header{z-index:50;background:color-mix(in srgb, var(--bg) 92%, transparent);backdrop-filter:blur(8px);border-bottom:1px solid var(--border);position:sticky;top:0}.bar{flex-wrap:wrap;align-items:center;gap:1rem;min-height:60px;padding-block:.4rem;display:flex}.logo img{width:auto;height:36px}.main-nav{flex:1;gap:1.1rem;margin-left:.5rem;display:flex}.main-nav a,.langs a{color:var(--text);font-weight:500;text-decoration:none}.main-nav a:hover{color:var(--primary)}.langs{gap:.4rem;display:flex}.langs a{border:1px solid var(--border);color:var(--muted);border-radius:6px;padding:.1rem .5rem;font-size:.8rem}.langs a[aria-current]{border-color:var(--primary);color:var(--primary)}.subnav{border-top:1px solid var(--border);background:var(--surface)}.subnav .wrap{white-space:nowrap;scrollbar-width:thin;gap:1.2rem;padding-block:.45rem;display:flex;overflow-x:auto}.subnav a{color:var(--muted);font-size:.9rem;text-decoration:none}.subnav a:hover{color:var(--primary)}.btn{background:var(--primary);color:var(--primary-text);cursor:pointer;border:0;border-radius:10px;padding:.7rem 1.4rem;font-size:1rem;font-weight:700;text-decoration:none;transition:filter .15s,transform .15s;display:inline-block}.btn:hover{filter:brightness(1.1);transform:translateY(-1px)}.btn-sm{border-radius:8px;padding:.4rem .9rem;font-size:.9rem}.btn-lg{padding:.95rem 2rem;font-size:1.1rem}.btn-ghost{color:var(--primary);border:1.5px solid var(--primary);background:0 0}.hero{background:radial-gradient(1200px 400px at 70% -10%, color-mix(in srgb, var(--primary) 22%, transparent), transparent), var(--bg);border-bottom:1px solid var(--border);padding:clamp(2.5rem,7vw,5rem) 0}.hero p.lead{color:var(--muted);max-width:46rem;font-size:1.15rem}.hero .actions{flex-wrap:wrap;gap:.8rem;margin-top:1.4rem;display:flex}section.block{padding:2.5rem 0}.grid{grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1.1rem;display:grid}.features{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1rem;margin:0;padding:0;list-style:none;display:grid}.features li{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:1.1rem}.features .ico{font-size:1.6rem}.card{background:var(--surface);border:1px solid var(--border);border-radius:14px;flex-direction:column;transition:border-color .15s,transform .15s;display:flex;overflow:hidden}.card:hover{border-color:var(--primary);transform:translateY(-2px)}.card-icon{padding:1.1rem 1.1rem 0;font-size:2.6rem;text-decoration:none}.card-img img{aspect-ratio:16/9;object-fit:cover;width:100%}.card-body{flex-direction:column;flex:1;padding:1rem 1.1rem 1.2rem;display:flex}.card-body h3 a{color:var(--text);text-decoration:none}.card-body p{color:var(--muted);font-size:.95rem}.card .more{margin-top:auto;font-weight:600;text-decoration:none}.meta{color:var(--muted);font-size:.85rem;margin-bottom:.5rem!important}.head-row{flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:1rem;display:flex}.head-row h2{margin-top:0}.trust{background:var(--surface);border:1px solid var(--border);color:var(--muted);border-radius:12px;flex-wrap:wrap;gap:.6rem 1.4rem;padding:.8rem 1.1rem;font-size:.9rem;display:flex}.trust strong{color:var(--primary)}.page-head{padding:1.6rem 0 .5rem}.crumbs ol{color:var(--muted);flex-wrap:wrap;gap:.3rem;margin:0 0 1rem;padding:0;font-size:.85rem;list-style:none;display:flex}.crumbs li+li:before{content:"›";margin-right:.3rem}.crumbs a{color:var(--muted)}.cover{aspect-ratio:16/9;object-fit:cover;border-radius:14px;width:100%;margin:1rem 0}.prose{font-size:1.05rem}.prose h2:first-child{border-top:0;margin-top:0}.prose ul,.prose ol{margin:0 0 1em;padding-left:1.4rem}.prose li{margin:.25rem 0}.prose blockquote{border-left:4px solid var(--primary);background:var(--surface);color:var(--muted);border-radius:0 10px 10px 0;margin:1.2rem 0;padding:.6rem 1.1rem}.prose table{border-collapse:collapse;width:100%;margin:1.2rem 0;font-size:.95rem;display:block;overflow-x:auto}.prose th,.prose td{border:1px solid var(--border);text-align:left;padding:.55rem .8rem}.prose th{background:var(--surface2)}.prose img{border-radius:10px;margin:1rem 0}.prose code{background:var(--surface2);border-radius:4px;padding:.1rem .35rem}.toc{background:var(--surface);border:1px solid var(--border);border-radius:12px;margin:1.2rem 0;padding:.9rem 1.2rem;font-size:.95rem}.toc ol{margin:.5rem 0 0;padding-left:1.2rem}.toc .sub{margin-left:1rem;list-style:circle}.callout{background:color-mix(in srgb, var(--danger) 10%, var(--surface));border:1px solid color-mix(in srgb, var(--danger) 40%, var(--border));border-radius:12px;margin:1.5rem 0;padding:.9rem 1.1rem;font-size:.92rem}.sources{color:var(--muted);font-size:.9rem}.faq details{background:var(--surface);border:1px solid var(--border);border-radius:12px;margin:.6rem 0;padding:.1rem 1rem}.faq summary{cursor:pointer;padding:.8rem 0;font-weight:600}.faq details[open] summary{color:var(--primary)}.form{gap:1rem;max-width:520px;display:grid}.form label{gap:.3rem;font-weight:500;display:grid}.form input,.form textarea{background:var(--surface);border:1px solid var(--border);color:var(--text);font:inherit;border-radius:8px;padding:.6rem .8rem}.hp{opacity:0;width:0;height:0;position:absolute;left:-9999px}.site-footer{background:var(--surface);border-top:1px solid var(--border);margin-top:3rem;padding:2.2rem 0 1.5rem;font-size:.92rem}.grid-footer{grid-template-columns:1.4fr 1fr 1fr;gap:2rem;display:grid}.foot-h{margin:0 0 .6rem;font-size:1rem}.site-footer a{color:var(--text)}.license{background:var(--bg);border:1px solid var(--border);border-radius:10px;padding:.7rem .9rem;display:inline-block}.legal{border-top:1px solid var(--border);margin-top:1.5rem;padding-top:1rem}.legal p{margin:0 0 .5rem}@media (width<=760px){.grid-footer{grid-template-columns:1fr}.main-nav{flex-basis:100%;order:3;margin:0}.bar{gap:.6rem}.bar .btn-sm{margin-left:auto}}@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}.card-img{display:block;position:relative;overflow:hidden}.card-img .media{transition:transform .35s}.card:hover .card-img .media{transform:scale(1.04)}.card-img .card-ico,.card-img .card-badge{z-index:1;position:absolute}.card-img .card-ico{top:.7rem;left:.7rem}.card-img .card-badge{top:.7rem;right:.7rem}.card-body h3{margin-bottom:.4rem;font-size:1.1rem}.page-hero{grid-template-columns:1fr;align-items:center;gap:1.2rem;padding:1.4rem 0 1rem;display:grid}.page-hero h1{margin-bottom:.4rem}.page-hero .lede{color:var(--muted);max-width:40rem;font-size:1.05rem}.page-hero-cta{margin:.4rem 0 0}.page-hero .page-hero-media .cover{width:100%;margin:0}@media (width>=900px){.page-hero{grid-template-columns:1.05fr .95fr;gap:2.5rem;padding:2rem 0 1.5rem}}.mobile-cta{display:none}@media (width<=760px){.mobile-cta{z-index:60;padding:.55rem 1rem calc(.55rem + env(safe-area-inset-bottom));background:color-mix(in srgb, var(--bg) 94%, transparent);backdrop-filter:blur(8px);border-top:1px solid var(--border);align-items:center;gap:.6rem;display:flex;position:fixed;bottom:0;left:0;right:0}.mobile-cta-text{white-space:nowrap;text-overflow:ellipsis;flex:1;font-size:.95rem;font-weight:700;overflow:hidden}body{padding-bottom:calc(64px + env(safe-area-inset-bottom))}}@media (prefers-reduced-motion:reduce){.card:hover .card-img .media{transform:none}}body{font-family:Be Vietnam Pro,system-ui,-apple-system,Segoe UI,Roboto,sans-serif}h1,h2,h3,.foot-h{letter-spacing:-.01em;font-weight:800}.site-header{box-shadow:0 1px 0 var(--border);background:#061024;border-bottom:0}.main-nav a{border-radius:999px;padding:.2rem .75rem}.main-nav a:hover{background:var(--surface2);color:var(--accent)}.subnav{background:#0a1730}.subnav .wrap{gap:.5rem}.subnav a{background:var(--surface);border:1px solid var(--border);border-radius:999px;padding:.15rem .7rem}.btn{border-radius:14px;box-shadow:0 4px #b4521a}.btn:hover{transform:translateY(1px);box-shadow:0 3px #b4521a}.btn-ghost{box-shadow:none}.hero.ocean{text-align:center;background:radial-gradient(circle at 12% 30%, #5fd8ee2e 0 6px, transparent 7px), radial-gradient(circle at 85% 22%, #5fd8ee38 0 10px, transparent 11px), radial-gradient(circle at 72% 70%, #5fd8ee24 0 5px, transparent 6px), radial-gradient(circle at 25% 75%, #ff8a3d29 0 8px, transparent 9px), linear-gradient(180deg, #0b2a55 0%, #0a1c3c 55%, var(--bg) 100%);border-bottom:0;padding-bottom:clamp(3.5rem,8vw,6rem);position:relative}.hero-center{max-width:860px}.hero.ocean p.lead{color:#c3d4ee;margin-inline:auto}.pill{color:var(--accent);background:#5fd8ee1f;border:1px solid #5fd8ee59;border-radius:999px;padding:.25rem .9rem;font-size:.85rem;font-weight:600;display:inline-block}.wave{width:100%;height:48px;fill:var(--bg);position:absolute;bottom:-1px;left:0;right:0}.lanes{text-align:left;grid-template-columns:1fr 1fr;gap:1rem;margin-top:1.8rem;display:grid}.lane{color:var(--text);background:linear-gradient(135deg, var(--surface2), var(--surface));border:1px solid var(--border);border-radius:18px;align-items:center;gap:.9rem;padding:1rem 1.1rem;text-decoration:none;transition:transform .15s,border-color .15s;display:flex}.lane:hover{border-color:var(--accent);transform:translateY(-2px)}.lane-ico{background:#ff8a3d26;border-radius:14px;place-items:center;width:3.2rem;height:3.2rem;font-size:2rem;display:grid}.lane strong{font-size:1.15rem;display:block}.lane small{color:var(--muted)}.features.chips li{border-radius:18px;align-items:flex-start;gap:.8rem;display:flex}.features.chips .ico{background:#5fd8ee1f;border-radius:12px;flex:none;place-items:center;width:2.6rem;height:2.6rem;font-size:1.4rem;display:grid}.features.chips h3{margin-bottom:.3rem;font-size:1rem}.features.chips p{margin:0;font-size:.92rem}.tiles{grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}.tiles .card{border-radius:18px}.card:hover{border-color:var(--accent)}.cta-strip{background:#ff8a3d1a;border:1px dashed #ff8a3d80;border-radius:18px;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;margin-top:1.5rem;padding:1rem 1.2rem;display:flex}.cta-strip p{margin:0}.article-list{counter-reset:a;gap:.6rem;margin:0;padding:0;list-style:none;display:grid}.article-list li{counter-increment:a;background:var(--surface);border:1px solid var(--border);border-radius:14px;grid-template-columns:2.4rem 1fr;column-gap:.8rem;padding:.9rem 1rem;display:grid}.article-list li:before{content:counter(a, decimal-leading-zero);color:var(--primary);grid-row:span 2;font-size:1.2rem;font-weight:800}.article-list a{color:var(--text);font-weight:700;text-decoration:none}.article-list a:hover{color:var(--accent)}.article-list .muted{font-size:.9rem}.prose h2{border-top:0;padding-top:0}.prose h2:before{content:"";background:var(--primary);border-radius:4px;width:44px;height:4px;margin-bottom:.7rem;display:block}.prose th{color:var(--accent);background:#10284d}.toc{border-radius:18px}.faq details{border-radius:16px}.site-footer{background:#050d1d}@media (width<=640px){.lanes,.tiles{grid-template-columns:1fr}}.icon{vertical-align:-.2em;flex:none;display:inline-block}.subnav a{align-items:center;gap:.35rem;display:inline-flex}.subnav .icon,.head-row h2 .icon{color:var(--accent)}.lane-ico{color:var(--primary)}.features.chips .ico{color:var(--accent)}.hero.ocean{text-align:left}.hero-two{grid-template-columns:1.15fr .85fr;align-items:center;gap:2.5rem;display:grid}.hero.ocean p.lead{margin-inline:0}.hero-visual{border-radius:28px;justify-self:end;width:100%;max-width:420px;position:relative;overflow:hidden;box-shadow:0 0 0 2px #5fd8ee73,0 0 40px #5fd8ee40,0 30px 60px #00000073}.hero-visual:before{content:"";z-index:1;aspect-ratio:1;pointer-events:none;background:radial-gradient(circle,#ff8a3d59,#0000 70%);border-radius:50%;width:60%;position:absolute;inset:auto -20% -12% auto}.media{object-fit:cover;width:100%;height:auto;display:block}.media-ph{background:radial-gradient(circle at 18% 28%,#5fd8ee40 0 5px,#0000 6px),radial-gradient(circle at 80% 20%,#5fd8ee33 0 9px,#0000 10px),radial-gradient(circle at 68% 76%,#5fd8ee2e 0 4px,#0000 5px),radial-gradient(circle at 30% 82%,#ff8a3d38 0 7px,#0000 8px),linear-gradient(160deg,#12376b 0%,#0c2347 55%,#081631 100%);place-items:center;display:grid;position:relative;overflow:hidden}.media-ph:after{content:"";background:linear-gradient(#0000,#5fd8ee1f);border-top:2px solid #5fd8ee2e;border-radius:50% 50% 0 0/30% 30% 0 0;height:22%;position:absolute;bottom:0;left:0;right:0}.media-ph>img{filter:drop-shadow(0 6px 18px #00000080);max-width:220px;aspect-ratio:auto!important;object-fit:contain!important;width:46%!important;height:auto!important}.media-ph-tall>img{width:62%!important}.card-img{display:block}.card-top{align-items:center;gap:.6rem;margin-bottom:.5rem;display:flex}.card-top:empty{display:none}.card-ico{width:2.4rem;height:2.4rem;color:var(--accent);background:#5fd8ee1f;border-radius:12px;place-items:center;display:grid}.card-body .card-badge{color:var(--primary-text)}.cover.media,.media-ph.cover{border-radius:20px;margin:1rem 0}@media (width<=860px){.hero-two{grid-template-columns:1fr}.hero-visual{justify-self:center;max-width:340px}}.card-img .card-ico{backdrop-filter:blur(4px);background:#071225d9}.card-img .card-badge{background:var(--primary);color:var(--primary-text);border-radius:999px;padding:.1rem .6rem;font-size:.75rem;font-weight:700}
