body::after{
  content:"";
  position: fixed;
  top: -120vh;
  bottom: -120vh;
  left: -20vw;
  right: -20vw;
  pointer-events: none;
  z-index: -2;
  transform: translateZ(0);
  background:
    radial-gradient(160% 140% at 50% 12%, rgba(0,0,0,0) 0%, rgba(0,0,0,0.1) 45%, rgba(0,0,0,0.32) 70%, rgba(0,0,0,0.55) 100%),
    linear-gradient(180deg, rgba(0,0,0,0.12) 0%, rgba(0,0,0,0.58) 74%, rgba(0,0,0,0.86) 100%);
  background-repeat: no-repeat;
  background-size: 200% 180%, 100% 140%;
  background-position: 50% -24vh, 50% 0;
  background-attachment: fixed, fixed;
}

@media (max-width: 899.98px){
  body{
    padding-bottom: calc(96px + env(safe-area-inset-bottom, 0px));
  }

  main{
    padding-bottom: calc(120px + env(safe-area-inset-bottom, 0px));
  }
}

@media (min-width: 900px) {
  .floating-actions {
    display: none !important;
  }

}

@media (max-width: 1024px){ .about{ grid-template-columns: 1fr; } }

@media (max-width: 480px){
  .connect-actions{ flex-direction: column; }
}

@media (min-width: 480px){
  .contact-modal .contact-actions{ flex-direction: row; }
}
