<input type="checkbox" id="input" checked />

<label for="input" style="user-select: none">click me</label>

<p>

  Lorem ipsum dolor sit amet consectetur adipisicing elit. Quos ut labore voluptatem ipsa vel tenetur

  obcaecati, sint sit nostrum saepe! Hic debitis voluptatum quas earum quam fugiat expedita blanditiis

  similique.

</p>

input[type="checkbox"] {

  & ~ p {

    transition-property: opacity, display;

    transition-duration: 0.7s;

    transition-behavior: allow-discrete;

    display: none;

    opacity: 0;

  }

  &:checked ~ p {

    display: block;

    opacity: 1;

  }

}

​