.hero_image {
  box-shadow: var(--primary-box-shadow);
}

.hero_buttons {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

.hero_buttons .button {
  width: auto;
}

.hero_buttons i {
  color: #fff;
}

/* Tablet */
@media (max-width: 1024px) {
  .hero_image {
    width: 340px;
    height: 340px;
  }
}

/* Mobile landscape */
@media (max-width: 768px) {
  .hero_container {
    flex-direction: column-reverse;
  }
}
