cyb/src/containers/application/Header/Header.module.scss

.wrapper {
  display: flex;
  justify-content: space-between;
  position: sticky;
  top: 0;
  padding: 15px;
  padding-top: calc(15px + env(safe-area-inset-top, 0px));
  padding-bottom: 0;
  z-index: 4;

  @media (max-width: 768px) {
    padding: 5px;
    padding-top: calc(5px + env(safe-area-inset-top, 0px));
    z-index: 101;
  }


  &::before {
    content: '';
    height: 100%;
    width: 110%;
    position: absolute;
    top: -5px;
    z-index: -1;
    left: -5%;
    filter: blur(5px);
    background: linear-gradient(
      180deg,
      rgb(0 0 0 / 92%) 82.81%,
      rgb(0 0 0 / 0%) 100%
    );
  }

  &.scroll {
    &::before {
      background-color: #000;
    }
  }
}