.payment-page{--pay-blue: #3d7bff;--pay-deep: #0a2ece;--pay-navy: #071b4e;--pay-sky: #75b7ff;--pay-pale: #e8f1ff;color:var(--pay-navy)}.payment-hero{background:linear-gradient(180deg,#f2f7fff5,#ffffffeb 76%),radial-gradient(circle at 72% 26%,rgba(61,123,255,.16),transparent 34%)}.payment-hero:before{position:absolute;inset:0;background-image:linear-gradient(rgba(10,46,206,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(10,46,206,.035) 1px,transparent 1px);background-size:44px 44px;mask-image:linear-gradient(to bottom,black,transparent 82%);content:"";pointer-events:none}.payment-orb{position:absolute;border:1px solid rgba(61,123,255,.13);border-radius:999px;pointer-events:none}.payment-orb--one{top:6rem;right:-7rem;width:27rem;height:27rem;box-shadow:inset 0 0 0 2.7rem #e8f1ff61}.payment-orb--two{bottom:2rem;left:-5rem;width:11rem;height:11rem;box-shadow:inset 0 0 0 1.2rem #75b7ff14}.payment-status{display:inline-flex;align-items:center;gap:.65rem;border:1px solid rgba(61,123,255,.18);border-radius:999px;background:#ffffffd1;padding:.58rem .88rem;color:var(--pay-deep);font-size:.75rem;font-weight:800;box-shadow:0 14px 40px -28px #0a2ece8c;backdrop-filter:blur(14px)}.payment-status__pulse{position:relative;width:.48rem;height:.48rem;border-radius:999px;background:#16a66a;box-shadow:0 0 0 .28rem #16a66a1a}.payment-page h1>span{display:block;background:linear-gradient(100deg,var(--pay-blue),var(--pay-deep));background-clip:text;color:transparent}.payment-button{display:inline-flex;min-height:3.15rem;align-items:center;justify-content:center;gap:.6rem;border-radius:999px;padding:.82rem 1.55rem;font-size:.875rem;font-weight:800;text-align:center;transition:transform .25s ease,border-color .25s ease,background-color .25s ease,box-shadow .25s ease}.payment-button:hover{transform:translateY(-2px)}.payment-button svg{width:1rem;height:1rem}.payment-button--primary{background:linear-gradient(105deg,var(--pay-blue),var(--pay-deep));color:#fff!important;box-shadow:0 22px 44px -26px #0a2eceb3}.payment-button--primary:hover{box-shadow:0 25px 48px -24px #0a2eced1}.payment-button--secondary{border:1px solid rgba(10,46,206,.17);background:#ffffffdb;color:var(--pay-navy)}.payment-button--secondary:hover{border-color:#0a2ece57;color:var(--pay-deep)}.payment-mini-proof{border-left:1px solid rgba(61,123,255,.2);padding-left:.8rem}.payment-mini-proof strong,.payment-mini-proof span{display:block}.payment-mini-proof strong{color:var(--pay-deep);font-family:Inter,sans-serif;font-size:.75rem;letter-spacing:.045em}.payment-mini-proof span{margin-top:.18rem;color:#62779a;font-size:.72rem;font-weight:600}.payment-art-shell{position:relative;isolation:isolate;border:1px solid rgba(61,123,255,.16);border-radius:1.65rem;background:#ffffffd1;padding:.72rem;box-shadow:0 38px 90px -55px #071b4e75,0 18px 42px -32px #0a2ece47;backdrop-filter:blur(20px)}.payment-art-shell:after{position:absolute;inset:auto 12% -12%;z-index:-1;height:28%;border-radius:999px;background:#3d7bff33;filter:blur(42px);content:""}.payment-art-top{display:flex;min-height:2.6rem;align-items:center;gap:.8rem;padding:0 .55rem;color:#7890b3;font-family:Inter,sans-serif;font-size:.58rem;font-style:normal;letter-spacing:.08em}.payment-art-top>span{display:flex;gap:.3rem}.payment-art-top i{display:block;width:.42rem;height:.42rem;border-radius:999px;background:#c7d9fa}.payment-art-top em{flex:1;font-style:normal}.payment-art-top b{border-radius:999px;background:#e7f8f0;padding:.28rem .48rem;color:#137956;font-weight:800}.payment-art-shell picture{display:block;overflow:hidden;border-radius:1.1rem;background:var(--pay-pale)}.payment-art{display:block;width:100%;height:auto}.payment-art-badge{position:absolute;z-index:3;display:flex;align-items:center;gap:.7rem;border:1px solid rgba(61,123,255,.14);border-radius:1rem;background:#ffffffed;padding:.64rem .76rem;box-shadow:0 18px 40px -25px #071b4e80;backdrop-filter:blur(14px)}.payment-art-badge--left{bottom:11%;left:-3%}.payment-art-badge--right{top:18%;right:-3%}.payment-art-badge>span{display:grid;width:2.05rem;height:2.05rem;place-items:center;border-radius:.7rem;background:var(--pay-pale);color:var(--pay-deep);font-family:Inter,sans-serif;font-size:.68rem;font-weight:800}.payment-art-badge--right>span{background:#e0f8ec;color:#11865b}.payment-art-badge svg{width:1.05rem;height:1.05rem}.payment-art-badge small,.payment-art-badge strong{display:block}.payment-art-badge small{color:#8999b6;font-family:Inter,sans-serif;font-size:.48rem;letter-spacing:.08em}.payment-art-badge strong{margin-top:.1rem;color:var(--pay-navy);font-size:.68rem}.payment-positioning strong{color:var(--pay-deep);font-size:.82rem}.payment-positioning span{position:relative;padding-left:1rem;color:#647795;font-size:.78rem;font-weight:600}.payment-positioning span:before{position:absolute;top:.5em;left:0;width:.36rem;height:.36rem;border-radius:999px;background:var(--pay-sky);content:""}.payment-flow-section{background:radial-gradient(circle at 48% 50%,rgba(61,123,255,.09),transparent 34%),linear-gradient(180deg,#f7faff,#fff)}.payment-eyebrow{color:var(--pay-deep);font-family:Inter,sans-serif;font-size:.7rem;font-weight:800;letter-spacing:.13em}.payment-pipeline{position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.7rem;margin-top:3.5rem}.payment-pipeline__track{position:absolute;top:2rem;right:9%;left:9%;z-index:0;height:.28rem;overflow:hidden;border-radius:999px;background:#dbe8ff}.payment-pipeline__progress{position:absolute;inset:0;transform-origin:left center;border-radius:inherit;background:linear-gradient(90deg,var(--pay-sky),var(--pay-blue),var(--pay-deep));animation:payment-fill 5.2s cubic-bezier(.22,1,.36,1) infinite}.payment-pipeline__packet{position:absolute;top:50%;left:0;width:.68rem;height:.68rem;transform:translate3d(-100%,-50%,0);border:2px solid #fff;border-radius:999px;background:var(--pay-deep);box-shadow:0 0 0 .24rem #3d7bff29;animation:payment-packet 5.2s linear infinite}.payment-pipeline__packet--two{animation-delay:-2.6s;background:var(--pay-sky)}.payment-flow-card{position:relative;z-index:1;padding:0 .38rem}.payment-flow-node{display:grid;width:4.25rem;height:4.25rem;margin-inline:auto;place-items:center;border:.42rem solid #f8fbff;border-radius:1.45rem;background:linear-gradient(145deg,var(--pay-blue),var(--pay-deep));color:#fff;box-shadow:0 14px 34px -21px #0a2eced1}.payment-flow-node svg{width:1.45rem;height:1.45rem}.payment-flow-copy{margin-top:1.25rem;border:1px solid rgba(61,123,255,.12);border-radius:1.15rem;background:#ffffffdb;padding:1.15rem;box-shadow:0 18px 42px -34px #071b4e59}.payment-flow-meta{display:flex;align-items:center;gap:.55rem}.payment-flow-meta span{color:var(--pay-deep);font-family:Inter,sans-serif;font-size:.68rem;font-weight:800}.payment-flow-meta em{color:#8193b2;font-family:Inter,sans-serif;font-size:.5rem;font-style:normal;font-weight:700;letter-spacing:.055em}.payment-flow-copy h3{margin-top:.65rem;color:var(--pay-navy);font-size:1rem;font-weight:800;line-height:1.55}.payment-flow-copy p{margin-top:.45rem;color:#667994;font-size:.78rem;line-height:1.75}.payment-disclosure{display:flex;gap:.8rem;margin-top:1.2rem;border:1px solid rgba(61,123,255,.16);border-radius:1rem;background:#e8f1ff8f;padding:1rem 1.1rem}.payment-disclosure svg{width:1.2rem;height:1.2rem;flex:none;margin-top:.18rem;color:var(--pay-deep)}.payment-disclosure p{color:#5c7192;font-size:.78rem;line-height:1.75}.payment-disclosure strong{color:var(--pay-navy)}.payment-benefit{border:1px solid #e0eaff;border-radius:1.3rem;background:#fff;padding:1.35rem;box-shadow:0 22px 55px -44px #071b4e6b;transition:transform .28s ease,border-color .28s ease,box-shadow .28s ease}.payment-benefit:hover{transform:translateY(-4px);border-color:#3d7bff4d;box-shadow:0 28px 60px -42px #0a2ece6b}.payment-benefit>span{display:grid;width:2.85rem;height:2.85rem;place-items:center;border-radius:.95rem;background:linear-gradient(145deg,#edf4ff,#fff);color:var(--pay-deep);box-shadow:inset 0 0 0 1px #3d7bff1a}.payment-benefit svg{width:1.35rem;height:1.35rem}.payment-benefit h3{margin-top:1.2rem;color:var(--pay-navy);font-size:1.08rem;font-weight:800;line-height:1.55}.payment-benefit p{margin-top:.55rem;color:#667994;font-size:.84rem;line-height:1.8}.payment-comparison-section{background:linear-gradient(rgba(10,46,206,.028) 1px,transparent 1px),linear-gradient(90deg,rgba(10,46,206,.028) 1px,transparent 1px),#f6f9ff;background-size:40px 40px}.payment-text-link{display:inline-flex;align-items:center;gap:.55rem;margin-top:1.4rem;color:var(--pay-deep);font-size:.82rem;font-weight:800}.payment-text-link span{transition:transform .2s ease}.payment-text-link:hover span{transform:translate(3px)}.payment-comparison{overflow:hidden;border:1px solid #dfe9fb;border-radius:1.35rem;background:#fff;box-shadow:0 24px 65px -48px #071b4e73}.payment-comparison__head,.payment-comparison__row{display:grid;grid-template-columns:.72fr .9fr 1.18fr;align-items:center}.payment-comparison__head{background:var(--pay-navy);color:#fff}.payment-comparison__head span{padding:1rem;font-size:.72rem;font-weight:800}.payment-comparison__head span:last-child{background:#3d7bff38}.payment-comparison__row{border-top:1px solid #e6eefc}.payment-comparison__row>*{min-width:0;padding:1rem;font-size:.78rem;line-height:1.65}.payment-comparison__row strong{color:var(--pay-navy)}.payment-comparison__row>span:nth-child(2){color:#788aa5}.payment-comparison__row>span:last-child{display:flex;align-items:flex-start;gap:.55rem;color:#284575;font-weight:600}.payment-comparison__row i{display:grid;width:1.3rem;height:1.3rem;flex:none;place-items:center;border-radius:999px;background:#e3f8ee;color:#14885e}.payment-comparison__row i svg{width:.8rem;height:.8rem}.payment-use-cases{display:grid;overflow:hidden;border:1px solid #e1eaf9;border-radius:1.35rem;background:#fff;grid-template-columns:repeat(2,minmax(0,1fr))}.payment-use-case{display:grid;grid-template-columns:auto 1fr auto;align-items:start;gap:.95rem;border-bottom:1px solid #e8effb;padding:1.35rem;transition:background-color .24s ease}.payment-use-case:nth-child(odd){border-right:1px solid #e8effb}.payment-use-case:nth-last-child(-n+2){border-bottom:0}.payment-use-case:hover{background:#f7faff}.payment-use-case>span{color:var(--pay-blue);font-family:Inter,sans-serif;font-size:.66rem;font-weight:800}.payment-use-case h3{color:var(--pay-navy);font-size:1rem;font-weight:800;line-height:1.55}.payment-use-case p{margin-top:.35rem;color:#6a7c97;font-size:.8rem;line-height:1.7}.payment-use-case>svg{width:1rem;height:1rem;color:#9eb1ce;transition:transform .22s ease,color .22s ease}.payment-use-case:hover>svg{transform:translate(2px,-2px);color:var(--pay-deep)}.payment-seo-section{background:linear-gradient(180deg,#f7faff,#fff)}.payment-seo-summary{align-self:start;border:1px solid rgba(61,123,255,.17);border-radius:1.35rem;background:radial-gradient(circle at 84% 14%,rgba(117,183,255,.25),transparent 26%),#fff;padding:1.55rem;box-shadow:0 25px 65px -50px #0a2ece73}.payment-seo-summary>span{color:var(--pay-blue);font-family:Inter,sans-serif;font-size:.63rem;font-weight:800;letter-spacing:.12em}.payment-seo-summary h2{margin-top:.8rem;color:var(--pay-navy);font-size:1.75rem;font-weight:800;line-height:1.35}.payment-seo-summary p{margin-top:.65rem;color:#647794;font-size:.85rem;line-height:1.8}.payment-seo-summary>div{display:flex;flex-wrap:wrap;gap:.45rem;margin-top:1.15rem}.payment-seo-summary a{border:1px solid #dbe7fa;border-radius:999px;background:#f8fbff;padding:.48rem .68rem;color:var(--pay-deep);font-size:.68rem;font-weight:700}.payment-seo-copy{border:1px solid #e1eaf9;border-radius:1.35rem;background:#fff;padding:clamp(1.4rem,3vw,2.4rem)}.payment-seo-copy h2,.payment-seo-copy h3{color:var(--pay-navy);font-weight:800;line-height:1.45}.payment-seo-copy h2{font-size:clamp(1.55rem,3vw,2.4rem)}.payment-seo-copy h3{margin-top:1.7rem;font-size:1.15rem}.payment-seo-copy p{margin-top:.85rem;color:#5f7392;font-size:.9rem;line-height:1.95}.payment-seo-copy a{color:var(--pay-deep);font-weight:700;text-decoration:underline;text-decoration-color:#0a2ece3d;text-underline-offset:.2em}.payment-faq{background:radial-gradient(circle at 20% 0%,rgba(61,123,255,.22),transparent 32%),var(--pay-navy)}.payment-eyebrow--light{color:#8fc4ff}.payment-faq-item{overflow:hidden;border:1px solid rgba(255,255,255,.12);border-radius:1rem;background:#ffffff0e}.payment-faq-item summary{display:flex;cursor:pointer;list-style:none;align-items:center;justify-content:space-between;gap:1rem;padding:1.1rem 1.2rem;color:#fff;font-size:.9rem;font-weight:800;line-height:1.65}.payment-faq-item summary::-webkit-details-marker{display:none}.payment-faq-item summary i{position:relative;width:1rem;height:1rem;flex:none}.payment-faq-item summary i:before,.payment-faq-item summary i:after{position:absolute;top:50%;left:50%;width:.8rem;height:1px;transform:translate(-50%,-50%);background:#8fc4ff;content:"";transition:transform .22s ease}.payment-faq-item summary i:after{transform:translate(-50%,-50%) rotate(90deg)}.payment-faq-item[open] summary i:after{transform:translate(-50%,-50%) rotate(0)}.payment-faq-item>p{padding:0 1.2rem 1.2rem;color:#ffffffb8;font-size:.82rem;line-height:1.85}.payment-final-cta{background:linear-gradient(105deg,#185ff0,var(--pay-deep));padding-block:clamp(4rem,8vw,6.5rem)}.payment-button--white{background:#fff;color:var(--pay-deep)!important;box-shadow:0 22px 50px -34px #00000080}.payment-button--glass{border:1px solid rgba(255,255,255,.35);background:#ffffff14;color:#fff!important}.payment-button--glass:hover{background:#ffffff24}@keyframes payment-fill{0%{transform:scaleX(0);opacity:.7}42%,72%{transform:scaleX(1);opacity:1}to{transform:scaleX(1);opacity:0}}@keyframes payment-packet{0%{transform:translate3d(-100%,-50%,0);opacity:0}8%{opacity:1}92%{opacity:1}to{transform:translate3d(calc(82vw - 13rem),-50%,0);opacity:0}}@media(min-width:1280px){@keyframes payment-packet{0%{transform:translate3d(-100%,-50%,0);opacity:0}8%{opacity:1}92%{opacity:1}to{transform:translate3d(62rem,-50%,0);opacity:0}}}@media(max-width:900px){.payment-pipeline{grid-template-columns:1fr;gap:1rem}.payment-pipeline__track{top:1.8rem;right:auto;bottom:1.8rem;left:1.95rem;width:.28rem;height:auto}.payment-pipeline__progress{transform-origin:center top;background:linear-gradient(180deg,var(--pay-sky),var(--pay-blue),var(--pay-deep));animation-name:payment-fill-y}.payment-pipeline__packet{top:0;left:50%;animation-name:payment-packet-y}.payment-flow-card{display:grid;grid-template-columns:4.25rem 1fr;gap:.9rem;padding:0}.payment-flow-node{margin-inline:0}.payment-flow-copy{margin-top:0}@keyframes payment-fill-y{0%{transform:scaleY(0);opacity:.7}42%,72%{transform:scaleY(1);opacity:1}to{transform:scaleY(1);opacity:0}}@keyframes payment-packet-y{0%{transform:translate3d(-50%,-100%,0);opacity:0}8%{opacity:1}92%{opacity:1}to{transform:translate3d(-50%,36rem,0);opacity:0}}}@media(max-width:640px){.payment-art-badge--left{bottom:5%;left:2%}.payment-art-badge--right{top:18%;right:2%}.payment-art-badge{transform:scale(.88);transform-origin:center}.payment-comparison__head{display:none}.payment-comparison__row{grid-template-columns:1fr;padding:1.05rem}.payment-comparison__row>*{padding:.32rem 0}.payment-comparison__row strong{font-size:.88rem}.payment-comparison__row>span:nth-child(2):before{content:"ตรวจเอง: ";color:#8a9ab1;font-weight:700}.payment-use-cases{grid-template-columns:1fr}.payment-use-case:nth-child(odd){border-right:0}.payment-use-case:nth-last-child(2){border-bottom:1px solid #e8effb}}@media(prefers-reduced-motion:reduce){.payment-pipeline__progress,.payment-pipeline__packet{animation:none!important}.payment-pipeline__progress{transform:none;opacity:1}.payment-pipeline__packet{display:none}.payment-button,.payment-benefit,.payment-text-link span,.payment-use-case>svg,.payment-faq-item summary i:after{transition:none!important}}
