@import"https://fonts.googleapis.com/css2?family=Inter:wght@300&family=Noto+Sans+Thai:wght@300;500&display=swap";html,body{font-family:Inter,Noto Sans Thai,sans-serif;height:100%;width:100%;margin:0;padding:0;background:#1A1A1A;color:#fff}.hero-bg{background:linear-gradient(195.96deg,#FF6576 -15.44%,#83027E 196.39%),#E0E0E0}.video{aspect-ratio:16 / 9}.square{aspect-ratio:1 / 1}.anim-cir{transform-origin:center;animation:cir-anim 1s cubic-bezier(.37,0,0,1)}.anim-box{animation:box-anim 2s cubic-bezier(.37,0,0,1)}.anim-text{animation:text-anim 2s cubic-bezier(.37,0,0,1)}@keyframes text-anim{0%{transform:translate(-5px);opacity:0}to{transform:translate(1);opacity:1}}@keyframes box-anim{0%{opacity:0;transform:rotate(90deg)}to{opacity:1;transform:rotate(360deg)}}@keyframes cir-anim{0%{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}.custom::part(saturation){display:none}.custom::part(hue){border-radius:8px}@media (max-width: 1024px){.preview-product:nth-child(5){display:none}}.bg-hsl-s{background:hsl(var(--b),10%,15%)}.bg-hsl-p{background:hsl(var(--b),55%,45%)}.text-hsl-p{color:hsl(var(--b),55%,45%)}.bg-hsl-b{background:hsl(var(--b),10%,10%)}*,: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-ring-offset-shadow:0 0 rgba(0,0,0,0);--un-ring-shadow:0 0 rgba(0,0,0,0);--un-shadow-inset: ;--un-shadow:0 0 rgba(0,0,0,0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgba(147,197,253,.5)}::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-ring-offset-shadow:0 0 rgba(0,0,0,0);--un-ring-shadow:0 0 rgba(0,0,0,0);--un-shadow-inset: ;--un-shadow:0 0 rgba(0,0,0,0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgba(147,197,253,.5)}.px-12{padding-left:3rem;padding-right:3rem}.px-4{padding-left:1rem;padding-right:1rem}.px-5{padding-left:1.25rem;padding-right:1.25rem}.px-8{padding-left:2rem;padding-right:2rem}.py-10{padding-top:2.5rem;padding-bottom:2.5rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.py-32{padding-top:8rem;padding-bottom:8rem}.py-4{padding-top:1rem;padding-bottom:1rem}.py-8{padding-top:2rem;padding-bottom:2rem}.pb-30{padding-bottom:7.5rem}.m-0{margin:0}.mx-auto{margin-left:auto;margin-right:auto}.my-48{margin-top:12rem;margin-bottom:12rem}.mb-12{margin-bottom:3rem}.ml-auto{margin-left:auto}.mt-\[-4rem\]{margin-top:-4rem}.mt-1{margin-top:.25rem}.mt-2{margin-top:.5rem}.mt-3{margin-top:.75rem}.mt-4{margin-top:1rem}.mt-8{margin-top:2rem}.hidden{display:none}.hover\:opacity-80:hover{opacity:.8}.opacity-50{opacity:.5}.opacity-60{opacity:.6}.bg-\[\#262626\]{--un-bg-opacity:1;background-color:rgba(38,38,38,var(--un-bg-opacity))}.bg-white{--un-bg-opacity:1;background-color:rgba(255,255,255,var(--un-bg-opacity))}.hover\:bg-\[\#303030\]:hover{--un-bg-opacity:1;background-color:rgba(48,48,48,var(--un-bg-opacity))}.border-3{border-width:3px}.border-\[\#DC4979\]\/30{border-color:#dc49794d}.border-white\/10{border-color:#ffffff1a}.rounded-lg{border-radius:.5rem}.rounded-xl{border-radius:.75rem}.text-2xl{font-size:1.5rem;line-height:2rem}.text-3xl{font-size:1.875rem;line-height:2.25rem}.text-4xl{font-size:2.25rem;line-height:2.5rem}.text-5xl{font-size:3rem;line-height:1}.text-base{font-size:1rem;line-height:1.5rem}.text-lg{font-size:1.125rem;line-height:1.75rem}.text-sm{font-size:.875rem;line-height:1.25rem}.text-xl{font-size:1.25rem;line-height:1.75rem}.font-bold{font-weight:700}.font-medium{font-weight:500}.font-semibold{font-weight:600}.no-underline{text-decoration:none}.text-shadow{--un-text-shadow:0 0 1px var(--un-text-shadow-color, rgba(0,0,0,.2)),0 0 1px var(--un-text-shadow-color, rgba(1,0,5,.1));text-shadow:var(--un-text-shadow)}.text-center{text-align:center}.text-\[\#DC4979\]{--un-text-opacity:1;color:rgba(220,73,121,var(--un-text-opacity))}.text-white{--un-text-opacity:1;color:rgba(255,255,255,var(--un-text-opacity))}.text-white\/30{color:#ffffff4d}.text-white\/60{color:#fff9}.flex{display:flex}.flex-1{flex:1 1 0%}.grid{display:grid}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.gap-12{grid-gap:3rem;gap:3rem}.gap-2{grid-gap:.5rem;gap:.5rem}.gap-4{grid-gap:1rem;gap:1rem}.gap-5{grid-gap:1.25rem;gap:1.25rem}.absolute{position:absolute}.relative{position:relative}.h-\[30px\]{height:30px}.h-20{height:5rem}.h-64{height:16rem}.h-auto{height:auto}.h-full{height:100%}.max-w-3xl{max-width:48rem}.max-w-7xl{max-width:80rem}.w-full{width:100%}.cursor-pointer{cursor:pointer}.select-none{user-select:none}.justify-start{justify-content:flex-start}.justify-end{justify-content:flex-end}.justify-center{justify-content:center}.items-center{align-items:center}.bottom-\[-1\.2rem\]{bottom:-1.2rem}.left-1\/2{left:50%}.transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-opacity{transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.-translate-x-1\/2{--un-translate-x:-50%;transform:translate(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)) rotate(var(--un-rotate-z)) skew(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z))}.hover\:scale-98:hover{--un-scale-x:.98;--un-scale-y:.98;transform:translate(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)) rotate(var(--un-rotate-z)) skew(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z))}.active\:\!scale-95:active{--un-scale-x:.95 !important;--un-scale-y:.95 !important;transform:translate(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)) rotate(var(--un-rotate-z)) skew(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z))!important}.transform{transform:translate(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)) rotate(var(--un-rotate-z)) skew(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z))}@media (min-width: 640px){.sm\:px-6{padding-left:1.5rem;padding-right:1.5rem}}@media (min-width: 768px){.md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.md\:w-auto{width:auto}}@media (min-width: 1024px){.lg\:text-6xl{font-size:3.75rem;line-height:1}.lg\:leading-18{line-height:4.5rem}.lg\:flex{display:flex}.lg\:grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}}@media (min-width: 1280px){.xl\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}}