* { margin: 0; padding: 0; box-sizing: border-box; } body { font-family: "Roboto", "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", Arial, sans-serif; margin: 0; padding: 0; font-size: 16px; line-height: 1.6; color: #23262f; background-color: #fff; } h1, h2, h3, h4, h5, h6, p, ol, ul, li, span, label { margin-bottom: 0px; } img { vertical-align: middle } a { text-decoration: none; color: #23262f; } a:hover { text-decoration: none; color: inherit; } .p-0{padding:0!important} .pt-0,.py-0{padding-top:0!important} .pr-0,.px-0{padding-right:0!important} .pb-0,.py-0{padding-bottom:0!important} .pl-0,.px-0{padding-left:0!important} .p-1{padding:.3125rem!important} .pt-1,.py-1{padding-top:.3125rem!important} .pr-1,.px-1{padding-right:.3125rem!important} .pb-1,.py-1{padding-bottom:.3125rem!important} .pl-1,.px-1{padding-left:.3125rem!important} .p-2{padding:.625rem!important} .pt-2,.py-2{padding-top:.625rem!important} .pr-2,.px-2{padding-right:.625rem!important} .pb-2,.py-2{padding-bottom:.625rem!important} .pl-2,.px-2{padding-left:.625rem!important} .p-3{padding:1.25rem!important} .pt-3,.py-3{padding-top:1.25rem!important} .pr-3,.px-3{padding-right:1.25rem!important} .pb-3,.py-3{padding-bottom:1.25rem!important} .pl-3,.px-3{padding-left:1.25rem!important} .p-4{padding:1.875rem!important} .pt-4,.py-4{padding-top:1.875rem!important} .pr-4,.px-4{padding-right:1.875rem!important} .pb-4,.py-4{padding-bottom:1.875rem!important} .pl-4,.px-4{padding-left:1.875rem!important} .p-5{padding:2.5rem!important} .pt-5,.py-5{padding-top:2.5rem!important} .pr-5,.px-5{padding-right:2.5rem!important} .pb-5,.py-5{padding-bottom:2.5rem!important} .pl-5,.px-5{padding-left:2.5rem!important} .m-0{margin:0!important} .mt-0,.my-0{margin-top:0!important} .mr-0,.mx-0{margin-right:0!important} .mb-0,.my-0{margin-bottom:0!important} .ml-0,.mx-0{margin-left:0!important} .m-1{margin:.3125rem!important} .mt-1,.my-1{margin-top:.3125rem!important} .mr-1,.mx-1{margin-right:.3125rem!important} .mb-1,.my-1{margin-bottom:.3125rem!important} .ml-1,.mx-1{margin-left:.3125rem!important} .m-2{margin:.625rem!important} .mt-2,.my-2{margin-top:.625rem!important} .mr-2,.mx-2{margin-right:.625rem!important} .mb-2,.my-2{margin-bottom:.625rem!important} .ml-2,.mx-2{margin-left:.625rem!important} .m-3{margin:1.25rem!important} .mt-3,.my-3{margin-top:1.25rem!important} .mr-3,.mx-3{margin-right:1.25rem!important} .mb-3,.my-3{margin-bottom:1.25rem!important} .ml-3,.mx-3{margin-left:1.25rem!important} .m-4{margin:1.875rem!important} .mt-4,.my-4{margin-top:1.875rem!important} .mr-4,.mx-4{margin-right:1.875rem!important} .mb-4,.my-4{margin-bottom:1.875rem!important} .ml-4,.mx-4{margin-left:1.875rem!important} .m-5{margin:2.5rem!important} .mt-5,.my-5{margin-top:2.5rem!important} .mr-5,.mx-5{margin-right:2.5rem!important} .mb-5,.my-5{margin-bottom:2.5rem!important} .ml-5,.mx-5{margin-left:2.5rem!important} .bg-gradient-primary { background: linear-gradient(to right, #3498db, #2ecc71); } .text-gradient { background: linear-gradient(to right, #3498db, #2ecc71); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .btn-bingpay { background: linear-gradient(to right, #3498db, #2ecc71); color: white; border: none; transition: all 0.3s ease; } .btn-bingpay:hover { transform: translateY(-3px); box-shadow: 0 10px 20px rgba(52, 152, 219, 0.3); color: white; } .crypto-icon { width: 48px; height: 48px; margin-bottom: 15px; transition: all 0.3s ease; } .feature-card { border-radius: 1rem; overflow: hidden; transition: all 0.3s ease; border: none; } .feature-card:hover { transform: translateY(-10px); box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1); } .hero-section { min-height: 85vh; display: flex; align-items: center; } .floating { animation: floating 3s ease-in-out infinite; } @keyframes floating { 0% { transform: translateY(0px); } 50% { transform: translateY(-20px); } 100% { transform: translateY(0px); } } .testimonial-card { border-radius: 1rem; overflow: hidden; transition: all 0.3s ease; } .navbar-bingpay { backdrop-filter: blur(10px); background-color: rgba(255, 255, 255, 0.9); } /*.demo-img {*/ /* border-radius: 1rem;*/ /* box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);*/ /*}*/ .coin-float { position: absolute; z-index: -1; opacity: 0.3; } #coin1 { top: 15%; left: 10%; animation: floating 4s ease-in-out infinite; } #coin2 { top: 60%; right: 5%; animation: floating 5s ease-in-out infinite; } #coin3 { bottom: 10%; left: 20%; animation: floating 3.5s ease-in-out infinite; } .navbar-nav .nav-link { position: relative; margin-right: 15px; } .navbar-nav .nav-link::after { content: ''; position: absolute; width: 0; height: 2px; bottom: 0; left: 0; background: linear-gradient(to right, #3498db, #2ecc71); transition: width 0.3s ease; } .navbar-nav .nav-link:hover::after { width: 100%; } .pricing-card { border-radius: 1rem; overflow: hidden; transition: all 0.3s ease; border: none; } .pricing-card:hover { transform: translateY(-10px); box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1); } .pricing-popular { position: relative; overflow: hidden; } .pricing-popular::before { content: 'POPULAR'; position: absolute; top: 10px; right: -30px; background: #3498db; color: white; padding: 5px 40px; transform: rotate(45deg); font-size: 0.8rem; font-weight: bold; z-index: 1; }