
body {

  > picture {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    width: 100vw;
    height: 100vh;
    isolation: isolate;

    &::before, &::after {
      content: '';
      display: block;
      background: linear-gradient(35deg, rgb(0, 0, 0) 10%, rgba(0, 0, 0, 0) 80%, rgba(0, 0, 0, 0) 100%);
      position: absolute;
      bottom: 0;
      left: 0;
      top: 0;
      width: 100%;
    }

    &::after {
      background: linear-gradient(180deg, rgb(0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 0) 100%);
    }
    
    >img {
      z-index: -1;
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
  }
  
  main {
    position: relative;
    display: grid;

    section {

      >h1 {
        line-height: 1.75;
      }

      > p {
        white-space: unset;
        margin: 1rem 0;
        
        span {
          display: block;
          opacity: 0.75;
          font-size: 0.75rem;
        }
      }
    }

    
    img {
      height: 6rem;
      margin-top: 4rem;
      margin-bottom: -2rem;
      margin-left: var(--page-padding);
    }

    input, button, textarea {
      backdrop-filter: blur(5px);
    }
  }

  footer {
    position: relative;
    text-align: center;
    padding: 2rem var(--page-padding);
    
    a {
      padding: 0.5rem;
    }
  }

}