@import "https://fonts.googleapis.com/css2?family=Noto+Sans+Thai:wght@100;300;400;500;600;700&family=IBM+Plex+Sans+Thai:wght@300;400;500;600;700&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500;600&display=swap";
:root{--c-primary:#5668f2;--c-primary-2:#505fe5;--c-outline:#9fb8f9;--c-pink:#f329a2;--c-grad-a:#e68ce3;--c-grad-b:#6981ff;--c-bg-grad-a:#e9f2ff;--c-bg-grad-b:#feecf8;--c-ink:#272727;--c-ink-2:#4a4a55;--c-mute:#7d8ea5;--c-line:#dde1e8;--c-line-2:#e7eaf1;--c-bg:#fff;--c-bg-soft:#f3f4f6;--c-bg-hi:#f3f7ff;--c-card:#fff;--c-card-soft:#fbfafe;--shadow-sm:0 1px 2px #2727270a, 0 1px 1px #27272708;--shadow-md:0 4px 16px -4px #505fe51a, 0 2px 6px #2727270a;--shadow-lg:0 24px 60px -20px #6981ff47, 0 8px 24px -8px #e68ce329;--shadow-glow:0 0 0 1px #6981ff2e, 0 24px 80px -20px #e68ce366;--radius-sm:8px;--radius-md:14px;--radius-lg:20px;--radius-xl:28px;--radius-2xl:36px;--font-sans:"Noto Sans Thai", "IBM Plex Sans Thai", "Plus Jakarta Sans", system-ui, -apple-system, Segoe UI, sans-serif;--font-display:"Noto Sans Thai", "IBM Plex Sans Thai", "Plus Jakarta Sans", system-ui, -apple-system, Segoe UI, sans-serif;--font-mono:"JetBrains Mono", ui-monospace, SFMono-Regular, monospace;--fs-3xs:9px;--fs-2xs:10px;--fs-xs:11px;--fs-sm:12px;--fs-base:13px;--fs-md:14px;--fs-lg:15px;--fs-xl:16px;--fs-2xl:17px;--fs-3xl:18px;--fs-4xl:22px;--fs-5xl:24px;--fs-6xl:32px;--fs-display:var(--fs-6xl);--fs-title:var(--fs-2xl);--fs-subtitle:var(--fs-lg);--fs-body:var(--fs-md);--fs-label:var(--fs-sm);--fs-caption:var(--fs-xs);--maxw:1240px}[data-mode=dark]{--c-ink:#f3f7ff;--c-ink-2:#c8cedb;--c-mute:#8a93a8;--c-line:#2a2f45;--c-line-2:#232841;--c-bg:#0e0f1a;--c-bg-soft:#14162a;--c-bg-hi:#1b1e36;--c-card:#181b30;--c-card-soft:#1f2240;--shadow-sm:0 1px 2px #0000004d;--shadow-md:0 8px 24px -8px #00000080;--shadow-lg:0 24px 60px -20px #6981ff66, 0 8px 24px -8px #e68ce333;--shadow-glow:0 0 0 1px #6981ff4d, 0 24px 80px -20px #e68ce380}*{box-sizing:border-box}html,body{margin:0;padding:0}body{font-family:var(--font-sans);color:var(--c-ink);background:var(--c-bg);font-size:var(--fs-lg);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;line-height:1.55}h1,h2,h3,h4{font-family:var(--font-display);letter-spacing:-.02em;color:var(--c-ink);margin:0;line-height:1.1}h1{font-weight:800}h2{font-weight:700}h3,h4{font-weight:600}p{color:var(--c-ink-2);margin:0}a{color:inherit;text-decoration:none}button{cursor:pointer;background:0 0;border:none;font-family:inherit}.container{max-width:var(--maxw);margin:0 auto;padding:0 28px}.section-pad{padding:64px 0}.section-pad-sm{padding:40px 0}.btn{font-weight:600;font-size:var(--fs-md);white-space:nowrap;border-radius:999px;align-items:center;gap:8px;padding:11px 20px;transition:transform .15s,box-shadow .2s,filter .2s;display:inline-flex}.btn:hover{transform:translateY(-1px)}.btn:active{transform:translateY(0)}.btn-primary{background:linear-gradient(135deg, var(--c-grad-a) 0%, var(--c-grad-b) 100%);color:#fff;box-shadow:0 8px 20px -6px #6981ff80,inset 0 1px #ffffff4d}.btn-primary:hover{filter:brightness(1.05)}.btn-ghost{color:var(--c-ink);background:var(--c-bg);border:1px solid var(--c-line)}.btn-ghost:hover{border-color:var(--c-outline);background:var(--c-bg-hi)}.btn-soft{color:var(--c-primary-2);background:var(--c-bg-hi);border:1px solid #0000}.btn-soft:hover{background:#e9edfe}.btn-sm{font-size:var(--fs-base);padding:8px 14px}.btn-lg{font-size:var(--fs-lg);padding:14px 26px}.chip{font-size:var(--fs-sm);background:var(--c-bg-hi);color:var(--c-primary-2);border:1px solid #9fb8f966;border-radius:999px;align-items:center;gap:6px;padding:5px 11px;font-weight:500;display:inline-flex}.chip.chip-pink{color:var(--c-pink);background:#feeaf5;border-color:#fcd3e6}[data-mode=dark] .chip{color:#b9c4ff;background:#6981ff1a;border-color:#6981ff40}[data-mode=dark] .chip.chip-pink{background:#f329a21f;border-color:#f329a24d}.card{background:var(--c-card);border:1px solid var(--c-line);border-radius:var(--radius-lg)}.card-soft{background:var(--c-card-soft);border:1px solid var(--c-line);border-radius:var(--radius-lg)}.eyebrow{font-size:var(--fs-base);color:var(--c-primary-2);text-transform:uppercase;letter-spacing:.12em;align-items:center;gap:8px;font-weight:600;display:inline-flex}.eyebrow:before,.eyebrow:after{content:"";background:linear-gradient(90deg, var(--c-grad-a), var(--c-grad-b));border-radius:2px;width:24px;height:1.5px;display:inline-block}.section-title{letter-spacing:-.025em;margin:14px 0;font-size:clamp(32px,4vw,48px);line-height:1.1}.section-sub{font-size:var(--fs-2xl);color:var(--c-mute);max-width:640px}.grad-text{background:linear-gradient(135deg, var(--c-grad-a) 0%, var(--c-grad-b) 100%);color:#0000;-webkit-background-clip:text;background-clip:text}
*{box-sizing:border-box}html,body{margin:0;padding:0}body{font-family:var(--font-sans);color:var(--c-ink);background:var(--c-bg);font-size:var(--fs-lg);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;line-height:1.55;overflow-x:hidden}h1,h2,h3,h4{font-family:var(--font-display);letter-spacing:-.02em;color:var(--c-ink);margin:0;line-height:1.1}h1{font-weight:800}h2{font-weight:700}h3,h4{font-weight:600}p{color:var(--c-ink-2);margin:0}a{color:inherit;text-decoration:none}button{cursor:pointer;background:0 0;border:none;font-family:inherit}:lang(th){letter-spacing:0}.container{max-width:var(--maxw);margin:0 auto;padding:0 28px}.btn{font-weight:600;font-size:var(--fs-md);white-space:nowrap;border-radius:999px;align-items:center;gap:8px;padding:11px 20px;transition:transform .15s,box-shadow .2s,filter .2s;display:inline-flex}.btn:hover{transform:translateY(-1px)}.btn:active{transform:translateY(0)}.btn-primary{background:linear-gradient(135deg, var(--c-grad-a) 0%, var(--c-grad-b) 100%);color:#fff;box-shadow:0 8px 20px -6px #6981ff80,inset 0 1px #ffffff4d}.btn-primary:hover{filter:brightness(1.05);box-shadow:0 12px 28px -6px #6981ff8c,inset 0 1px #ffffff4d}.btn-ghost{color:var(--c-ink);background:var(--c-bg);border:1px solid var(--c-line)}.btn-ghost:hover{border-color:var(--c-outline);background:var(--c-bg-hi)}.btn-soft{color:var(--c-primary-2);background:var(--c-bg-hi);border:1px solid #0000}.btn-soft:hover{background:#e9edfe}.btn-sm{font-size:var(--fs-base);padding:8px 14px}.btn-lg{font-size:var(--fs-lg);padding:14px 26px}.chip{font-size:var(--fs-sm);background:var(--c-bg-hi);color:var(--c-primary-2);border:1px solid color-mix(in srgb, var(--c-outline) 40%, transparent);border-radius:999px;align-items:center;gap:6px;padding:5px 11px;font-weight:500;display:inline-flex}.chip.chip-pink{color:var(--c-pink);background:#feeaf5;border-color:#fcd3e6}[data-mode=dark] .chip.chip-pink{background:#f329a21f;border-color:#f329a24d}[data-mode=dark] .chip{color:#b9c4ff;background:#6981ff1a;border-color:#6981ff40}.card{background:var(--c-card);border:1px solid var(--c-line);border-radius:var(--radius-lg)}section{position:relative}.section-pad{padding:64px 0}.section-pad-sm{padding:40px 0}.eyebrow{font-size:var(--fs-base);color:var(--c-primary-2);text-transform:uppercase;letter-spacing:.12em;align-items:center;gap:8px;font-weight:600;display:inline-flex}.eyebrow:before{content:"";background:linear-gradient(90deg, var(--c-grad-a), var(--c-grad-b));border-radius:2px;width:24px;height:1.5px;display:inline-block}.section-title{letter-spacing:-.025em;margin:14px 0;font-size:clamp(32px,4vw,48px);line-height:1.1}.section-sub{font-size:var(--fs-2xl);color:var(--c-mute);max-width:640px}.grad-text{background:linear-gradient(135deg, var(--c-grad-a) 0%, var(--c-grad-b) 100%);color:#0000;-webkit-background-clip:text;background-clip:text}
.cookie-overlay{z-index:80;max-width:calc(100vw - 48px);animation:.35s cubic-bezier(.2,.7,.2,1) ckIn;position:fixed;bottom:24px;left:24px}@keyframes ckIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.cookie-card{background:var(--c-card);border:1px solid var(--c-line);border-radius:20px;width:420px;max-width:100%;padding:20px;position:relative;box-shadow:0 24px 80px -20px #6981ff4d,0 12px 32px -12px #0000001f}.cookie-card:before{content:"";border-radius:inherit;background:linear-gradient(135deg, color-mix(in srgb, var(--c-grad-a) 30%, transparent), transparent 40%, color-mix(in srgb, var(--c-grad-b) 30%, transparent));z-index:-1;filter:blur(16px);opacity:.55;position:absolute;inset:-1px}.cookie-card-wide{width:480px}.cookie-head{align-items:flex-start;gap:12px;margin-bottom:12px;display:flex}.cookie-icon{background:linear-gradient(135deg, var(--c-grad-a), var(--c-grad-b));color:#fff;border-radius:10px;flex-shrink:0;place-items:center;width:34px;height:34px;display:grid;box-shadow:0 4px 12px -2px #6981ff66}.cookie-title{font-family:var(--font-display);font-size:var(--fs-lg);letter-spacing:-.015em;color:var(--c-ink);font-weight:700;line-height:1.25}.cookie-sub{font-size:var(--fs-xs);color:var(--c-mute);letter-spacing:.02em;margin-top:2px}.cookie-close{background:var(--c-bg-soft);width:28px;height:28px;color:var(--c-mute);font-size:var(--fs-md);cursor:pointer;border-radius:8px;margin-left:auto}.cookie-close:hover{background:var(--c-bg-hi);color:var(--c-primary-2)}.cookie-body{font-size:var(--fs-base);color:var(--c-ink-2);margin-bottom:18px;line-height:1.6}.cookie-body strong{color:var(--c-ink);font-weight:600}.cookie-link{color:var(--c-primary-2);text-decoration:underline;-webkit-text-decoration-color:color-mix(in srgb, var(--c-primary-2) 30%, transparent);text-decoration-color:color-mix(in srgb, var(--c-primary-2) 30%, transparent);font-weight:500}.cookie-link:hover{-webkit-text-decoration-color:var(--c-primary-2);text-decoration-color:var(--c-primary-2)}.cookie-actions{flex-wrap:wrap;justify-content:flex-end;gap:8px;display:flex}.cookie-prefs{flex-direction:column;gap:4px;max-height:320px;margin:4px -4px 18px;display:flex;overflow-y:auto}.cookie-pref{border-radius:10px;justify-content:space-between;align-items:flex-start;gap:12px;padding:12px;transition:background .15s;display:flex}.cookie-pref:hover,.cookie-pref.locked{background:var(--c-bg-soft)}.cookie-pref-text{flex:1}.cookie-pref-title{font-size:var(--fs-base);color:var(--c-ink);align-items:center;gap:8px;margin-bottom:4px;font-weight:700;display:flex}.cookie-pref-lock{font-size:var(--fs-2xs);background:var(--c-bg-hi);color:var(--c-primary-2);letter-spacing:.04em;text-transform:uppercase;border-radius:999px;padding:2px 7px;font-weight:600}.cookie-pref-desc{font-size:var(--fs-sm);color:var(--c-mute);line-height:1.5}.cookie-switch{background:var(--c-line);cursor:pointer;border:none;border-radius:999px;flex-shrink:0;width:38px;height:22px;transition:background .2s;position:relative}.cookie-switch.on{background:linear-gradient(135deg, var(--c-grad-a), var(--c-grad-b))}.cookie-switch.locked{background:linear-gradient(135deg, color-mix(in srgb, var(--c-grad-a) 50%, var(--c-mute)), color-mix(in srgb, var(--c-grad-b) 50%, var(--c-mute)));cursor:not-allowed;opacity:.85}.cookie-switch-knob{background:#fff;border-radius:50%;width:16px;height:16px;transition:transform .2s cubic-bezier(.4,.2,.2,1);position:absolute;top:3px;left:3px;box-shadow:0 1px 3px #0003}.cookie-switch.on .cookie-switch-knob{transform:translate(16px)}@media (max-width:520px){.cookie-overlay{max-width:none;bottom:16px;left:16px;right:16px}.cookie-card,.cookie-card-wide{width:100%}.cookie-actions{justify-content:stretch}.cookie-actions .btn{flex:1;justify-content:center}}