:root{
  --bg: #090c1a;
  --panel: #10142b;
  --panel-soft: rgba(255,255,255,.05);
  --line-soft: rgba(255,255,255,.12);
  --line-strong: rgba(255,255,255,.22);
  --cyan: #2dd4e8;
  --violet: #8b6bf2;
  --amber: #f4b740;
  --text: #f4f6fb;
  --text-dim: #aab3cf;
  --radius: 16px;
  --radius-sm: 10px;
}

*{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; }
body{
  background:var(--bg);
  color:var(--text);
  font-family:"Work Sans", -apple-system, sans-serif;
  font-size:15.5px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
h1,h2,h3{ font-family:"Sora", -apple-system, sans-serif; text-wrap:balance; font-weight:700; }
.wrap{ max-width:1180px; margin:0 auto; padding-inline:24px; }
.mono{ font-family:"JetBrains Mono", monospace; }

/* ---------- Topbar / Header ---------- */
.topnav-sticky{ position:sticky; top:0; z-index:50; }
.topbar{ background:#05070f; border-bottom:1px solid var(--line-soft); font-size:12.5px; }
.topbar .wrap{ display:flex; align-items:center; justify-content:space-between; padding-block:8px; flex-wrap:wrap; gap:8px; }
.topbar .tag{ color:var(--text-dim); font-family:"JetBrains Mono",monospace; letter-spacing:.04em; font-size:11.5px; }
.topbar .info{ display:flex; gap:20px; align-items:center; flex-wrap:wrap; }
.topbar .info a{ color:var(--text-dim); }
.topbar .info a:hover{ color:var(--cyan); }
.topbar .info span{ color:var(--text-dim); }

header{ background:rgba(9,12,26,.92); backdrop-filter:blur(10px); border-bottom:1px solid var(--line-soft); }
.nav{ display:flex; align-items:center; justify-content:space-between; padding-block:14px; position:relative; }
.brand{ display:flex; align-items:center; gap:12px; }
.brand img.wordmark{ height:76px; width:auto; display:block; border-radius:12px; }
.brand .brand-text{ font-family:"Sora", sans-serif; font-weight:800; font-size:23px; letter-spacing:.01em;
  background:linear-gradient(100deg,#2dd4a8,#2dd4e8); -webkit-background-clip:text; background-clip:text; color:transparent; }
.brand .name{ font-weight:800; font-size:16px; letter-spacing:.02em; color:#fff; }
.brand .sub{ font-size:11.5px; color:var(--text-dim); font-family:"JetBrains Mono",monospace; letter-spacing:.03em; }
.navlinks{ display:flex; gap:30px; font-size:14px; font-weight:600; }
.navlinks a{ color:var(--text-dim); transition:color .15s; }
.navlinks a:hover, .navlinks a.active{ color:#fff; }
.navright{ display:flex; align-items:center; gap:14px; }
.btn{ display:inline-flex; align-items:center; gap:8px; font-weight:700; font-size:14.5px; border-radius:999px; padding:13px 26px; transition:transform .15s, opacity .15s; border:1px solid transparent; }
.btn:hover{ transform:translateY(-1px); }
.btn-cyan{ background:linear-gradient(135deg,var(--cyan),#1aa6c4); color:#06111a; }
.btn-outline{ border-color:var(--line-strong); color:#fff; }
.btn-outline:hover{ border-color:var(--cyan); }
.menu-btn{ display:none; width:38px; height:38px; border-radius:8px; border:1px solid var(--line-soft); background:transparent; flex-direction:column; align-items:center; justify-content:center; gap:4px; cursor:pointer; }
.menu-btn span{ width:18px; height:2px; background:#fff; }

/* ---------- Hero ---------- */
.hero{ padding-block:70px 56px; position:relative; }
.hero-grid{ display:grid; grid-template-columns:1.05fr .95fr; gap:56px; align-items:center; }
.hero-eyebrow{ font-family:"JetBrains Mono",monospace; font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--cyan); margin-bottom:18px; font-weight:600; }
h1{ font-size:clamp(20px,2.6vw,32px); line-height:1.15; letter-spacing:-.01em; color:#fff; }
h1 .hl{ background:linear-gradient(100deg,var(--cyan),var(--violet)); -webkit-background-clip:text; background-clip:text; color:transparent; }
.lede{ margin-top:20px; color:var(--text-dim); font-size:16.5px; max-width:52ch; }
.hero-ctas{ display:flex; gap:14px; margin-top:32px; flex-wrap:wrap; }
.feat-strip{ display:grid; grid-template-columns:repeat(2,1fr); gap:16px; margin-top:44px; }
.feat{ background:var(--panel-soft); border:1px solid var(--line-soft); border-radius:var(--radius-sm); padding:16px 18px; }
.feat .ic{ width:30px; height:30px; color:var(--cyan); margin-bottom:10px; }
.feat b{ display:block; font-size:14px; color:#fff; margin-bottom:3px; }
.feat span{ font-size:12.5px; color:var(--text-dim); }

.hero-visual{ position:relative; }
.license-panel{ background:linear-gradient(160deg,#141a38,#0a0d1d); border:1px solid var(--line-soft); border-radius:20px; padding:28px; position:relative; overflow:hidden; }
.license-panel::before{ content:""; position:absolute; inset:0; background:radial-gradient(circle at 80% 0%, rgba(45,212,232,.16), transparent 55%); pointer-events:none; }
.license-row{ display:flex; align-items:center; justify-content:space-between; padding:13px 16px; background:rgba(255,255,255,.04); border:1px solid var(--line-soft); border-radius:10px; margin-bottom:10px; position:relative; }
.license-row:last-child{ margin-bottom:0; }
.license-row .nm{ display:flex; align-items:center; gap:12px; font-size:13.5px; font-weight:600; color:#fff; }
.license-row .dot{ width:9px; height:9px; border-radius:50%; flex-shrink:0; }
.license-row .st{ font-family:"JetBrains Mono",monospace; font-size:11px; color:var(--cyan); background:rgba(45,212,232,.12); padding:4px 10px; border-radius:999px; }

/* ---------- Brand strip ---------- */
.brandstrip{ padding-block:34px; border-top:1px solid var(--line-soft); border-bottom:1px solid var(--line-soft); background:rgba(255,255,255,.015); }
.brandstrip .wrap{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; justify-content:center; }
.brandstrip .label{ font-family:"JetBrains Mono",monospace; font-size:11.5px; color:var(--text-dim); letter-spacing:.08em; text-transform:uppercase; margin-right:6px; }
.pill{ display:inline-flex; align-items:center; gap:8px; padding:9px 16px; border-radius:999px; border:1px solid var(--line-soft); background:var(--panel-soft); font-size:13px; font-weight:600; color:#dfe4f2; }
.pill .sw{ width:8px; height:8px; border-radius:50%; }

/* ---------- Stats ---------- */
.stats{ padding-block:58px; }
.stats .wrap{ display:grid; grid-template-columns:repeat(4,1fr); gap:22px; }
.stat{ display:flex; align-items:center; gap:14px; }
.stat .ic{ width:34px; height:34px; color:var(--violet); flex-shrink:0; }
.stat b{ display:block; font-size:24px; color:#fff; font-family:"Sora",sans-serif; }
.stat span{ font-size:12.5px; color:var(--text-dim); }

/* ---------- Section head ---------- */
.sec-head{ max-width:640px; margin-bottom:42px; }
.eyebrow{ display:flex; align-items:center; gap:10px; font-family:"JetBrains Mono",monospace; font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--cyan); margin-bottom:14px; font-weight:600; }
.sec-head h2{ font-size:clamp(26px,3vw,36px); color:#fff; margin-bottom:12px; }
.sec-head p{ color:var(--text-dim); font-size:15.5px; }

/* ---------- Services / cards ---------- */
.services, .about-sec, .why, .contact{ padding-block:72px; }
.svc-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.svc-card{ background:var(--panel); border:1px solid var(--line-soft); border-radius:var(--radius); overflow:hidden; transition:border-color .15s, transform .15s; }
.svc-card:hover{ border-color:var(--line-strong); transform:translateY(-3px); }
.svc-media{ height:128px; position:relative; display:flex; align-items:flex-end; padding:16px; }
.svc-media .badge{ width:48px; height:48px; border-radius:12px; background:rgba(255,255,255,.1); border:1px solid var(--line-strong); display:flex; align-items:center; justify-content:center; }
.svc-media .badge svg{ width:26px; height:26px; }
.svc-body{ padding:22px 22px 24px; }
.svc-body h3{ font-size:17.5px; color:#fff; margin-bottom:9px; }
.svc-body p{ color:var(--text-dim); font-size:14px; margin-bottom:14px; }
.svc-body a{ font-size:13.5px; font-weight:700; color:var(--cyan); }
.svc-body a:hover{ text-decoration:underline; }

/* ---------- About ---------- */
.about-grid{ display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:start; }
.about-grid p{ color:var(--text-dim); margin-bottom:16px; font-size:15.5px; }
.about-grid p:last-child{ margin-bottom:0; }
.about-list{ display:flex; flex-direction:column; gap:14px; }
.about-item{ display:flex; gap:14px; padding:16px; background:var(--panel-soft); border:1px solid var(--line-soft); border-radius:var(--radius-sm); }
.about-item .ic{ width:24px; height:24px; color:var(--cyan); flex-shrink:0; margin-top:2px; }
.about-item b{ display:block; color:#fff; font-size:14.5px; margin-bottom:3px; }
.about-item span{ color:var(--text-dim); font-size:13.5px; }

/* ---------- Why ---------- */
.why-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:22px; }
.why-card{ background:var(--panel); border:1px solid var(--line-soft); border-radius:var(--radius); padding:26px; }
.why-card .num{ font-family:"JetBrains Mono",monospace; font-size:12.5px; color:var(--violet); margin-bottom:12px; font-weight:700; }
.why-card h3{ font-size:17px; color:#fff; margin-bottom:9px; }
.why-card p{ color:var(--text-dim); font-size:14px; }

/* ---------- Contact ---------- */
.office-card{ background:var(--panel); border:1px solid var(--line-soft); border-radius:var(--radius); padding:30px; }
.office-card .tag{ font-family:"JetBrains Mono",monospace; font-size:11.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--cyan); font-weight:700; margin-bottom:10px; display:block; }
.office-card h3{ font-size:19px; color:#fff; margin-bottom:12px; }
.office-card address{ font-style:normal; color:var(--text-dim); font-size:14.5px; line-height:1.7; margin-bottom:20px; }
.office-row{ display:flex; align-items:center; gap:12px; padding:11px 0; border-top:1px solid var(--line-soft); font-size:14px; }
.office-row:first-of-type{ border-top:1px solid var(--line-soft); }
.office-row .ic{ width:18px; height:18px; color:var(--cyan); flex-shrink:0; }
.office-row a:hover{ color:var(--cyan); }

.contact-layout{ display:grid; grid-template-columns:.85fr 1.15fr; gap:32px; align-items:start; }
.enquiry-form{ background:var(--panel); border:1px solid var(--line-soft); border-radius:var(--radius); padding:32px; }
.enquiry-form .tag{ font-family:"JetBrains Mono",monospace; font-size:11.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--cyan); margin-bottom:10px; display:block; font-weight:700; }
.enquiry-form h3{ color:#fff; font-size:20px; margin-bottom:8px; }
.enquiry-form .sub{ display:block; color:var(--text-dim); font-size:14px; margin-bottom:24px; }
.form-grid{ display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.field{ display:flex; flex-direction:column; gap:7px; }
.field.full{ grid-column:1 / -1; }
.field label{ font-size:12.5px; font-weight:700; color:var(--text-dim); letter-spacing:.02em; }
.field input, .field textarea, .field select{ background:rgba(255,255,255,.06); border:1px solid var(--line-strong); border-radius:8px; padding:11px 14px; color:#fff; font-family:inherit; font-size:14.5px; }
.field input::placeholder, .field textarea::placeholder{ color:#6c7797; }
.field input:focus, .field textarea:focus, .field select:focus{ outline:none; border-color:var(--cyan); }
.field textarea{ resize:vertical; min-height:104px; }
.enquiry-form button{ margin-top:22px; }

/* ---------- Footer ---------- */
footer{ border-top:1px solid var(--line-soft); padding-block:26px; }
.foot-wrap{ display:flex; align-items:center; justify-content:space-between; font-size:12.5px; color:var(--text-dim); flex-wrap:wrap; gap:10px; }

/* ---------- Responsive ---------- */
@media (max-width:980px){
  .hero-grid{ grid-template-columns:1fr; }
  .hero-visual{ order:-1; }
  .feat-strip{ grid-template-columns:1fr 1fr; }
  .stats .wrap{ grid-template-columns:1fr 1fr; gap:28px 20px; }
  .svc-grid{ grid-template-columns:1fr 1fr; }
  .about-grid{ grid-template-columns:1fr; gap:34px; }
  .why-grid{ grid-template-columns:1fr; }
  .contact-layout{ grid-template-columns:1fr; }
}
@media (max-width:860px){
  .form-grid{ grid-template-columns:1fr; }
}
@media (max-width:720px){
  .navlinks, .navright .btn{ display:none; }
  .menu-btn{ display:flex; }
  .topbar .info{ display:none; }
  .svc-grid{ grid-template-columns:1fr; }
  .feat-strip{ grid-template-columns:1fr; }
}
@media (max-width:560px){
  .stats .wrap{ grid-template-columns:1fr 1fr; }
  .hero{ padding-block:46px 36px; }
}