cyb/src/features/adviser/AdviserContainer.module.scss

.wrapper {
  position: sticky;
  top: 70px;
  width: 60%;
  z-index: 4;
  min-height: 60px; // 2 lines of text
  margin: -40px auto 25px;
  display: flex;
  justify-content: center;

  @media (max-width: 768px) {
    position: fixed;
    top: calc(35px + env(safe-area-inset-top, 0px));
    transform: translateY(-50%);
    left: 66px;
    right: 66px;
    width: auto;
    margin: 0;
    min-height: unset;
    z-index: 3;
    overflow: visible;
    max-height: none;
  }
}

.blurWrapper {
  position: absolute;
  padding: 0 10px;

  &::before {
    content: '';
    position: absolute;
    background-color: black;
    z-index: -1;
    width: 100%;
    height: 110%;
    left: 0;
    filter: blur(12px);
  }

  @media (max-width: 768px) {
    position: relative;
    width: 100%;
    font-size: 11px;
    line-height: 14px;
    text-align: center;
    padding: 4px 8px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;

    * {
      font-size: 11px !important;
      line-height: 14px !important;
    }
  }
}