:root {
  --color-50: 245 250 247;
  --color-100: 226 238 232;
  --color-200: 191 214 203;
  --color-300: 152 188 173;
  --color-400: 114 160 144;
  --color-500: 75 130 114;
  --color-600: 56 103 90;
  --color-700: 42 79 69;
  --color-800: 30 58 51;
  --color-900: 19 38 33;
}

body {
  letter-spacing: 0.01em;
  background-image: radial-gradient(circle at 20% 20%, rgba(255, 255, 255, 0.1), transparent 32%),
    radial-gradient(circle at 80% 0%, rgba(120, 200, 180, 0.18), transparent 30%);
}

.card {
  border: 1px solid rgba(255, 255, 255, 0.14);
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.28);
  backdrop-filter: blur(10px);
  border-radius: 14px;
  transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
}

.card:hover {
  transform: translateY(-2px);
  border-color: rgba(150, 220, 200, 0.45);
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.36);
}

.group-title {
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-weight: 700;
}

.information-widget {
  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  backdrop-filter: blur(8px);
}

.service-description {
  opacity: 0.88;
}
