*{box-sizing:border-box}body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:#10233f;background:#f5f8fc}a{text-decoration:none;color:inherit}.nav{height:72px;background:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 6%;border-bottom:1px solid #e8eef5;position:sticky;top:0;z-index:10}.brand{font-size:27px;font-weight:900;letter-spacing:-1.5px}.brand-b{color:#1266d6}.brand-pay{color:#18a957;margin-left:3px}.nav nav{display:flex;align-items:center;gap:28px;font-weight:700;color:#4b5d74}.btn{display:inline-flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#1266d6,#19a95b);color:#fff;border:0;border-radius:12px;padding:13px 20px;font-weight:800;cursor:pointer;box-shadow:0 10px 25px #1266d622}.btn.small{padding:9px 18px}.btn.ghost{background:#fff;color:#1266d6;border:1px solid #dbe5f2;box-shadow:none}.btn.full{width:100%;font-size:16px}.hero{max-width:1180px;margin:auto;padding:78px 6%;display:grid;grid-template-columns:1.15fr .85fr;gap:55px;align-items:center}.pill{display:inline-block;background:#e9f5ff;color:#1266d6;border-radius:30px;padding:8px 13px;font-size:13px;font-weight:800}.hero h1{font-size:52px;line-height:1.08;margin:18px 0}.hero h1 span{color:#16a657}.hero p{font-size:18px;line-height:1.7;color:#65758a;max-width:620px}.actions{display:flex;gap:12px;margin:28px 0}.trust{display:flex;gap:20px;flex-wrap:wrap;color:#52647b;font-size:13px;font-weight:700}.hero-card{background:#fff;border-radius:28px;padding:25px;box-shadow:0 25px 70px #15365c18;border:1px solid #e6edf5}.card-head,.panel-title,.mini{display:flex;justify-content:space-between;align-items:center}.live{font-size:11px;color:#19a957}.balance{margin:24px 0;padding:25px;border-radius:20px;background:linear-gradient(135deg,#0e66d8,#1ca85b);color:#fff}.balance small{display:block;opacity:.85}.balance strong{font-size:30px;display:block;margin-top:8px}.quick{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}.quick div{background:#f4f7fb;border-radius:15px;padding:15px 5px;text-align:center;font-size:12px}.quick b{display:block;margin-top:7px}.mini{padding:17px 0;border-bottom:1px solid #edf1f6;margin-top:18px}.section{padding:70px 6%;max-width:1180px;margin:auto}.section h2{text-align:center;font-size:32px;margin:0}.sub{text-align:center;color:#728198}.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:32px}.grid article{background:#fff;padding:25px;border-radius:20px;border:1px solid #e6edf5;box-shadow:0 12px 35px #15365c09}.grid i{font-style:normal;font-size:30px}.grid h3{margin:15px 0 8px}.grid p{color:#718097;line-height:1.55;font-size:14px}.dark{max-width:none;background:#10233f;color:#fff}.feature-grid{max-width:1080px;margin:35px auto 0;display:grid;grid-template-columns:repeat(4,1fr);gap:15px}.feature-grid div{padding:22px;border:1px solid #ffffff20;border-radius:18px;background:#ffffff08}.feature-grid b,.feature-grid span{display:block;margin-top:8px}.feature-grid span{color:#aebbd0;font-size:13px;line-height:1.5}footer{text-align:center;padding:28px;background:#fff;color:#7b899b;font-size:13px}.login-page{min-height:100vh;display:grid;place-items:center;background:linear-gradient(135deg,#edf6ff,#f1fbf5);padding:20px}.login-wrap{width:100%;max-width:430px}.login-brand{text-align:center;margin-bottom:20px;font-size:35px;font-weight:900}.login-box{background:#fff;border-radius:25px;padding:35px;box-shadow:0 25px 70px #15365c18;border:1px solid #e5edf5}.login-box h1{margin:0 0 7px}.login-box>p{color:#728198;margin-top:0}.login-box label{display:block;font-size:13px;font-weight:800;margin:18px 0 7px}.login-box input:not([type=checkbox]){width:100%;padding:14px;border:1px solid #dbe4ef;border-radius:11px;outline:none;font-size:15px}.login-box input:focus{border-color:#1266d6;box-shadow:0 0 0 3px #1266d612}.form-row{display:flex;justify-content:space-between;align-items:center;font-size:13px}.check{display:flex!important;align-items:center;gap:7px!important;margin:15px 0!important}.check input{margin:0}.form-row a{color:#1266d6;font-weight:700}.alert{background:#fff0f0;color:#c0392b;padding:11px;border-radius:10px;font-size:13px}.back{display:block;text-align:center;margin-top:20px;color:#1266d6;font-weight:700}.app-nav{height:72px;background:#fff;border-bottom:1px solid #e7edf4;display:flex;align-items:center;justify-content:space-between;padding:0 5%}.user-chip{font-size:13px;color:#52647b}.user-chip a{color:#1266d6;font-weight:800;margin-left:12px}.dashboard{max-width:1180px;margin:auto;padding:35px 5%}.welcome{display:flex;justify-content:space-between;align-items:center;gap:20px}.welcome h1{margin:10px 0 5px}.welcome p{color:#748399}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;margin:25px 0}.stats>div{background:#fff;border:1px solid #e6edf5;border-radius:18px;padding:20px}.stats small{display:block;color:#7a899d}.stats strong{font-size:23px;display:block;margin-top:10px}.panel{background:#fff;border:1px solid #e6edf5;border-radius:20px;padding:22px;margin:18px 0}.panel-title h2{margin:0}.panel-title a{color:#1266d6;font-size:13px;font-weight:800}.service-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:18px}.service-grid a{background:#f6f9fd;border-radius:15px;padding:20px;text-align:center;font-size:28px}.service-grid b{display:block;font-size:13px;margin-top:8px}.recharge-slider{display:flex;overflow-x:auto;gap:14px;margin-top:18px;padding-bottom:5px;scroll-snap-type:x mandatory}.recharge-card{min-width:290px;scroll-snap-align:start;background:#f7faff;border:1px solid #e3ebf5;border-radius:16px;padding:18px}.recharge-card b,.recharge-card span{display:block}.recharge-card span{color:#728198;font-size:13px;margin-top:8px}.account-links{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:18px}.account-links a{padding:16px;border:1px solid #e3ebf5;border-radius:13px;font-weight:700}@media(max-width:850px){.hero{grid-template-columns:1fr;padding-top:45px}.hero h1{font-size:40px}.grid,.feature-grid{grid-template-columns:repeat(2,1fr)}.stats{grid-template-columns:repeat(2,1fr)}.service-grid,.account-links{grid-template-columns:repeat(2,1fr)}.nav nav a:not(.btn){display:none}}@media(max-width:520px){.hero h1{font-size:34px}.actions{flex-direction:column}.quick{grid-template-columns:repeat(2,1fr)}.grid,.feature-grid,.stats{grid-template-columns:1fr}.service-grid,.account-links{grid-template-columns:1fr}.hero-card{padding:18px}.welcome{align-items:flex-start;flex-direction:column}.app-nav{padding:0 4%}.user-chip{font-size:11px}}