:root{
  --page:#0b1020;
  --section:#0f172a;
  --card:#18243a;
  --accent:#06b6d4;
  --accent2:#a855f7;
  --text:#e5eefb;
  --soft:#cbd5e1;
}
html,body{ background:var(--page); color:var(--text); scroll-behavior:smooth; }
a{ color:var(--accent); text-decoration:none; }
a:hover{ color:var(--accent2); }
.text-muted, .small.text-muted { color:var(--soft)!important; }

/* Navbar */
.navbar{ background:rgba(15,23,42,.95)!important; backdrop-filter:blur(6px); }
.navbar-brand, .nav-link{ color:#fff!important; }
.navbar-brand span{ color:var(--accent); }

/* Hero */
.hero{
  padding:140px 0 96px;
  background:linear-gradient(135deg, var(--accent), var(--accent2));
  color:#fff; text-align:center;
}
.hero h1{ font-weight:800; letter-spacing:-.02em; }

/* Sections and titles */
section{ background:var(--section); }
.section-title{ font-weight:800; border-left:4px solid var(--accent); padding-left:10px; }

/* Cards */
.card-dark{
  background:var(--card); color:var(--text);
  border:none; border-radius:16px; box-shadow:0 10px 30px rgba(0,0,0,.35);
}
.card-dark .card-body, .card-dark p, .card-dark .small{ color:var(--soft); }
.card-dark:hover{ transform:translateY(-2px); transition:.2s ease; box-shadow:0 14px 34px rgba(0,0,0,.45); }
.project-thumb{ border-radius:12px; object-fit:cover; aspect-ratio:16/10; width:100%; }

/* Service icon */
.service-icon{
  width:48px; height:48px; border-radius:12px;
  background:linear-gradient(135deg, var(--accent2), var(--accent));
  color:#fff; font-weight:700; display:flex; align-items:center; justify-content:center; font-size:18px;
  box-shadow:0 6px 16px rgba(6,182,212,.25);
}

/* Testimonial */
.testimonial{ background:var(--card); border:none; border-radius:16px; color:var(--text); }

/* Buttons */
.btn-accent{
  background:linear-gradient(135deg,var(--accent),var(--accent2));
  border:none; color:#fff; font-weight:700;
}
.btn-accent:hover{ filter:brightness(.92); color:#fff; }
.btn-outline-light{ border-color:#ffffff88; color:#fff; }
.btn-outline-light:hover{ background:#ffffff22; color:#fff; }

/* Footer */
footer{ background:#0a0f1e; color:var(--soft); }
footer a{ color:#fff; }

/* Utilities */
img[loading="lazy"]{ content-visibility:auto; }
#toTop{ position:fixed; right:16px; bottom:16px; display:none; z-index:999; }