[data-toggle-content] {
  &.text-toggle-hidden {
    position: relative;
    height: 500px;
    overflow: hidden;
    margin: var(--margin-vertical-base-horizontal-zero);

    & p:first-of-type {
      margin-top: 0;
    }

    &::after {
      position: absolute;
      z-index: 1;
      content: '';
      box-shadow: var(--box-shadow-text-toggle);
      width: 100%;
      height: 20%;
      bottom: 0;
      left: 0;
    }
  }

  & + button[data-toggle-button]:has(+ *) {
    margin: 0 0 var(--spacing-base);
  }
}