:root{color-scheme:light;--green:#16a34a;--dark:#163d29;--muted:#668071;--line:#dceddd;--bg:#f8fdf6}
*{box-sizing:border-box}html{min-height:100%;scroll-behavior:smooth}body{margin:0;min-width:320px;font-family:'IBM Plex Sans Thai',sans-serif;color:var(--dark);background:var(--bg);-webkit-font-smoothing:antialiased}
.shell{min-height:100svh;display:flex;flex-direction:column;position:relative;overflow:hidden;background:radial-gradient(ellipse 55% 45% at 50% 49%,#edfbe8 0%,transparent 100%),#f8fdf6}
.shell::before,.shell::after{content:"";position:absolute;border-radius:50%;pointer-events:none;z-index:0}.shell::before{width:470px;height:470px;background:#e9f9df;left:-320px;top:14%}.shell::after{width:570px;height:570px;background:#edf9e5;right:-380px;bottom:-360px}
.site-header,.site-footer{width:min(1120px,calc(100% - 64px));margin-inline:auto;position:relative;z-index:2}.site-header{display:flex;align-items:center;justify-content:space-between;padding-top:32px}.brand{display:flex;align-items:center;gap:13px;text-decoration:none;color:inherit}.brand img{display:block;filter:drop-shadow(0 5px 8px #159d3a1e)}.brand-type{display:flex;flex-direction:column;line-height:1.18}.brand-type strong{font-weight:700;font-size:21px;letter-spacing:-.6px}.brand-type small{font:700 10px/1.5 'DM Sans',sans-serif;letter-spacing:2.4px;color:#40905f;margin-top:3px}.status{border:1px solid #d5ecd8;border-radius:50px;background:#ffffffbb;font:700 11px 'DM Sans',sans-serif;letter-spacing:1.45px;color:#49785a;padding:12px 17px;display:flex;gap:9px;align-items:center}.status-dot,.pill-dot{height:7px;width:7px;border-radius:50%;background:#3ac970;box-shadow:0 0 0 4px #dcfbe0}
.hero{width:min(1120px,calc(100% - 64px));margin:auto;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;z-index:1;position:relative;padding:30px 0 42px}.mascot-stage{position:relative;width:400px;max-width:100%;height:300px;display:grid;place-items:center}.halo{position:absolute;width:255px;height:255px;border-radius:47% 53% 58% 42%/52% 46% 54% 48%;background:#dff8d7;transform:rotate(-12deg);animation:halo 6s ease-in-out infinite}.mascot{width:307px;height:auto;position:relative;z-index:1;filter:drop-shadow(0 16px 18px #398a4530);animation:float 4.5s ease-in-out infinite}.ornament{position:absolute;width:24px;height:24px;color:#94ce61;z-index:2;animation:twinkle 3s ease-in-out infinite}.ornament-a{left:43px;top:95px}.ornament-b{right:52px;top:46px;color:#f2cc69;width:19px;height:19px;animation-delay:1.2s}.overline{font:700 11px 'DM Sans',sans-serif;letter-spacing:2.6px;color:#5a9670;margin:8px 0 14px}h1{font-size:clamp(44px,6vw,72px);line-height:1.25;letter-spacing:-2px;margin:0;font-weight:700}h1 span{color:var(--green)}.intro{max-width:650px;color:var(--muted);font-size:clamp(16px,1.8vw,19px);line-height:1.9;margin:23px auto 23px}.pill{display:inline-flex;gap:11px;align-items:center;border:1px solid #cde9ce;background:#fff;border-radius:50px;color:#367d4d;font-size:13px;font-weight:600;padding:10px 20px;box-shadow:0 12px 30px #438b3010}.site-footer{display:flex;justify-content:space-between;gap:12px;padding:22px 0 26px;font:500 12px 'DM Sans',sans-serif;color:#96a99a;border-top:1px solid #e6efe2}
@keyframes float{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-12px) rotate(1deg)}}@keyframes halo{0%,100%{transform:scale(1) rotate(-12deg)}50%{transform:scale(1.07) rotate(-8deg)}}@keyframes twinkle{0%,100%{opacity:.55;transform:scale(.8)}50%{opacity:1;transform:scale(1.2)}}
@media(max-width:620px){.site-header,.site-footer,.hero{width:calc(100% - 36px)}.site-header{padding-top:20px}.brand-type strong{font-size:18px}.brand img{width:39px;height:39px}.status{font-size:9px;letter-spacing:.9px;padding:10px}.hero{padding:20px 0 42px}.mascot-stage{height:265px}.mascot{width:278px}.halo{width:220px;height:220px}.ornament-a{left:20px}.ornament-b{right:22px}h1{font-size:clamp(37px,9.5vw,54px);letter-spacing:-1.4px}.overline{font-size:9px;letter-spacing:1.55px}.intro{font-size:16px;margin:20px auto}.desktop-break{display:none}.site-footer{justify-content:center;text-align:center;flex-wrap:wrap;gap:4px 15px;font-size:11px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;scroll-behavior:auto!important}}