*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  scroll-padding-top: 84px;
}

body {
  font-family: "Inter", Arial, Helvetica, sans-serif;
  background: #f4f7fb;
  color: #1d2733;
}

.nav-glass {
  background: rgba(15, 23, 42, 0.86);
  border-bottom: 1px solid rgba(255, 255, 255, 0.14);
  backdrop-filter: blur(8px);
}

.brand-icon {
  width: 30px;
  height: 30px;
}

.hero-section {
  padding-top: 112px;
  padding-bottom: 62px;
  background: radial-gradient(circle at top left, #1e293b, #0f172a 60%);
}

.domain-pill {
  background: rgba(255, 255, 255, 0.12);
  border: 1px solid rgba(255, 255, 255, 0.2);
  color: #fff;
  border-radius: 999px;
  padding: 8px 14px;
  font-size: 0.9rem;
}

.hero-card {
  background: #ffffff;
  border-radius: 16px;
  box-shadow: 0 12px 28px rgba(2, 6, 23, 0.2);
}

.hero-logo {
  width: 72px;
  height: 72px;
}

.section-icon {
  color: #0d6efd;
}

.service-card {
  background: #ffffff;
  border: 1px solid #dfe5ee;
  border-radius: 14px;
  box-shadow: 0 4px 10px rgba(15, 23, 42, 0.04);
}

.service-card i {
  color: #0d6efd;
}

.about-box {
  background: linear-gradient(145deg, #ffffff, #f7faff);
  border: 1px solid #dfe5ee;
  border-radius: 16px;
}

.network-card {
  background: #ffffff;
  border: 1px solid #dfe5ee;
  border-radius: 14px;
}

.social-link {
  border-radius: 999px;
}

.contact-card {
  background: #0f172a;
  color: #e5e7eb;
  border-radius: 16px;
}

.contact-card h2 {
  color: #ffffff;
}

.site-footer {
  background: #ffffff;
  border-top: 1px solid #dfe5ee;
}

.footer-icons a {
  color: #0d6efd;
  font-size: 1.2rem;
}

.footer-icons a:hover {
  color: #0a58ca;
}

.navbar-nav .nav-link.active {
  font-weight: 600;
}

.btn i {
  line-height: 1;
}

@media (max-width: 991px) {
  .hero-section {
    padding-top: 92px;
  }
}

@media (max-width: 576px) {
  .hero-section {
    padding-top: 86px;
    padding-bottom: 44px;
  }
}