:root {
  --primary: #004275;
  --primary-container: #005a9c;
  --on-primary: #ffffff;
  --on-primary-container: #afd1ff;
  --background: #f9f9ff;
  --on-background: #151c27;
  --surface: #f9f9ff;
  --on-surface: #151c27;
  --on-surface-variant: #414750;
  --surface-container: #e7eefe;
  --surface-container-low: #f0f3ff;
  --surface-container-highest: #dce2f3;
  --outline: #727781;
  --outline-variant: #c1c7d2;
}

body {
  font-family: 'Source Sans 3', sans-serif;
  background-color: var(--background);
  color: var(--on-surface);
}

h1, h2, h3, h4, h5, h6, .navbar-brand {
  font-family: 'Inter', sans-serif;
}

/* Typography utilities mapped to Bootstrap */
.text-primary-custom { color: var(--primary) !important; }
.bg-primary-custom { background-color: var(--primary) !important; color: var(--on-primary); }
.bg-primary-container { background-color: var(--primary-container) !important; color: var(--on-primary-container); }
.text-on-surface { color: var(--on-surface) !important; }
.text-on-surface-variant { color: var(--on-surface-variant) !important; }
.bg-surface-container { background-color: var(--surface-container) !important; }

/* Custom Navbar */
.navbar-custom {
  background-color: rgba(249, 249, 255, 0.95);
  backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--outline-variant);
}

.navbar-custom .nav-link {
  color: var(--on-surface-variant);
  font-family: 'Inter', sans-serif;
  font-weight: 600;
  font-size: 14px;
}

.navbar-custom .nav-link:hover, .navbar-custom .nav-link.active {
  color: var(--primary);
}

.btn-primary-custom {
  background-color: var(--primary);
  color: var(--on-primary);
  border: none;
  font-weight: 600;
  font-family: 'Inter', sans-serif;
  transition: all 0.2s ease-in-out;
}

.btn-primary-custom:hover {
  background-color: var(--primary-container);
  color: var(--on-primary);
  transform: scale(1.02);
}

/* Background patterns */
.technical-grid {
  background-image: radial-gradient(circle, var(--outline) 1px, transparent 1px);
  background-size: 32px 32px;
  opacity: 0.05;
}

/* Animations */
.fade-in-section {
  opacity: 0;
  transform: translateY(20px);
  visibility: hidden;
  transition: opacity 0.6s ease-out, transform 0.6s ease-out;
  will-change: opacity, visibility;
}

.fade-in-section.is-visible {
  opacity: 1;
  transform: none;
  visibility: visible;
}

/* Service Card Hover Effect */
.service-card { transition: transform 0.3s ease, box-shadow 0.3s ease; }
.service-card:hover { transform: translateY(-8px); box-shadow: 0 15px 30px rgba(0,0,0,0.08) !important; }
.service-card:hover .bg-primary-custom { transform: scale(1.1); transition: transform 0.3s ease; }
/* Custom Links */
.custom-link { transition: color 0.2s; }
.custom-link:hover { color: var(--primary) !important; text-decoration: underline !important; text-decoration-color: var(--primary) !important; }
.letter-spacing-1 { letter-spacing: 0.05em; }

