:root{--navy:#0b1f4b;--navy2:#13306e;--gold:#c9a227;--red:#b3202f;--green:#16a34a;--green2:#15803d;--bg:#f3f6fa;--card:#fff;--line:#e5e9f0;--txt:#1e293b;--mut:#64748b;--r:14px}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'Poppins',system-ui,Segoe UI,Arial,sans-serif;color:var(--txt);background:var(--bg);font-size:14.5px;line-height:1.6}
a{color:inherit;text-decoration:none}img{max-width:100%}
i[data-lucide],svg.lucide{width:19px;height:19px;stroke-width:2;flex:none}
.brand{display:flex;flex-direction:column;line-height:1}
.brand .b1{font-weight:700;font-size:23px;letter-spacing:.5px;color:var(--navy)}
.brand .b2{font-weight:500;font-size:8.5px;letter-spacing:2.2px;color:var(--red);margin-top:4px}
.brand.light .b1{color:#fff}.brand.light .b2{color:var(--gold)}
/* buttons / forms */
.btn{display:inline-flex;align-items:center;gap:8px;border:0;border-radius:10px;padding:10px 18px;font:600 14px 'Poppins',sans-serif;cursor:pointer;background:var(--navy);color:#fff;transition:.2s}
.btn:hover{background:var(--navy2);transform:translateY(-1px)}
.btn.gold{background:var(--gold);color:#1b1500}.btn.green{background:var(--green)}.btn.green:hover{background:var(--green2)}
.btn.red{background:var(--red)}.btn.ghost{background:#fff;color:var(--navy);border:1px solid var(--line)}.btn.sm{padding:6px 12px;font-size:12.5px;border-radius:8px}
.btn.block{width:100%;justify-content:center}
label{display:block;font-weight:500;font-size:13px;margin:12px 0 5px}
input,select,textarea{width:100%;padding:10px 12px;border:1px solid #d5dce6;border-radius:10px;font:400 14px 'Poppins',sans-serif;background:#fff;color:var(--txt)}
input:focus,select:focus,textarea:focus{outline:2px solid rgba(22,163,74,.35);border-color:var(--green)}
.hp{position:absolute;left:-9999px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:0 16px}
.alert{padding:11px 14px;border-radius:10px;margin-bottom:14px;font-weight:500}
.alert.ok{background:#dcfce7;color:#14532d}.alert.err{background:#fee2e2;color:#7f1d1d}
.badge{display:inline-block;padding:2px 10px;border-radius:99px;font-size:11.5px;font-weight:600}
.badge.green{background:#dcfce7;color:#166534}.badge.amber{background:#fef3c7;color:#92400e}.badge.red{background:#fee2e2;color:#991b1b}.badge.blue{background:#dbeafe;color:#1e40af}.badge.gray{background:#e2e8f0;color:#475569}
/* dashboard shell */
.shell{display:flex;min-height:100vh}
.side{width:262px;background:#fff;border-right:1px solid var(--line);padding:20px 16px;position:fixed;top:0;bottom:0;left:0;display:flex;flex-direction:column;z-index:40;overflow-y:auto}
.side-top{padding:2px 8px 18px}.role-tag{margin-top:10px;font-size:11px;font-weight:600;color:var(--green2);background:#ecfdf3;display:inline-block;padding:2px 10px;border-radius:99px}
.side nav{display:flex;flex-direction:column;gap:4px;flex:1}
.side nav a,.logout{display:flex;align-items:center;gap:12px;padding:11px 14px;border-radius:12px;font-weight:600;color:#1e293b;transition:.15s}
.side nav a:hover,.logout:hover{background:#f1f5f9}
.side nav a.active{background:linear-gradient(135deg,#22c55e,#15803d);color:#fff;box-shadow:0 8px 18px rgba(21,128,61,.28)}
.cnt{margin-left:auto;background:var(--red);color:#fff;font-style:normal;font-size:11px;padding:0 8px;border-radius:99px}
.logout{color:var(--red);margin-top:10px;border-top:1px solid var(--line);border-radius:0 0 12px 12px;padding-top:16px}
.main{margin-left:262px;flex:1;min-width:0}
.top{display:flex;align-items:center;gap:14px;background:#fff;border-bottom:1px solid var(--line);padding:14px 28px;position:sticky;top:0;z-index:30}
.top h1{font-size:19px;color:var(--navy);flex:1}.burger{display:none;background:none;border:0;cursor:pointer;color:var(--navy)}
.who{display:flex;align-items:center;gap:10px}.who small{display:block;color:var(--mut);font-size:11.5px;line-height:1.2}.who b{font-size:13px;line-height:1.2;display:block}
.avatar{width:38px;height:38px;border-radius:50%;background:var(--navy);color:#fff;display:grid;place-items:center;font-weight:700}
.content{padding:26px 28px 50px}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:20px;margin-bottom:20px;box-shadow:0 2px 10px rgba(15,23,42,.04)}
.card h2{font-size:16px;color:var(--navy);margin-bottom:14px;display:flex;align-items:center;gap:8px;justify-content:space-between}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin-bottom:20px}
.stat{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:18px;display:flex;gap:14px;align-items:center}
.stat .ic{width:46px;height:46px;border-radius:12px;display:grid;place-items:center;background:#ecfdf3;color:var(--green2)}
.stat .ic.n{background:#e8edf9;color:var(--navy)}.stat .ic.g{background:#fdf6dc;color:#a17c00}.stat .ic.r{background:#fde8ea;color:var(--red)}
.stat b{font-size:22px;color:var(--navy);display:block;line-height:1.2}.stat span{color:var(--mut);font-size:12.5px}
.tbl{width:100%;overflow-x:auto}table{width:100%;border-collapse:collapse;font-size:13.5px;min-width:560px}
th{text-align:left;font-size:12px;text-transform:uppercase;letter-spacing:.5px;color:var(--mut);padding:10px 12px;background:#f8fafc;border-bottom:1px solid var(--line)}
td{padding:11px 12px;border-bottom:1px solid #eef1f6;vertical-align:middle}tr:hover td{background:#fafcff}
.actions{display:flex;gap:6px;flex-wrap:wrap}.empty{text-align:center;color:var(--mut);padding:28px}
.filters{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:14px}.filters input,.filters select{width:auto;min-width:160px}
.pager{display:flex;gap:6px;margin-top:14px}.pager a{padding:5px 11px;border:1px solid var(--line);border-radius:8px;background:#fff}.pager a.on{background:var(--navy);color:#fff}
.progress{height:8px;background:#e2e8f0;border-radius:99px;overflow:hidden}.progress i{display:block;height:100%;background:linear-gradient(90deg,#22c55e,#15803d)}
.cards3{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:18px}
.plan{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:22px;display:flex;flex-direction:column;gap:6px;transition:.2s}
.plan:hover{transform:translateY(-4px);box-shadow:0 14px 30px rgba(11,31,75,.12)}
.plan .amt{font-size:28px;font-weight:700;color:var(--navy)}.plan .meta{color:var(--mut);font-size:13px}.plan .btn{margin-top:auto}
.kv{display:grid;grid-template-columns:150px 1fr;gap:6px 12px}.kv dt{color:var(--mut)}
.pay-box{background:#f0fdf4;border:1px dashed #86efac;border-radius:12px;padding:16px;margin:10px 0}
.pay-box b.big{font-size:20px;color:var(--navy)}
/* public site */
body.pub{background:#fff}
.nav{position:sticky;top:0;background:#fff;border-bottom:1px solid var(--line);z-index:50}
.nav .in{max-width:1180px;margin:auto;padding:12px 20px;display:flex;align-items:center;gap:26px}
.nav nav{display:flex;gap:22px;margin-left:auto;font-weight:500}.nav nav a:hover{color:var(--red)}
.wrap{max-width:1180px;margin:auto;padding:0 20px}
.hero{background:linear-gradient(135deg,var(--navy) 0%,#16336f 60%,#1d4a9a 100%);color:#fff;padding:90px 0 100px;position:relative;overflow:hidden}
.hero:after{content:"";position:absolute;right:-120px;top:-120px;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle,rgba(201,162,39,.35),transparent 70%)}
.hero h1{font-size:46px;line-height:1.15;max-width:700px}.hero h1 span{color:var(--gold)}.hero p{max-width:560px;margin:18px 0 28px;color:#cbd5ee;font-size:16px}
.hero .cta{display:flex;gap:12px;flex-wrap:wrap}
.sec{padding:70px 0}.sec.alt{background:var(--bg)}.sec h2.t{font-size:30px;color:var(--navy);text-align:center}.sec p.s{text-align:center;color:var(--mut);margin:6px auto 34px;max-width:620px}
.svc{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px}
.svc div{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:22px}.svc i{color:var(--gold);width:30px;height:30px}.svc h3{font-size:15.5px;margin:10px 0 4px;color:var(--navy)}.svc p{color:var(--mut);font-size:13.5px}
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:18px;counter-reset:s}
.steps div{background:#fff;border-radius:var(--r);padding:22px;border-top:4px solid var(--gold);counter-increment:s}.steps div:before{content:counter(s);font-size:28px;font-weight:700;color:var(--gold);display:block}
.contact{display:grid;grid-template-columns:1fr 1fr;gap:30px}.contact .info p{margin:10px 0;display:flex;gap:10px}.contact .info i{color:var(--red)}
.foot{background:var(--navy);color:#cbd5ee;padding:26px 0;text-align:center;font-size:13px}
.wa{position:fixed;right:18px;bottom:18px;background:#25d366;color:#fff;width:54px;height:54px;border-radius:50%;display:grid;place-items:center;box-shadow:0 8px 20px rgba(0,0,0,.25);z-index:60}
/* auth */
.auth{min-height:100vh;display:grid;grid-template-columns:1fr 1fr}
.auth .l{background:linear-gradient(135deg,var(--navy),#1d4a9a);color:#fff;padding:60px;display:flex;flex-direction:column;justify-content:center}
.auth .l h2{font-size:34px;line-height:1.2;margin:24px 0 10px}.auth .l p{color:#cbd5ee;max-width:420px}
.auth .r{display:flex;align-items:center;justify-content:center;padding:30px;background:#fff}.auth .box{width:100%;max-width:420px}
.auth .box h1{color:var(--navy);font-size:26px}.tabs{display:flex;background:#f1f5f9;border-radius:12px;padding:4px;margin:16px 0}
.tabs a{flex:1;text-align:center;padding:8px;border-radius:9px;font-weight:600;color:var(--mut)}.tabs a.on{background:#fff;color:var(--navy);box-shadow:0 2px 8px rgba(0,0,0,.08)}
.receipt{max-width:720px;margin:30px auto;background:#fff;border:1px solid var(--line);border-radius:14px;padding:34px}
.receipt .hd{display:flex;justify-content:space-between;border-bottom:2px solid var(--navy);padding-bottom:14px;margin-bottom:18px;gap:16px}
@media(max-width:960px){.side{transform:translateX(-100%);transition:.25s}.side.open{transform:none;box-shadow:0 0 40px rgba(0,0,0,.3)}.main{margin-left:0}.burger{display:block}.auth{grid-template-columns:1fr}.auth .l{display:none}.contact,.grid2,.grid3{grid-template-columns:1fr}.hero h1{font-size:32px}.nav nav{display:none}.content{padding:18px 14px}.top{padding:12px 14px}.who div{display:none}}
@media print{.side,.top,.no-print,.wa{display:none!important}.main{margin:0}body{background:#fff}.receipt{border:0;margin:0}}