
:root{
  --brand-900:#0f2a52;
  --brand-800:#153767;
  --brand-700:#1b4580;
  --brand-600:#2a5ca0;
  --brand-100:#e2eaf6;
  --brand-50:#f2f6fc;
  --brand-deep:#0a1a33;
  --gold:#b6862c;
  --gold-light:#ecd9a8;
  --grey-900:#1a2230;
  --grey-700:#3d4756;
  --grey-500:#6a7483;
  --grey-300:#c9d0da;
  --grey-100:#eef1f6;
  --white:#ffffff;
  --danger:#a3312a;
  --warn:#a06a10;
  --ok:#0f6b3f;
  --radius:6px;
  --shadow:0 1px 3px rgba(15,42,82,.12), 0 1px 2px rgba(15,42,82,.08);
  --shadow-md:0 4px 14px rgba(15,42,82,.16);
  --font-ui:'Source Sans 3', 'Noto Sans', Arial, sans-serif;
  --font-head:'Inter','Source Sans 3',Arial,sans-serif;
  --scale:1;
}
*{box-sizing:border-box;}
html{font-size:calc(16px * var(--scale));}
body{overflow-x:clip;
  margin:0;font-family:var(--font-ui);color:var(--grey-900);background:var(--grey-100);
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;}
button{font-family:inherit;cursor:pointer;}
a{color:inherit;text-decoration:none;}
input,select,textarea{font-family:inherit;font-size:1rem;}
.container{max-width:1180px;margin:0 auto;padding:0 20px;}
:focus-visible{outline:3px solid var(--gold);outline-offset:2px;}

/* ===== Utility bar ===== */
.utility-bar{background:var(--brand-deep);color:#dbe5f4;font-size:.78rem;}
.utility-bar .container{display:flex;justify-content:space-between;align-items:center;height:34px;flex-wrap:wrap;gap:6px;}
.utility-left{display:flex;gap:16px;flex-wrap:wrap;}
.utility-left span{white-space:nowrap;opacity:.92}
.utility-right{display:flex;align-items:center;gap:14px;}
.font-toggle{display:flex;gap:2px;align-items:center;}
.font-toggle button{background:transparent;border:1px solid rgba(255,255,255,.35);color:#dbe5f4;width:22px;height:22px;border-radius:3px;font-size:.72rem;line-height:1;}
.font-toggle button:hover{background:rgba(255,255,255,.15);}
.utility-right button.lang-btn{background:transparent;border:none;color:#dbe5f4;font-size:.78rem;padding:2px 6px;border-radius:3px;}
.utility-right button.lang-btn:hover{background:rgba(255,255,255,.15);}
.utility-right button.lang-btn.active{text-decoration:underline;font-weight:600;}

/* ===== Header ===== */
header.main-header{background:var(--white);border-bottom:3px solid var(--brand-700);position:sticky;top:0;z-index:50;}
.header-inner{display:flex;align-items:center;justify-content:space-between;padding:12px 20px;gap:14px;}
.brand{display:flex;align-items:center;gap:12px;}
.emblem{width:52px;height:52px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex:none;overflow:hidden;background:#fff;box-shadow:0 0 0 1px var(--grey-300);}
.emblem img{width:100%;height:100%;object-fit:contain;}
.brand-text .brand-name{font-family:var(--font-head);font-size:1.02rem;margin:0;color:var(--brand-900);letter-spacing:.3px;font-weight:800;}
.brand-text p{margin:1px 0 0;font-size:.72rem;color:var(--grey-500);}
nav.main-nav{display:flex;gap:2px;}
nav.main-nav a{padding:10px 12px;font-size:.9rem;font-weight:600;color:var(--grey-700);border-radius:4px;}
nav.main-nav a:hover,nav.main-nav a.active{color:var(--brand-800);background:var(--brand-50);}
.header-actions{display:flex;align-items:center;gap:10px;}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:9px 16px;border-radius:4px;font-weight:600;font-size:.88rem;border:1px solid transparent;transition:background .12s,border-color .12s;}
.btn-primary{background:var(--brand-700);color:#fff;}
.btn-primary:hover{background:var(--brand-800);}
.btn-outline{background:transparent;border-color:var(--brand-700);color:var(--brand-700);}
.btn-outline:hover{background:var(--brand-50);}
.btn-gold{background:var(--gold);color:#2a1e05;}
.btn-gold:hover{filter:brightness(.95);}
.btn-ghost{background:transparent;color:var(--grey-700);border-color:var(--grey-300);}
.btn-ghost:hover{background:var(--grey-100);}
.btn-danger{background:var(--danger);color:#fff;}
.btn-danger:hover{filter:brightness(.92);}
.btn-sm{padding:6px 11px;font-size:.78rem;}
.btn-block{width:100%;}
.btn[disabled]{opacity:.5;cursor:not-allowed;}
.hamburger{display:none;background:transparent;border:1px solid var(--grey-300);border-radius:4px;padding:8px;}
.hamburger span{display:block;width:20px;height:2px;background:var(--grey-900);margin:4px 0;}

/* ===== Notification bell ===== */
.bell-wrap{position:relative;}
.bell-btn{position:relative;background:transparent;border:1px solid var(--grey-300);border-radius:50%;width:38px;height:38px;display:flex;align-items:center;justify-content:center;font-size:1rem;}
.bell-dot{position:absolute;top:5px;right:6px;width:8px;height:8px;background:var(--danger);border-radius:50%;border:1.5px solid #fff;}
.bell-panel{position:absolute;right:0;top:46px;width:320px;max-height:380px;overflow:auto;background:#fff;border:1px solid var(--grey-300);border-radius:var(--radius);box-shadow:var(--shadow-md);z-index:80;}
.bell-panel h4{margin:0;padding:12px 14px;border-bottom:1px solid var(--grey-100);font-size:.85rem;font-family:var(--font-head);}
.bell-item{padding:10px 14px;border-bottom:1px solid var(--grey-100);font-size:.82rem;}
.bell-item b{display:block;color:var(--brand-800);margin-bottom:2px;}
.bell-item span{color:var(--grey-500);font-size:.74rem;}
.bell-empty{padding:20px;text-align:center;color:var(--grey-500);font-size:.82rem;}

/* ===== Hero ===== */
.hero{background:linear-gradient(120deg,var(--brand-deep),var(--brand-800) 55%,var(--brand-700));color:#fff;position:relative;overflow:hidden;}
.hero:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 85% 20%,rgba(182,134,44,.18),transparent 45%);}
.hero-inner{position:relative;display:flex;align-items:center;gap:40px;padding:64px 20px 70px;max-width:1180px;margin:0 auto;}
.hero-text{flex:1.1;}
.hero-eyebrow{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.25);padding:5px 12px;border-radius:20px;font-size:.74rem;letter-spacing:.5px;text-transform:uppercase;margin-bottom:18px;}
.hero-text h1{font-family:var(--font-head);font-size:2.3rem;line-height:1.18;margin:0 0 16px;font-weight:800;}
.hero-text p{font-size:1.02rem;line-height:1.6;color:#d4e0f2;max-width:520px;margin:0 0 26px;}
.hero-ctas{display:flex;gap:12px;flex-wrap:wrap;}
.hero-visual{flex:1;display:flex;align-items:center;justify-content:center;}
.hero-badge-card{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.22);border-radius:10px;padding:22px;width:100%;max-width:320px;backdrop-filter:blur(2px);}
.hero-badge-card h5{margin:0 0 14px;font-size:.8rem;text-transform:uppercase;letter-spacing:.6px;color:var(--gold-light);}
.hero-stat{display:flex;justify-content:space-between;padding:9px 0;border-bottom:1px dashed rgba(255,255,255,.2);font-size:.86rem;}
.hero-stat:last-child{border-bottom:none;}
.hero-stat b{font-family:var(--font-head);}

/* ===== Sections ===== */
section.pad{padding:54px 0;}
.section-head{margin-bottom:28px;}
.section-head .eyebrow{font-size:.74rem;font-weight:700;letter-spacing:.7px;text-transform:uppercase;color:var(--gold);}
.section-head h3{font-family:var(--font-head);font-size:1.55rem;margin:6px 0 8px;color:var(--brand-900);font-weight:800;}
.section-head p{color:var(--grey-500);max-width:640px;margin:0;font-size:.94rem;}
.section-head-row{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap;}

.services-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
.service-card{background:#fff;border:1px solid var(--grey-300);border-radius:var(--radius);padding:20px;display:flex;flex-direction:column;gap:10px;transition:box-shadow .15s,border-color .15s,transform .15s;}
.service-card:hover{box-shadow:var(--shadow-md);border-color:var(--brand-600);transform:translateY(-2px);}
.service-icon{width:42px;height:42px;border-radius:8px;background:var(--brand-100);color:var(--brand-800);display:flex;align-items:center;justify-content:center;font-size:1.25rem;}
.service-card h4{font-family:var(--font-head);font-size:.98rem;margin:0;color:var(--grey-900);}
.service-card p{font-size:.83rem;color:var(--grey-500);margin:0;line-height:1.45;flex:1;}
.service-card .link{font-size:.82rem;font-weight:700;color:var(--brand-700);display:inline-flex;align-items:center;gap:5px;}

.timeline-wrap{display:flex;justify-content:space-between;position:relative;gap:6px;}
.timeline-wrap:before{content:"";position:absolute;top:22px;left:22px;right:22px;height:2px;background:var(--grey-300);}
.tl-step{flex:1;text-align:center;position:relative;min-width:0;}
.tl-num{width:44px;height:44px;border-radius:50%;background:#fff;border:2px solid var(--brand-700);color:var(--brand-800);display:flex;align-items:center;justify-content:center;margin:0 auto 10px;font-family:var(--font-head);font-weight:800;position:relative;z-index:2;}
.tl-step p{font-size:.78rem;font-weight:600;color:var(--grey-700);margin:0;padding:0 4px;}

.two-col{display:grid;grid-template-columns:1.5fr 1fr;gap:26px;}
.notice-list{background:#fff;border:1px solid var(--grey-300);border-radius:var(--radius);overflow:hidden;}
.notice-row{display:flex;align-items:center;gap:14px;padding:14px 18px;border-bottom:1px solid var(--grey-100);}
.notice-row:last-child{border-bottom:none;}
.notice-date{background:var(--brand-50);color:var(--brand-800);border-radius:6px;padding:6px 4px;text-align:center;width:52px;flex:none;font-family:var(--font-head);}
.notice-date b{display:block;font-size:1rem;line-height:1;}
.notice-date span{font-size:.66rem;text-transform:uppercase;}
.notice-body{flex:1;min-width:0;}
.notice-body h5{margin:0 0 2px;font-size:.88rem;font-weight:700;color:var(--grey-900);}
.badge{display:inline-block;font-size:.62rem;font-weight:800;letter-spacing:.4px;padding:2px 7px;border-radius:3px;text-transform:uppercase;}
.badge-new{background:#fdecec;color:var(--danger);margin-right:6px;}
.badge-cat{background:var(--grey-100);color:var(--grey-700);}
.links-card{background:#fff;border:1px solid var(--grey-300);border-radius:var(--radius);padding:18px;}
.links-card h4{margin:0 0 12px;font-family:var(--font-head);font-size:.95rem;color:var(--brand-900);}
.links-card a{display:flex;align-items:center;justify-content:space-between;padding:9px 0;border-bottom:1px solid var(--grey-100);font-size:.84rem;color:var(--grey-700);}
.links-card a:last-child{border-bottom:none;}
.links-card a:hover{color:var(--brand-800);}

footer{background:var(--brand-deep);color:#c5d3ea;margin-top:30px;}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:30px;padding:44px 0 26px;}
.footer-grid h5{color:#fff;font-family:var(--font-head);font-size:.88rem;margin:0 0 14px;}
.footer-grid p{font-size:.82rem;line-height:1.6;color:#9db4d8;margin:0;}
.footer-grid ul{list-style:none;margin:0;padding:0;}
.footer-grid li{margin-bottom:9px;}
.footer-grid a{font-size:.82rem;color:#c5d3ea;}
.footer-grid a:hover{color:#fff;text-decoration:underline;}
.footer-bottom{border-top:1px solid rgba(255,255,255,.12);padding:16px 0;font-size:.76rem;display:flex;justify-content:space-between;flex-wrap:wrap;gap:6px;color:#8aa3cc;}

/* ===== Generic page shell ===== */
.page-hero{background:var(--brand-900);color:#fff;padding:26px 0;}
.page-hero h1{font-family:var(--font-head);margin:0 0 4px;font-size:1.4rem;}
.breadcrumb{font-size:.78rem;color:#b6c9e6;}
.page-body{padding:34px 0 60px;}

/* ===== Auth cards ===== */
.auth-wrap{display:flex;justify-content:center;padding:40px 0;}
.card{background:#fff;border:1px solid var(--grey-300);border-radius:var(--radius);box-shadow:var(--shadow);}
.auth-card{width:100%;max-width:440px;padding:30px 30px 26px;}
.auth-card h3{font-family:var(--font-head);margin:0 0 4px;color:var(--brand-900);font-size:1.25rem;}
.auth-card h1.auth-title{font-family:var(--font-head);margin:0 0 4px;color:var(--brand-900);font-size:1.25rem;}
.auth-card .sub{color:var(--grey-500);font-size:.85rem;margin:0 0 22px;}
.field{margin-bottom:16px;}
.field label{display:block;font-size:.82rem;font-weight:600;color:var(--grey-700);margin-bottom:6px;}
.field label .req{color:var(--danger);margin-left:2px;}
.field input,.field select,.field textarea{width:100%;padding:10px 11px;border:1px solid var(--grey-300);border-radius:4px;background:#fff;color:var(--grey-900);}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--brand-700);}
.field .hint{font-size:.72rem;color:var(--grey-500);margin-top:4px;}
.field-error{font-size:.72rem;color:var(--danger);margin-top:4px;display:none;}
.field.invalid input{border-color:var(--danger);}
.field.invalid .field-error{display:block;}
.field-row{display:flex;gap:12px;}
.field-row .field{flex:1;}
.check-row{display:flex;align-items:flex-start;gap:8px;font-size:.82rem;color:var(--grey-700);margin-bottom:16px;}
.check-row input{margin-top:3px;}
.pw-strength{height:4px;border-radius:2px;background:var(--grey-100);margin-top:6px;overflow:hidden;}
.pw-strength i{display:block;height:100%;width:0%;background:var(--danger);transition:width .2s,background .2s;}
.captcha-box{display:flex;align-items:center;gap:10px;margin-bottom:16px;}
.captcha-code{background:var(--grey-100);border:1px dashed var(--grey-300);font-family:var(--font-head);letter-spacing:5px;font-weight:800;font-size:1.1rem;padding:9px 16px;border-radius:4px;color:var(--brand-900);user-select:none;}
.otp-row{display:flex;gap:8px;margin-bottom:6px;}
.otp-row input{width:42px;text-align:center;padding:10px 0;}
.auth-foot{text-align:center;font-size:.84rem;color:var(--grey-500);margin-top:14px;}
.maint-strip{background:#fff6dc;border-bottom:1px solid #e6c36a;color:#5c4300;font-size:.84rem;padding:9px 0;}
.maint-strip a{color:var(--brand-800);font-weight:700;text-decoration:underline;}
.fee-note{border-left:5px solid #b8860b;background:#fff6dc;}
.fee-note b{display:block;font-size:1rem;margin-bottom:2px;}
.demo-box{background:var(--brand-50);border:1px solid var(--brand-100);border-radius:4px;padding:10px 12px;font-size:.76rem;color:var(--brand-800);margin-bottom:18px;}
.divider-or{display:flex;align-items:center;gap:10px;color:var(--grey-500);font-size:.76rem;margin:16px 0;}
.divider-or:before,.divider-or:after{content:"";flex:1;height:1px;background:var(--grey-300);}

/* ===== Dashboard ===== */
.dash-shell{display:flex;gap:24px;align-items:flex-start;}
.dash-side{width:220px;flex:none;background:#fff;border:1px solid var(--grey-300);border-radius:var(--radius);overflow:hidden;position:sticky;top:76px;}
.dash-side a{display:flex;align-items:center;gap:10px;padding:12px 16px;font-size:.85rem;font-weight:600;color:var(--grey-700);border-left:3px solid transparent;}
.dash-side a:hover{background:var(--brand-50);}
.dash-side a.active{background:var(--brand-50);color:var(--brand-800);border-left-color:var(--brand-700);}
.dash-main{flex:1;min-width:0;}
.welcome-bar{background:#fff;border:1px solid var(--grey-300);border-radius:var(--radius);padding:20px 22px;margin-bottom:20px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;}
.welcome-bar h2{margin:0 0 2px;font-family:var(--font-head);font-size:1.2rem;color:var(--brand-900);}
.welcome-bar p{margin:0;font-size:.82rem;color:var(--grey-500);}
.stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:20px;}
.stat-card{background:#fff;border:1px solid var(--grey-300);border-radius:var(--radius);padding:16px 18px;}
.stat-card span.label{display:block;font-size:.72rem;text-transform:uppercase;letter-spacing:.4px;color:var(--grey-500);margin-bottom:6px;font-weight:700;}
.stat-card .val{font-family:var(--font-head);font-size:1.05rem;font-weight:700;color:var(--grey-900);}
.status-pill{display:inline-flex;align-items:center;gap:6px;font-size:.72rem;font-weight:700;padding:4px 9px;border-radius:20px;}
.status-pill:before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;}
.st-draft{background:#f1f1ef;color:#6b6b60;}
.st-submitted{background:#e8f0fb;color:#2c5fa8;}
.st-payment{background:#fdf3e0;color:var(--warn);}
.st-review{background:#fdf3e0;color:var(--warn);}
.st-query{background:#fdecec;color:var(--danger);}
.st-approved{background:#e6f6ec;color:var(--ok);}
.st-rejected{background:#fdecec;color:var(--danger);}
.st-issued{background:#e2eaf6;color:var(--brand-800);}
.action-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;}
.action-tile{background:#fff;border:1px solid var(--grey-300);border-radius:var(--radius);padding:16px;text-align:center;font-size:.82rem;font-weight:600;color:var(--grey-700);display:flex;flex-direction:column;align-items:center;gap:8px;}
.action-tile:hover{border-color:var(--brand-600);color:var(--brand-800);box-shadow:var(--shadow);}
.action-tile .ic{font-size:1.3rem;}
.alert{border-radius:var(--radius);padding:14px 16px;font-size:.86rem;margin-bottom:18px;display:flex;gap:12px;align-items:flex-start;}
.alert-warn{background:#fdf3e0;border:1px solid #f0dcae;color:#6b4d0c;}
.alert-info{background:var(--brand-50);border:1px solid var(--brand-100);color:var(--brand-800);}
.alert-danger{background:#fdecec;border:1px solid #f3c8c5;color:#7a201b;}
.alert b{display:block;margin-bottom:2px;}

/* ===== Multi-step form ===== */
.stepper{display:flex;overflow-x:auto;gap:0;margin-bottom:26px;background:#fff;border:1px solid var(--grey-300);border-radius:var(--radius);padding:6px;}
.step-chip{flex:none;display:flex;align-items:center;gap:8px;padding:9px 14px;border-radius:4px;font-size:.76rem;font-weight:700;color:var(--grey-500);white-space:nowrap;}
.step-chip .n{width:20px;height:20px;border-radius:50%;background:var(--grey-100);color:var(--grey-500);display:flex;align-items:center;justify-content:center;font-size:.68rem;}
.step-chip.done{color:var(--brand-800);}
.step-chip.done .n{background:var(--brand-700);color:#fff;}
.step-chip.current{color:var(--brand-900);background:var(--brand-50);}
.step-chip.current .n{background:var(--gold);color:#2a1e05;}
.progress-track{height:6px;background:var(--grey-100);border-radius:3px;overflow:hidden;margin-bottom:22px;}
.progress-fill{height:100%;background:var(--brand-700);transition:width .25s;}
.form-card{background:#fff;border:1px solid var(--grey-300);border-radius:var(--radius);padding:26px 28px;}
.form-card h3{font-family:var(--font-head);margin:0 0 4px;color:var(--brand-900);font-size:1.1rem;}
.form-card .sub{color:var(--grey-500);font-size:.83rem;margin:0 0 22px;}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.grid-3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:16px;}
.form-actions{display:flex;justify-content:space-between;align-items:center;margin-top:26px;padding-top:20px;border-top:1px solid var(--grey-100);}
.form-actions .right{display:flex;gap:10px;}
.qual-block{border:1px solid var(--grey-300);border-radius:var(--radius);padding:18px;margin-bottom:16px;position:relative;}
.qual-block .rm{position:absolute;top:10px;right:12px;background:transparent;border:none;color:var(--danger);font-size:.78rem;font-weight:700;}
.add-link{display:inline-flex;align-items:center;gap:6px;color:var(--brand-700);font-weight:700;font-size:.85rem;border:1px dashed var(--brand-600);padding:9px 16px;border-radius:4px;background:var(--brand-50);}
.add-link:hover{background:var(--brand-100);}
.radio-row{display:flex;gap:20px;margin-bottom:6px;}
.radio-row label{display:flex;align-items:center;gap:6px;font-size:.88rem;font-weight:500;color:var(--grey-700);}

/* Document upload */
.doc-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.doc-card{border:1px solid var(--grey-300);border-radius:var(--radius);padding:15px;}
.doc-card h5{margin:0 0 3px;font-size:.86rem;color:var(--grey-900);}
.doc-card .req-tag{font-size:.68rem;color:var(--danger);font-weight:700;}
.doc-card .meta{font-size:.72rem;color:var(--grey-500);margin:2px 0 10px;}
.doc-upload-btn{border:1.5px dashed var(--grey-300);border-radius:4px;padding:14px;text-align:center;font-size:.8rem;color:var(--grey-500);font-weight:600;}
.doc-upload-btn:hover{border-color:var(--brand-600);color:var(--brand-800);background:var(--brand-50);}
.doc-uploaded{display:flex;align-items:center;gap:10px;background:var(--brand-50);border:1px solid var(--brand-100);border-radius:4px;padding:9px 12px;}
.doc-uploaded .tick{color:var(--brand-700);font-weight:800;}
.doc-uploaded .fname{flex:1;min-width:0;font-size:.8rem;}
.doc-uploaded .fname b{display:block;font-size:.78rem;color:var(--grey-900);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.doc-uploaded .fname span{font-size:.68rem;color:var(--grey-500);}
.doc-uploaded .acts{display:flex;gap:6px;}
.doc-uploaded .acts button{background:transparent;border:none;font-size:.72rem;font-weight:700;color:var(--brand-800);}
.doc-uploaded .acts button.rm{color:var(--danger);}

/* preview */
.preview-section{border:1px solid var(--grey-300);border-radius:var(--radius);margin-bottom:16px;}
.preview-section-head{display:flex;justify-content:space-between;align-items:center;padding:13px 18px;background:var(--grey-100);border-radius:6px 6px 0 0;}
.preview-section-head h5{margin:0;font-family:var(--font-head);font-size:.9rem;color:var(--brand-900);}
.preview-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px 20px;padding:16px 18px;}
.preview-item span{display:block;font-size:.7rem;color:var(--grey-500);text-transform:uppercase;letter-spacing:.3px;margin-bottom:2px;}
.preview-item b{font-size:.86rem;color:var(--grey-900);font-weight:600;}

/* payment */
.pay-summary{background:#fff;border:1px solid var(--grey-300);border-radius:var(--radius);padding:20px 22px;margin-bottom:18px;}
.pay-row{display:flex;justify-content:space-between;padding:8px 0;font-size:.88rem;border-bottom:1px solid var(--grey-100);}
.pay-row.total{border-bottom:none;padding-top:12px;font-weight:800;font-size:1.02rem;color:var(--brand-900);}
.pay-methods{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:22px;}
.pay-method{border:1.5px solid var(--grey-300);border-radius:var(--radius);padding:16px 8px;text-align:center;font-size:.82rem;font-weight:700;color:var(--grey-700);}
.pay-method.active{border-color:var(--brand-700);background:var(--brand-50);color:var(--brand-800);}
.pay-success{text-align:center;padding:30px 20px;}
.tick-circle{width:66px;height:66px;border-radius:50%;background:#e6f6ec;color:var(--ok);font-size:2rem;display:flex;align-items:center;justify-content:center;margin:0 auto 16px;}
.receipt{border:1px solid var(--grey-300);border-radius:var(--radius);padding:18px 20px;text-align:left;max-width:420px;margin:20px auto 0;background:var(--grey-50);}

/* tracking timeline vertical */
.track-timeline{margin-top:24px;}
.tt-item{display:flex;gap:16px;position:relative;padding-bottom:26px;}
.tt-item:last-child{padding-bottom:0;}
.tt-item:before{content:"";position:absolute;left:13px;top:28px;bottom:0;width:2px;background:var(--grey-300);}
.tt-item:last-child:before{display:none;}
.tt-dot{width:28px;height:28px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;font-size:.78rem;font-weight:800;border:2px solid var(--grey-300);background:#fff;color:var(--grey-500);}
.tt-item.done .tt-dot{border-color:var(--brand-700);background:var(--brand-700);color:#fff;}
.tt-item.current .tt-dot{border-color:var(--gold);background:var(--gold);color:#2a1e05;}
.tt-body h5{margin:0 0 2px;font-size:.9rem;color:var(--grey-900);}
.tt-body span.date{font-size:.72rem;color:var(--grey-500);}
.tt-body p{margin:6px 0 0;font-size:.8rem;color:var(--grey-700);background:var(--grey-100);padding:8px 10px;border-radius:4px;display:inline-block;}

/* verify result */
.verify-result{background:#fff;border:1px solid var(--grey-300);border-radius:var(--radius);padding:22px;margin-top:20px;}
.verify-badge{display:inline-flex;align-items:center;gap:6px;background:#e6f6ec;color:var(--ok);font-weight:800;font-size:.78rem;padding:6px 12px;border-radius:20px;margin-bottom:16px;}

/* certificate */
.cert{border:6px double var(--gold);border-radius:6px;padding:34px;background:linear-gradient(180deg,#fdfcf8,#fbf8ee);position:relative;text-align:center;}
.cert .cert-emblem{width:72px;height:72px;border-radius:50%;margin:0 auto 12px;display:flex;align-items:center;justify-content:center;}
.cert .cert-emblem img{width:100%;height:100%;object-fit:contain;}
.cert h2{font-family:var(--font-head);color:var(--brand-900);margin:4px 0;font-size:1.3rem;}
.cert h4{margin:0 0 18px;color:var(--grey-500);font-weight:600;font-size:.85rem;letter-spacing:.5px;text-transform:uppercase;}
.cert .name{font-family:var(--font-head);font-size:1.5rem;color:var(--brand-900);margin:14px 0 4px;}
.cert-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px 30px;text-align:left;max-width:480px;margin:18px auto;font-size:.84rem;}
.cert-grid span{color:var(--grey-500);}
.cert-footer{display:flex;justify-content:space-between;align-items:flex-end;margin-top:26px;}
.qr-ph{width:64px;height:64px;background:repeating-linear-gradient(45deg,#333,#333 3px,#fff 3px,#fff 6px);border:1px solid #333;}
.sig-ph{font-family:var(--font-head);font-style:italic;color:var(--grey-500);border-top:1px solid var(--grey-500);padding-top:4px;font-size:.76rem;}

/* admin */
.admin-shell{min-height:100vh;background:#f1f3f7;}
.admin-topbar{background:var(--brand-deep);color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 20px;height:56px;position:sticky;top:0;z-index:60;}
.admin-brand{display:flex;align-items:center;gap:10px;font-family:var(--font-head);font-weight:700;font-size:.92rem;}
.admin-user{display:flex;align-items:center;gap:12px;font-size:.82rem;}
.metric-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;margin-bottom:22px;}
.metric-card{background:#fff;border:1px solid var(--grey-300);border-radius:var(--radius);padding:15px 16px;}
.metric-card .label{font-size:.68rem;text-transform:uppercase;font-weight:700;color:var(--grey-500);letter-spacing:.3px;}
.metric-card .val{font-family:var(--font-head);font-size:1.3rem;font-weight:800;color:var(--brand-900);margin-top:6px;}
.charts-row{display:grid;grid-template-columns:1.3fr 1fr;gap:16px;margin-bottom:24px;}
.chart-card{background:#fff;border:1px solid var(--grey-300);border-radius:var(--radius);padding:18px 20px;}
.chart-card h5{margin:0 0 14px;font-family:var(--font-head);font-size:.9rem;color:var(--brand-900);}
.bar-row{display:flex;align-items:flex-end;gap:10px;height:140px;}
.bar-col{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:6px;}
.bar-col .bar{width:100%;background:linear-gradient(180deg,var(--brand-600),var(--brand-800));border-radius:3px 3px 0 0;}
.bar-col span{font-size:.65rem;color:var(--grey-500);}
.donut-legend{display:flex;flex-direction:column;gap:8px;margin-top:14px;font-size:.78rem;}
.donut-legend .li{display:flex;align-items:center;gap:8px;}
.donut-legend .sw{width:10px;height:10px;border-radius:2px;}

.table-toolbar{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-bottom:14px;flex-wrap:wrap;}
.filters-row{display:flex;gap:10px;flex-wrap:wrap;background:#fff;border:1px solid var(--grey-300);border-radius:var(--radius);padding:12px 14px;margin-bottom:14px;}
.filters-row select,.filters-row input{padding:7px 9px;border:1px solid var(--grey-300);border-radius:4px;font-size:.8rem;}
.search-box{display:flex;align-items:center;background:#fff;border:1px solid var(--grey-300);border-radius:4px;padding:0 10px;}
.search-box input{border:none;padding:8px 6px;font-size:.84rem;min-width:220px;}
.table-wrap{background:#fff;border:1px solid var(--grey-300);border-radius:var(--radius);overflow:auto;}
table.data-table{width:100%;border-collapse:collapse;font-size:.82rem;min-width:960px;}
table.data-table th{text-align:left;background:var(--grey-100);padding:10px 12px;font-size:.72rem;text-transform:uppercase;color:var(--grey-500);font-weight:700;white-space:nowrap;}
table.data-table td{padding:11px 12px;border-top:1px solid var(--grey-100);white-space:nowrap;}
table.data-table tr:hover td{background:var(--brand-50);}
.row-actions{display:flex;gap:6px;}
.icon-btn{background:transparent;border:1px solid var(--grey-300);border-radius:4px;padding:5px 8px;font-size:.72rem;font-weight:700;color:var(--grey-700);}
.icon-btn:hover{border-color:var(--brand-700);color:var(--brand-800);}

.review-shell{display:grid;grid-template-columns:1fr 1.2fr 1fr;gap:16px;align-items:start;}
.review-col{background:#fff;border:1px solid var(--grey-300);border-radius:var(--radius);padding:18px;}
.review-col h5{margin:0 0 14px;font-family:var(--font-head);font-size:.9rem;color:var(--brand-900);border-bottom:1px solid var(--grey-100);padding-bottom:10px;}
.info-line{display:flex;justify-content:space-between;font-size:.82rem;padding:6px 0;border-bottom:1px dotted var(--grey-100);}
.info-line span{color:var(--grey-500);}
.doc-verify-row{display:flex;justify-content:space-between;align-items:center;padding:9px 0;border-bottom:1px solid var(--grey-100);font-size:.82rem;}
.tri-btns{display:flex;gap:4px;}
.tri-btns button{width:26px;height:26px;border-radius:4px;border:1px solid var(--grey-300);background:#fff;font-size:.72rem;}
.tri-btns button.v-yes.active{background:var(--brand-700);color:#fff;border-color:var(--brand-700);}
.tri-btns button.v-no.active{background:var(--danger);color:#fff;border-color:var(--danger);}
.tri-btns button.v-q.active{background:var(--warn);color:#fff;border-color:var(--warn);}

/* modal / toast */
.modal-overlay{position:fixed;inset:0;background:rgba(10,20,15,.5);display:flex;align-items:center;justify-content:center;z-index:200;padding:20px;}
.modal-box{background:#fff;border-radius:8px;max-width:520px;width:100%;max-height:88vh;overflow:auto;padding:26px 28px;}
.modal-box h3{font-family:var(--font-head);margin:0 0 6px;color:var(--brand-900);}
.modal-box .modal-close{position:absolute;}
.modal-head{display:flex;justify-content:space-between;align-items:flex-start;}
.modal-x{background:transparent;border:none;font-size:1.3rem;color:var(--grey-500);line-height:1;}
.toast-wrap{position:fixed;bottom:22px;right:22px;z-index:300;display:flex;flex-direction:column;gap:10px;}
.toast{background:var(--brand-deep);color:#fff;padding:12px 18px;border-radius:6px;font-size:.84rem;box-shadow:var(--shadow-md);display:flex;align-items:center;gap:10px;animation:toastin .2s ease;min-width:220px;}
.toast.err{background:var(--danger);}
.toast.ok{background:var(--brand-800);}
@keyframes toastin{from{transform:translateY(10px);opacity:0;}to{transform:translateY(0);opacity:1;}}

.empty-state{text-align:center;padding:50px 20px;color:var(--grey-500);}
.empty-state .ic{font-size:2.2rem;margin-bottom:10px;}
.skeleton{background:linear-gradient(90deg,var(--grey-100) 25%,#e3e7ee 37%,var(--grey-100) 63%);background-size:400% 100%;animation:sk 1.3s ease infinite;border-radius:4px;}
@keyframes sk{0%{background-position:100% 50%;}100%{background-position:0 50%;}}

.session-warn{position:fixed;top:0;left:0;right:0;background:var(--warn);color:#fff;text-align:center;padding:9px;font-size:.82rem;font-weight:600;z-index:150;}

.secure-strip{background:var(--brand-50);border-bottom:1px solid var(--brand-100);}
.secure-strip .container{display:flex;align-items:center;gap:8px;padding:6px 20px;font-size:.74rem;color:var(--brand-800);}

/* responsive */
@media (max-width:980px){
  .services-grid{grid-template-columns:repeat(2,1fr);}
  .two-col{grid-template-columns:1fr;}
  .hero-inner{flex-direction:column;padding-top:44px;}
  .hero-text p{max-width:none;}
  nav.main-nav{display:none;}
  .hamburger{display:flex;flex-direction:column;justify-content:center;}
  .dash-shell{flex-direction:column;}
  .dash-side{width:100%;position:static;display:flex;overflow-x:auto;}
  .dash-side a{border-left:none;border-bottom:3px solid transparent;flex:none;}
  .dash-side a.active{border-left-color:transparent;border-bottom-color:var(--brand-700);}
  .action-grid{grid-template-columns:repeat(2,1fr);}
  .stat-grid{grid-template-columns:1fr;}
  .grid-2,.grid-3{grid-template-columns:1fr;}
  .doc-grid{grid-template-columns:1fr;}
  .pay-methods{grid-template-columns:repeat(2,1fr);}
  .footer-grid{grid-template-columns:1fr 1fr;}
  .metric-grid{grid-template-columns:repeat(2,1fr);}
  .charts-row{grid-template-columns:1fr;}
  .review-shell{grid-template-columns:1fr;}
  table.data-table{font-size:.78rem;}
}
@media (max-width:600px){
  .services-grid{grid-template-columns:1fr;}
  .footer-grid{grid-template-columns:1fr;}
  .metric-grid{grid-template-columns:1fr 1fr;}
  .action-grid{grid-template-columns:1fr 1fr;}
  .hero-text h1{font-size:1.7rem;}
  .stepper{gap:0;}
  .header-actions{gap:6px;}
  .header-actions .btn{padding:8px 10px;font-size:.85rem;}
  .header-actions .btn-outline{display:none;}
}

@media print{
  .utility-bar,.main-header,footer,.page-hero,.no-print,.toast-wrap,.modal-overlay{display:none!important;}
  body{background:#fff;} .page-body{padding:0;} .form-card,.cert{box-shadow:none;}
}

/* ===== Registration certificate (A4 landscape, follows the Council's template) ===== */
@font-face{font-family:"MSMC Anton";src:url(/assets/inline-b9beea0804.woff2) format("woff2");font-display:swap;}
@font-face{font-family:"MSMC Fraktur";font-weight:400;src:url(/assets/inline-bee1536e58.woff2) format("woff2");font-display:swap;}
.certwrap{overflow:auto;padding:6px 0 4px;}
.certsheet{position:relative;width:1123px;height:794px;box-sizing:border-box;background:#fff;color:#111;-webkit-print-color-adjust:exact;print-color-adjust:exact;font-family:"Times New Roman",Times,serif;margin:0 auto;}
.certsheet *{box-sizing:border-box;}
.cs-frame{position:absolute;left:18px;right:18px;top:18px;bottom:18px;border:3px solid #111;pointer-events:none;}
.cs-seal{position:absolute;left:62px;top:30px;width:128px;height:auto;}
.cs-org{position:absolute;left:0;right:0;top:24px;text-align:center;font-family:"MSMC Anton",Impact,sans-serif;font-size:42px;letter-spacing:.5px;line-height:1.15;}
.cs-addr{position:absolute;left:0;right:0;top:82px;text-align:center;font-size:19px;}
.cs-act{position:absolute;left:0;right:0;top:114px;text-align:center;font-size:19px;letter-spacing:.2px;}
.cs-title{position:absolute;left:0;right:0;top:148px;text-align:center;font-family:"MSMC Fraktur",serif;font-weight:400;font-size:37px;line-height:1.1;-webkit-text-stroke:.7px #111;}
.cs-title img{width:530px;height:auto;display:inline-block;}
.cs-no{position:absolute;left:46px;top:180px;font-size:21px;}
.cs-photo{position:absolute;right:66px;top:34px;width:108px;height:108px;border:1px solid #bbb;display:flex;align-items:center;justify-content:center;text-align:center;font-size:17px;line-height:1.4;color:#222;overflow:hidden;}
.cs-photo img{width:100%;height:100%;object-fit:cover;}
.cs-table{position:absolute;left:46px;right:46px;top:216px;height:336px;border:3px solid #111;display:grid;grid-template-columns:25.3% 15.3% 26.4% 33%;grid-template-rows:54px 1fr;}
.cs-table>div{padding:10px 14px;font-size:16px;line-height:1.5;border-right:1px solid #111;}
.cs-table>div:nth-child(4n){border-right:0;}
.cs-table .h{text-align:center;border-bottom:1px solid #111;display:flex;align-items:center;justify-content:center;font-size:16px;line-height:1.3;}
.cs-table b{font-weight:700;}
.cs-cert{position:absolute;left:48px;top:568px;width:560px;font-size:18px;line-height:1.45;}
.cs-sign{position:absolute;left:750px;width:330px;top:582px;text-align:center;font-size:18px;line-height:1.45;}
.cs-sign img{position:absolute;left:50%;top:-24px;width:190px;margin-left:-95px;}
.cs-notes{position:absolute;left:52px;top:670px;margin:0;padding-left:20px;font-size:13px;line-height:1.42;width:900px;}
.cs-notes li.prov{font-weight:700;}
.cs-qr{position:absolute;right:66px;bottom:34px;width:88px;height:88px;border:1px solid #bbb;padding:5px;display:flex;align-items:center;justify-content:center;}
.cs-qr svg{width:100%;height:100%;display:block;}
.certnote{max-width:900px;margin:14px auto 0;font-size:.82rem;color:var(--grey-500);}
@media(max-width:1180px){.certsheet{zoom:.82}}
@media(max-width:960px){.certsheet{zoom:.6}}
@media(max-width:700px){.certsheet{zoom:.44}}
@media(max-width:480px){.certsheet{zoom:.33}}
@page{size:A4 landscape;margin:0}
/* QR label sheet: 4 across, 6 down per A4 page */
.qrsheet{display:grid;grid-template-columns:repeat(4,1fr);gap:0;}
.qrcell{border:1px dashed #999;padding:8px 6px;text-align:center;break-inside:avoid;font-size:11px;line-height:1.3;}
.qrcell .qrimg{width:92px;height:92px;margin:0 auto 4px;} .qrcell .qrimg svg{width:100%;height:100%;display:block;}
.qrcell b{display:block;font-size:12px;} .qrcell span{display:block;color:#333;}
@media print{.qrsheet{gap:0}.qrcell{page-break-inside:avoid}}
@media print{.certwrap{overflow:visible;padding:0}.certsheet{zoom:1!important;margin:0;width:1123px;height:794px;page-break-inside:avoid}.certnote{display:none}}
.skip-link{position:absolute;left:-9999px;top:0;background:var(--gold);color:#2a1e05;padding:10px 16px;font-weight:700;z-index:400;border-radius:0 0 6px 0;}
.skip-link:focus{left:0;}
/* ===== Navigation dropdown / mobile ===== */
.nav-link{padding:10px 12px;font-size:.9rem;font-weight:600;color:var(--grey-700);border-radius:4px;background:transparent;border:none;display:inline-block;}
.nav-link:hover,.nav-link.active{color:var(--brand-800);background:var(--brand-50);}
.nav-dd{position:relative;}
nav.main-nav .nav-drop{position:absolute;top:100%;left:0;min-width:260px;background:#fff;border:1px solid var(--grey-300);border-radius:var(--radius);box-shadow:var(--shadow-md);z-index:70;padding:6px;}
nav.main-nav .nav-drop a{display:block;padding:9px 12px;font-size:.86rem;font-weight:600;border-radius:4px;color:var(--grey-700);}
nav.main-nav .nav-drop a:hover{background:var(--brand-50);color:var(--brand-800);}
.mobile-nav{display:none;}
/* ===== Auth backdrop (login / register) ===== */
.auth-bg{background:linear-gradient(125deg,var(--brand-deep),var(--brand-800) 70%);padding:48px 0;min-height:70vh;display:flex;align-items:center;}
.auth-bg .container{width:100%;}
.auth-split{display:flex;gap:56px;align-items:center;justify-content:center;flex-wrap:wrap;}
.auth-hero{color:#fff;flex:1;min-width:280px;max-width:460px;}
.auth-hero h1{font-family:var(--font-head);font-size:2rem;margin:0 0 8px;font-weight:800;}
.auth-hero p{color:#c5d3ea;margin:0;font-size:1rem;}
.trust-row{display:flex;gap:22px;margin-top:28px;flex-wrap:wrap;}
.trust-item{text-align:center;width:88px;font-size:.78rem;font-weight:600;color:#e6edf8;}
.trust-ic{width:58px;height:58px;border-radius:50%;border:1.5px solid rgba(255,255,255,.35);display:flex;align-items:center;justify-content:center;font-size:1.4rem;margin:0 auto 8px;background:rgba(255,255,255,.06);}
.auth-bg .auth-card{margin:0;}
/* ===== Quick links ===== */
.quick-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
.quick-card{background:#fff;border:1px solid var(--grey-300);border-top:3px solid var(--gold);border-radius:var(--radius);padding:20px;display:block;}
.quick-card:hover{box-shadow:var(--shadow-md);}
.quick-card .service-icon{margin-bottom:10px;}
.quick-card h4{margin:0 0 4px;font-family:var(--font-head);font-size:.98rem;color:var(--brand-900);}
.quick-card p{margin:0;font-size:.82rem;color:var(--grey-500);line-height:1.45;}
/* ===== Directory tabs ===== */
.tabs{display:flex;gap:6px;margin-bottom:16px;border-bottom:2px solid var(--grey-300);}
.tab-btn{background:transparent;border:none;padding:11px 18px;font-weight:700;font-size:.9rem;color:var(--grey-500);border-bottom:3px solid transparent;margin-bottom:-2px;}
.tab-btn.active{color:var(--brand-800);border-bottom-color:var(--gold);}
.cme-meter{height:8px;background:var(--grey-100);border-radius:4px;overflow:hidden;margin-top:8px;}
.cme-meter i{display:block;height:100%;background:var(--brand-700);}
@media (max-width:980px){
  .mobile-nav{display:block;background:#fff;border-bottom:1px solid var(--grey-300);padding:6px 20px 14px;}
  .mobile-nav a{display:block;padding:12px 4px;font-weight:600;border-bottom:1px solid var(--grey-100);color:var(--grey-700);}
  .mobile-nav .mn-sub{padding-left:18px;font-weight:500;font-size:.9rem;}
  .quick-grid{grid-template-columns:repeat(2,1fr);}
  .auth-split{gap:30px;}
}
@media (max-width:600px){
  .quick-grid{grid-template-columns:1fr;}
  .smr-btn{display:none;}
  .auth-hero h1{font-size:1.5rem;}
}
/* ===== v1.1 tweaks: centred search-first hero, grouped service panels ===== */
.hero2{background:radial-gradient(ellipse at 50% -10%,#24508f 0%,var(--brand-deep) 64%);color:#fff;text-align:center;padding:76px 0 128px;position:relative;}
.hero2:after{content:"";position:absolute;left:0;right:0;bottom:0;height:4px;background:var(--gold);}
.hero2 h1{font-family:var(--font-head);font-size:3.1rem;line-height:1.1;font-weight:800;margin:0 0 14px;letter-spacing:-.01em;}
.hero2 .sub{font-size:1.12rem;color:#d4e0f2;max-width:640px;margin:0 auto 6px;}
.hero2 .legal{font-size:.84rem;color:#9db4d8;margin:0 auto 30px;}
.hero-search{display:flex;max-width:700px;margin:0 auto;background:#fff;border-radius:8px;padding:6px;box-shadow:0 12px 32px rgba(0,0,0,.28);}
.hero-search input{flex:1;min-width:0;border:none;padding:15px 16px;font-size:1rem;background:transparent;outline:none;color:var(--grey-900);}
.hero-search button{border:none;background:var(--gold);color:#2a1e05;font-weight:700;padding:0 26px;border-radius:6px;font-size:.95rem;}
.hero-search button:hover{filter:brightness(.95);}
.chips{margin-top:20px;display:flex;flex-wrap:wrap;gap:8px;justify-content:center;}
.chips a{border:1px solid rgba(255,255,255,.35);color:#fff;padding:7px 15px;border-radius:20px;font-size:.82rem;font-weight:600;}
.chips a:hover{background:rgba(255,255,255,.14);}
.panels{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:-76px;position:relative;z-index:2;}
.panel{background:#fff;border:1px solid var(--grey-300);border-top:3px solid var(--gold);border-radius:8px;box-shadow:var(--shadow-md);padding:24px 24px 12px;}
.panel h2{font-family:var(--font-head);font-size:1.18rem;font-weight:800;color:var(--brand-900);margin:0 0 4px;}
.panel p{margin:0 0 12px;font-size:.84rem;color:var(--grey-500);}
.plink{display:flex;justify-content:space-between;gap:10px;padding:11px 6px;border-top:1px solid var(--grey-100);font-size:.9rem;font-weight:600;color:var(--grey-700);}
.plink:after{content:"›";color:var(--brand-600);font-size:1.15rem;line-height:1;}
.plink:hover{color:var(--brand-700);background:var(--brand-50);}
.service-card{border-left:4px solid var(--gold);}
.service-card .service-icon{display:none;}
@media (max-width:980px){.panels{grid-template-columns:1fr;margin-top:-60px;}.hero2{padding:54px 0 104px;}.hero2 h1{font-size:2.2rem;}}
@media (max-width:600px){.hero-search{flex-direction:column;gap:6px;}.hero-search button{padding:13px;}.hero2 h1{font-size:1.85rem;}}
