*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; font-family: var(--wsb-font-body, Inter, sans-serif, sans-serif); }
h1, h2, h3, h4, h5, h6 { font-family: var(--wsb-font-heading, inherit); }
:root { --primary: #1976d2; --wsb-color-primary: #6C2BD9; --wsb-color-secondary: #A78BFA; --wsb-color-accent: #FF5A5F; --wsb-color-ink: #1E1A33; --wsb-color-surface: #FFFFFF; --wsb-color-background: #F6F3FF; --wsb-font-heading: Poppins, "Noto Sans Thai", sans-serif; --wsb-font-body: Inter, "Noto Sans Thai", sans-serif; --wsb-radius: 16px; }
/* Sticky footer: full-viewport flex column with the page body growing, so a
   short page pins the global footer to the bottom — mirrors Preview/Designer.
   The white page background matches the Preview page surface (bgcolor #fff).
   overflow-x:clip mirrors the Preview page surface (data-preview-page has
   overflow:hidden) so entrance animations that translateX off-canvas
   (wsb-slide-left/right) don't add a horizontal scrollbar. Uses clip, not
   hidden: clip doesn't create a scroll container, so the sticky navbar and
   vertical page scroll keep working. */
#root { display: flex; flex-direction: column; min-height: 100vh; background: #fff; overflow-x: clip; }
.wsb-page-main { flex: 1 1 auto; display: flex; flex-direction: column; min-height: 0; }
/* layer: preflights */
*,::before,::after{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 rgb(0 0 0 / 0);--un-ring-shadow:0 0 rgb(0 0 0 / 0);--un-shadow-inset: ;--un-shadow:0 0 rgb(0 0 0 / 0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgb(147 197 253 / 0.5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: ;}::backdrop{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 rgb(0 0 0 / 0);--un-ring-shadow:0 0 rgb(0 0 0 / 0);--un-shadow-inset: ;--un-shadow:0 0 rgb(0 0 0 / 0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgb(147 197 253 / 0.5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: ;}
/* layer: default */
.root-relative:root{position:relative;}
.m16{margin:4rem;}
.h-\[100\%\]{height:100%;}
.h-\[280px\]{height:280px;}
.h-\[320px\]{height:320px;}
.h-\[340px\]{height:340px;}
.h-\[360px\]{height:360px;}
.h-\[400px\]{height:400px;}
.h-\[44px\]{height:44px;}
.h-\[56px\]{height:56px;}
.w-\[100\%\]{width:100%;}
.w-\[20px\]{width:20px;}
.w-\[320px\]{width:320px;}
.w-\[44px\]{width:44px;}
.w-\[56px\]{width:56px;}
.w-\[fit-content\]{width:fit-content;}
.flex{display:flex;}
.grow{flex-grow:1;}
.transform{transform:translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));}
.items-center{align-items:center;}
.items-stretch{align-items:stretch;}
.justify-between{justify-content:space-between;}
.gap-\[0px\]{gap:0px;}
.gap-\[10px\]{gap:10px;}
.gap-\[12px\]{gap:12px;}
.gap-\[14px\]{gap:14px;}
.gap-\[16px\]{gap:16px;}
.gap-\[18px\]{gap:18px;}
.gap-\[20px\]{gap:20px;}
.gap-\[22px\]{gap:22px;}
.gap-\[24px\]{gap:24px;}
.gap-\[32px\]{gap:32px;}
.gap-\[36px\]{gap:36px;}
.gap-\[40px\]{gap:40px;}
.gap-\[4px\]{gap:4px;}
.gap-\[56px\]{gap:56px;}
.gap-\[6px\]{gap:6px;}
.border-\[1px\]{border-width:1px;}
.rounded-\[10px\]{border-radius:10px;}
.rounded-\[20px\]{border-radius:20px;}
.rounded-\[22px\]{border-radius:22px;}
.rounded-\[24px\]{border-radius:24px;}
.rounded-\[8px\]{border-radius:8px;}
.rounded-\[999px\]{border-radius:999px;}
.border-solid{border-style:solid;}
.p-\[0px\]{padding:0px;}
.p-\[24px\]{padding:24px;}
.pb-\[12px\]{padding-bottom:12px;}
.pb-\[14px\]{padding-bottom:14px;}
.pb-\[16px\]{padding-bottom:16px;}
.pb-\[24px\]{padding-bottom:24px;}
.pb-\[28px\]{padding-bottom:28px;}
.pb-\[30px\]{padding-bottom:30px;}
.pb-\[40px\]{padding-bottom:40px;}
.pb-\[4px\]{padding-bottom:4px;}
.pb-\[80px\]{padding-bottom:80px;}
.pb-\[88px\]{padding-bottom:88px;}
.pb-\[8px\]{padding-bottom:8px;}
.pl-\[0px\]{padding-left:0px;}
.pl-\[10px\]{padding-left:10px;}
.pl-\[20px\]{padding-left:20px;}
.pl-\[22px\]{padding-left:22px;}
.pl-\[24px\]{padding-left:24px;}
.pl-\[26px\]{padding-left:26px;}
.pl-\[28px\]{padding-left:28px;}
.pl-\[40px\]{padding-left:40px;}
.pr-\[0px\]{padding-right:0px;}
.pr-\[10px\]{padding-right:10px;}
.pr-\[20px\]{padding-right:20px;}
.pr-\[22px\]{padding-right:22px;}
.pr-\[24px\]{padding-right:24px;}
.pr-\[26px\]{padding-right:26px;}
.pr-\[28px\]{padding-right:28px;}
.pr-\[40px\]{padding-right:40px;}
.pt-\[12px\]{padding-top:12px;}
.pt-\[14px\]{padding-top:14px;}
.pt-\[16px\]{padding-top:16px;}
.pt-\[28px\]{padding-top:28px;}
.pt-\[30px\]{padding-top:30px;}
.pt-\[4px\]{padding-top:4px;}
.pt-\[64px\]{padding-top:64px;}
.pt-\[80px\]{padding-top:80px;}
.pt-\[88px\]{padding-top:88px;}
.pt-\[8px\]{padding-top:8px;}
.text-center{text-align:center;}
.text-\[11px\]{font-size:11px;}
.text-\[13px\]{font-size:13px;}
.text-\[14px\]{font-size:14px;}
.text-\[15px\]{font-size:15px;}
.text-\[16px\]{font-size:16px;}
.text-\[17px\]{font-size:17px;}
.text-\[18px\]{font-size:18px;}
.text-\[22px\]{font-size:22px;}
.text-\[30px\]{font-size:30px;}
.text-\[32px\]{font-size:32px;}
.text-\[34px\]{font-size:34px;}
.text-\[36px\]{font-size:36px;}
.text-\[42px\]{font-size:42px;}
.text-\[50px\]{font-size:50px;}
.font-500{font-weight:500;}
.font-600{font-weight:600;}
.font-700{font-weight:700;}
.font-800{font-weight:800;}
.shadow-lg{--un-shadow:var(--un-shadow-inset) 0 10px 15px -3px var(--un-shadow-color, rgb(0 0 0 / 0.1)),var(--un-shadow-inset) 0 4px 6px -4px var(--un-shadow-color, rgb(0 0 0 / 0.1));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);}
.shadow-sm{--un-shadow:var(--un-shadow-inset) 0 1px 2px 0 var(--un-shadow-color, rgb(0 0 0 / 0.05));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);}
.shadow-xl{--un-shadow:var(--un-shadow-inset) 0 20px 25px -5px var(--un-shadow-color, rgb(0 0 0 / 0.1)),var(--un-shadow-inset) 0 8px 10px -6px var(--un-shadow-color, rgb(0 0 0 / 0.1));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);}
.ease{transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);}
/* Responsive overrides (spacing + typography) — desktop-first cascade. */
@media (max-width: 991px){[data-render-section-id="sec_otcsx9eiul83"]{padding-top:64px!important;padding-right:28px!important;padding-bottom:64px!important;padding-left:28px!important}[data-render-section-id="sec_lda9d14tul83"]{padding-top:56px!important;padding-right:28px!important;padding-bottom:56px!important;padding-left:28px!important}[data-render-section-id="sec_xrhml7hsul83"]{padding-top:56px!important;padding-right:28px!important;padding-bottom:56px!important;padding-left:28px!important}[data-render-section-id="sec_5b7mobvvul83"]{padding-top:56px!important;padding-right:28px!important;padding-bottom:56px!important;padding-left:28px!important}[data-render-section-id="sec_at3eosgvul83"]{padding-top:56px!important;padding-right:28px!important;padding-bottom:56px!important;padding-left:28px!important}[data-render-section-id="sec_n4264q1cul83"]{padding-top:56px!important;padding-right:28px!important;padding-bottom:56px!important;padding-left:28px!important}[data-render-section-id="sec_fej9red9ul83"]{padding-top:56px!important;padding-right:28px!important;padding-bottom:56px!important;padding-left:28px!important}[data-render-section-id="sec_9vwnzk2dul83"]{padding-top:56px!important;padding-right:28px!important;padding-bottom:56px!important;padding-left:28px!important}[data-render-section-id="sec_lihr1kbmul83"]{padding-top:56px!important;padding-right:28px!important;padding-bottom:56px!important;padding-left:28px!important}[data-render-section-id="sec_l18zpipxul83"]{padding-top:56px!important;padding-right:28px!important;padding-bottom:56px!important;padding-left:28px!important}[data-render-section-id="sec_btcgu884ul83"]{padding-top:56px!important;padding-right:28px!important;padding-bottom:56px!important;padding-left:28px!important}}
@media (max-width: 767px){[data-render-id="el_nkn5es78ul85"] > *{font-size:18px!important}}
@media (max-width: 479px){[data-render-section-id="sec_otcsx9eiul83"]{padding-top:48px!important;padding-right:20px!important;padding-bottom:48px!important;padding-left:20px!important}[data-render-section-id="sec_otcsx9eiul83"] > [data-section-content]{gap:36px!important;flex-direction:column!important}[data-render-section-id="sec_d2mkyabpul83"]{padding-top:48px!important;padding-right:20px!important;padding-bottom:48px!important;padding-left:20px!important}[data-render-id="el_k37xlfl4ul83"] > *{flex-direction:column!important}[data-render-section-id="sec_lda9d14tul83"]{padding-top:44px!important;padding-right:20px!important;padding-bottom:44px!important;padding-left:20px!important}[data-render-section-id="sec_lda9d14tul83"] > [data-section-content]{gap:32px!important;flex-direction:column!important}[data-render-section-id="sec_xrhml7hsul83"]{padding-top:44px!important;padding-right:20px!important;padding-bottom:44px!important;padding-left:20px!important}[data-render-section-id="sec_xrhml7hsul83"] > [data-section-content]{gap:32px!important;flex-direction:column!important}[data-render-section-id="sec_5b7mobvvul83"]{padding-top:48px!important;padding-right:20px!important;padding-bottom:48px!important;padding-left:20px!important}[data-render-section-id="sec_5b7mobvvul83"] > [data-section-content]{gap:32px!important;flex-direction:column!important}[data-render-section-id="sec_at3eosgvul83"]{padding-top:44px!important;padding-right:20px!important;padding-bottom:44px!important;padding-left:20px!important}[data-render-section-id="sec_at3eosgvul83"] > [data-section-content]{gap:32px!important;flex-direction:column!important}[data-render-id="el_w59fm00vul83"] > *{flex-direction:column!important}[data-render-section-id="sec_f81onjn9ul83"]{padding-top:48px!important;padding-right:20px!important;padding-bottom:48px!important;padding-left:20px!important}[data-render-id="el_zn90fjvrul83"] > *{flex-direction:column!important}[data-render-id="el_4kdjrx0sul83"] > *{flex-direction:column!important}[data-render-id="el_4h3nnx81ul83"] > *{flex-direction:column!important}[data-render-section-id="sec_n4264q1cul83"]{padding-top:48px!important;padding-right:20px!important;padding-bottom:48px!important;padding-left:20px!important}[data-render-section-id="sec_n4264q1cul83"] > [data-section-content]{gap:32px!important;flex-direction:column!important}[data-render-section-id="sec_mv1i90keul83"]{padding-top:48px!important;padding-right:20px!important;padding-bottom:48px!important;padding-left:20px!important}[data-render-id="el_nx93j9kjul83"] > *{flex-direction:column!important}[data-render-section-id="sec_fej9red9ul83"]{padding-top:44px!important;padding-right:20px!important;padding-bottom:44px!important;padding-left:20px!important}[data-render-section-id="sec_fej9red9ul83"] > [data-section-content]{gap:32px!important;flex-direction:column!important}[data-render-section-id="sec_9vwnzk2dul83"]{padding-top:44px!important;padding-right:20px!important;padding-bottom:44px!important;padding-left:20px!important}[data-render-section-id="sec_9vwnzk2dul83"] > [data-section-content]{gap:32px!important;flex-direction:column!important}[data-render-section-id="sec_lihr1kbmul83"]{padding-top:48px!important;padding-right:20px!important;padding-bottom:48px!important;padding-left:20px!important}[data-render-section-id="sec_lihr1kbmul83"] > [data-section-content]{gap:32px!important;flex-direction:column!important}[data-render-id="el_yt92cok4ul83"] > *{flex-direction:column!important}[data-render-section-id="sec_l18zpipxul83"]{padding-top:44px!important;padding-right:20px!important;padding-bottom:44px!important;padding-left:20px!important}[data-render-section-id="sec_l18zpipxul83"] > [data-section-content]{gap:32px!important;flex-direction:column!important}[data-render-id="el_skcji90xul83"] > *{flex-direction:column!important}[data-render-section-id="sec_5cfuzcroul83"]{padding-top:48px!important;padding-right:20px!important;padding-bottom:48px!important;padding-left:20px!important}[data-render-id="el_0n69ckudul83"] > *{flex-direction:column!important}[data-render-section-id="sec_btcgu884ul83"]{padding-top:48px!important;padding-right:20px!important;padding-bottom:48px!important;padding-left:20px!important}[data-render-section-id="sec_btcgu884ul83"] > [data-section-content]{gap:32px!important;flex-direction:column!important}[data-render-id="el_fehj0xc8ul83"] > *{flex-direction:column!important}[data-render-id="el_ig6zvn3gul85"] > *{gap:28px!important;flex-direction:column!important}}