/* Landing page shared styles */

.landing {
  max-width: 100%;
  margin: 0;
  padding: 0;
}

/* Button styles used across landing components */

.btn-primary {
  display: inline-block;
  padding: 0.625rem 1.5rem;
  font-size: 0.9375rem;
  font-weight: 600;
  color: #ffffff;
  background-color: var(--color-primary);
  border: none;
  border-radius: var(--radius);
  cursor: pointer;
  text-decoration: none;
  transition: background-color 0.15s ease, transform 0.1s ease, box-shadow 0.15s ease;
}

.btn-primary:hover {
  background-color: var(--color-primary-hover);
  text-decoration: none;
  box-shadow: 0 4px 12px rgba(109, 40, 217, 0.3);
}

.btn-primary:active {
  transform: scale(0.98);
}

.btn-outline {
  display: inline-block;
  padding: 0.5625rem 1.5rem;
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--color-primary);
  background: transparent;
  border: 2px solid var(--color-primary);
  border-radius: var(--radius);
  cursor: pointer;
  text-decoration: none;
  transition: background-color 0.15s ease, color 0.15s ease;
}

.btn-outline:hover {
  background-color: var(--color-primary);
  color: #ffffff;
  text-decoration: none;
}

.btn-large {
  padding: 0.875rem 2.5rem;
  font-size: 1.125rem;
  border-radius: calc(var(--radius) + 4px);
}