/* In html:
<div class="show-more-box">
  <input id="ch" type="checkbox">
  <p> ... here your visible text ... </p>
  <div class="content">
     <p> ... invisible text here ... </p>     
     <label class="ch" for="ch">Show less></label>
  </div>
  <label class="ch" for="ch">Read more></label>
</div>
*/

#ch {
   display : none;
}
#ch:checked ~ .content {
   display: block;
}
#ch:checked ~ label {
   display: none;
}
.content {
   display: none;
}
label.ch {
   display: inline-block;
   color: #fff;
   background-color: var(--pink);
   padding: 8px 20px;
   font-family: Roboto;
   border-radius: 3px;
   margin-top: 12px;
   cursor: pointer;
}