/* Button Hover States */
.btn.btn--primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 30px #2a2564cc, inset 0 4px 20px #b4aaffcc;
  transition: all 0.3s ease;
}

/* Benefits Grid Layout */
.benefits__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-gap: 24px;
  width: 100%;
  max-width: 1320px;
  margin: 0 auto;
  padding: 40px;
}

.benefits__grid > div:last-child {
  grid-column: 1 / -1;
  width: 100%;
  max-width: 100%;
}

.card.card--benefit.card--glow {
  display: flex;
  background-image: linear-gradient(116.47deg, #0f0d1a 0%, #191436 100%);
  border-radius: 32px;
  padding: 40px;
  box-shadow: 0 0 84px rgba(77, 48, 255, 0.6);
  height: 100%;
}

/* Additional styling for aicard */
.aicard {
  display: flex;
  background-image: linear-gradient(130.9deg, #0f0d1a, #191436);
  border-radius: 32px;
  padding: 40px;
  gap: 16px;
}

.benefits__grid > div:last-child {
  max-width: 100%;
}

.card__icon-container {
  flex-shrink: 0;
  background-image: linear-gradient(135deg, #8166ff, #421afe);
  border-radius: 100px;
  width: 86px;
  height: 86px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.card__content {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.card__content h3 {
  margin-top: 0;
  margin-bottom: 0;
}

.card__content p {
  margin-bottom: 0;
}

/* Service Cards */
.card.card--service.card--glow {
  width: 100%;
  max-width: 100%;
}

/* Case Studies */
.case-study.case-study--metasafe {
  height: 630px;
  background-image: linear-gradient(180deg, hsla(234.50704225352112, 83.53%, 66.67%, 1.00), rgba(22, 72, 153, 1));
  box-shadow: none;
}

.case-study.case-study--qwello {
  height: 630px;
  background-image: linear-gradient(170deg, #468741 -9.49%, #171F16 97.07%);
  box-shadow: none;
}

.case-study.case-study--clive-agents {
  height: 630px;
  background-image: linear-gradient(173deg, #6370F1 5.37%, #0F111D 97.15%);
  box-shadow: none;
}

/* Set case study logo to object-fit: contain */
.case-study__logo {
  object-fit: contain;
}

@media screen and (max-width: 768px) {
  .benefits__grid {
    grid-template-columns: 1fr;
  }

  .card.card--benefit.card--glow {
    max-width: 100%;
  }
}