:root {
  --custom-blue: #04aa22;          /* Azul DodgerBlue vivo */
  --custom-blue-dark: #04aa22;     /* Azul mais escuro para hover */
  --custom-blue-light: #6ec1ff;    /* Azul claro para destaques */
  --background-light: #ffffff;     /* Fundo branco */
}

body {
  font-family: 'Inter', sans-serif;
  background-color: var(--background-light);
  color: #333;
}

/* Fundo personalizado */
.bg-fundo {
  background-color: var(--background-light);
}

.bg-customBlue {
  background-color: var(--custom-blue);
}

.bg-customBlueDark {
  background-color: var(--custom-blue-dark);
}

.text-customBlue {
  color: var(--custom-blue);
}

.text-customBlueLight {
  color: var(--custom-blue-light);
}

.text-customBlueDark {
  color: var(--custom-blue-dark);
}

/* Botões */
.btn-customBlue {
  background-color: var(--custom-blue);
  color: #fff;
  padding: 0.6rem 1.2rem;
  border-radius: 0.5rem;
  font-weight: 600;
  cursor: pointer;
  border: none;
  transition: background-color 0.3s ease;
}

.btn-customBlue:hover,
.btn-customBlue:focus {
  background-color: var(--custom-blue-dark);
  outline: none;
  box-shadow: 0 0 8px var(--custom-blue-light);
}

/* Sombra para cards */
.shadow-card {
  box-shadow: 0 8px 20px rgba(30, 144, 255, 0.15);
}

/* Exemplo de animação pulse com a cor azul */
.pulse-animation {
  animation: pulse 2s infinite;
}

@keyframes pulse {
  0% {
    box-shadow: 0 0 0 0 rgba(30, 144, 255, 0.7);
  }
  70% {
    box-shadow: 0 0 0 10px rgba(30, 144, 255, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
  }
}