:root {
  --glass-bg: rgba(20, 20, 30, 0.7);
  --glass-border: rgba(255, 255, 255, 0.1);
  --glass-shadow: rgba(0, 0, 0, 0.3);
}

body {
  background-image: url('https://images.unsplash.com/photo-1557683316-973673baf926?q=80&w=2029&auto=format&fit=crop');
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
}

.service-card, .resource-widget, .datetime-widget {
  background: var(--glass-bg) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
  border: 1px solid var(--glass-border) !important;
  border-radius: 16px !important;
  box-shadow: 0 8px 32px 0 var(--glass-shadow) !important;
}

.service-title {
  font-weight: 600 !important;
  color: rgba(255, 255, 255, 0.95) !important;
}

.service-description {
  color: rgba(255, 255, 255, 0.7) !important;
}