<div class="box">
  <p class="text">CSS<br>完全に理解した</p>
</div>

<div class="box">
  <p class="text">CSS<br>完全にとは言い切れないけど理解した</p>
</div>

<div class="box">
  <p class="text">理解した</p>
</div>

body {
  --offset: 2em;
}

.box {
  width: fit-content;
  max-width: calc(100% - var(--offset) * 2);
  margin-right: auto;
  margin-left: auto;
  margin-top: 40px;
  padding: 0.2em 0.4em 0.8em;
  border: 2px solid #000;   
  border-radius: 0.5em;
  font-size: 2rem;
  line-height: 1.2;
}

.text {
  transform: translateX(var(--offset));
}