<div class="outer">
  <h1 class="vertical">Lorem ipsum dolor sit amet consectetur, adipisicing elit.</h1>
  <div class="container">
    <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Dolores, esse ad laboriosam minus quos fuga possimus dignissimos deleniti odio itaque aperiam pariatur suscipit cum autem obcaecati non a eaque nemo.</p>
    <p>Voluptatibus omnis adipisci cum aut neque, deserunt quae amet fugiat architecto dolor ad fuga, temporibus aliquid expedita in mollitia fugit itaque inventore esse laboriosam! Blanditiis mollitia eius porro illo. Voluptatibus.</p>
    <p>Sapiente, molestiae adipisci? In dolor voluptatum fugiat eaque expedita mollitia, totam maxime quisquam? Quae ea itaque corrupti, magnam cumque pariatur soluta quibusdam cupiditate similique accusantium nihil blanditiis velit, repellendus nobis.</p>
    <p>Id, ipsam deserunt necessitatibus soluta magnam dolore consequatur voluptates? Aspernatur, assumenda incidunt ipsa deleniti eveniet reiciendis possimus cumque fuga amet eum, vero quibusdam provident repellendus debitis nemo sapiente at fugit?</p>
    <p>Saepe facere voluptates deserunt aliquam delectus officiis quis numquam voluptatum ducimus fugiat quia corrupti sapiente tempore necessitatibus praesentium quos, doloremque molestiae commodi, impedit ad quisquam ipsum amet. Nobis, soluta architecto.</p>
    <p>Rem cumque doloremque deleniti in assumenda quam pariatur, distinctio enim cum eligendi odit voluptatem sit, vitae officia commodi quo adipisci quae voluptate doloribus dolores ab nostrum provident nihil sapiente? Enim.</p>
    <p>Esse ipsa iure numquam magnam quos laborum nostrum id libero tempore fuga necessitatibus perspiciatis ullam deserunt aut accusamus magni a dolorum quae animi illum dicta suscipit quod, consectetur assumenda! Quia?</p>
    <p>Cupiditate sit totam, maxime exercitationem explicabo fugit doloribus non aliquid. Repellat, dolore ducimus? Voluptas, possimus consequuntur! Esse necessitatibus veniam eaque veritatis beatae odio, reprehenderit atque quae doloribus iure praesentium commodi.</p>
    <p>Qui vero nobis incidunt perferendis iure quam ipsum perspiciatis facere fugit dolores molestiae magnam consequatur architecto necessitatibus, assumenda accusantium ullam deserunt, quasi, consequuntur repudiandae pariatur deleniti repellat! Voluptatem, numquam expedita.</p>
    <p>Quas libero enim facilis doloribus in consequatur, quae rerum soluta quasi? Eius, officia nulla cumque nobis neque, minima inventore ea eveniet facere vitae ducimus pariatur qui rem animi itaque ratione.</p>
    <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Incidunt quas architecto necessitatibus quae, asperiores tenetur distinctio. Ab debitis nemo dolores provident quibusdam sint, modi aspernatur quia dolor. Qui, delectus eius!</p>
    <p>Similique voluptatibus obcaecati dignissimos placeat quae, qui quod tempore modi ipsum aut, voluptate rem vero, repellendus esse fugit ad quas expedita! Quos, et provident maiores qui eaque excepturi illo maxime?</p>
    <p>Maxime natus, dicta nisi necessitatibus laboriosam inventore vel, alias voluptatibus minus recusandae officiis optio id et hic quod exercitationem minima doloremque eligendi maiores pariatur. Ab numquam quidem iusto! Illo, eveniet?</p>
    <p>Necessitatibus asperiores consequatur, impedit in quidem ea. Eum adipisci distinctio ullam nulla, illum voluptate, iste recusandae aliquid rerum, sit consequuntur? Doloremque deleniti, ipsum laudantium sint eum tenetur ratione autem dolores.</p>
    <p>Magnam facilis hic quas dolor quae deleniti quis quaerat omnis itaque, magni sint reprehenderit rerum corrupti velit exercitationem earum. Ipsam reprehenderit architecto quidem vero voluptatibus ratione labore consequatur sunt asperiores!</p>
    <p>Dolorem soluta quibusdam voluptatum dignissimos non distinctio neque veritatis vero, dolorum accusantium corrupti quia unde quidem minima aut nihil modi deserunt atque! Cumque, ex natus. Explicabo architecto perferendis tempora vel.</p>
    <p>Aperiam eligendi architecto rem iste distinctio expedita totam minima itaque quidem amet non soluta aut obcaecati quo perspiciatis nobis possimus, voluptate quisquam. Neque ex repellat alias cumque culpa omnis ullam?</p>
    <p>Voluptatum voluptas pariatur quae. Est atque ab aliquid aut! Saepe ad error explicabo. Accusantium illo hic minus, voluptatem officia corrupti deserunt sint aliquam iure fugiat eaque perferendis architecto dolorum rerum!</p>
    <p>Consectetur laboriosam nisi sequi, a pariatur perspiciatis. Alias officia recusandae, fugit, suscipit voluptate amet esse unde eligendi sequi expedita a tempora et dolor consectetur cum. Quo placeat omnis aspernatur obcaecati.</p>
    <p>Beatae reiciendis maiores non facilis alias, rerum asperiores quos autem nemo! Odit quisquam aut ullam. Corporis, minima ipsam! Corrupti harum nihil hic dolore quo deleniti nam ab expedita dolorum minus.</p>
    <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Dolorem rem maiores placeat beatae excepturi aliquid quisquam hic esse, corrupti aspernatur ipsam soluta a voluptatem! Aspernatur, mollitia? Alias ducimus tenetur unde.</p>
    <p>Nulla nobis est sequi corporis, corrupti atque voluptatem repellendus dignissimos ducimus eaque pariatur in quaerat recusandae. Eveniet inventore placeat eos in qui nam fugit asperiores. Suscipit nostrum eaque voluptas quam!</p>
    <p>Perferendis veritatis, adipisci quibusdam animi aspernatur culpa rem delectus corrupti! Velit impedit nobis, enim fugiat saepe sapiente perspiciatis et voluptatibus provident labore distinctio quia, sint voluptates neque inventore, maxime quod.</p>
    <p>Minima vel sint eveniet sit maiores ab a quaerat! Nobis suscipit voluptates, atque nisi odit dolore? Expedita delectus quisquam enim voluptatem maiores! Quos aspernatur ipsa dolorem, fuga aliquid eos nisi.</p>
    <p>Sunt eos quos eligendi aliquid, amet incidunt exercitationem placeat aliquam modi consequuntur nemo nobis quasi maxime pariatur, nisi nam, voluptate accusantium! Ipsum commodi nam quos fugiat, aut ut necessitatibus aliquid?</p>
    <p>Cupiditate, dicta esse distinctio magnam aliquam incidunt est ratione et minus. Adipisci nemo asperiores doloribus numquam, pariatur ducimus magni atque ipsam voluptatum voluptatibus ad. Perferendis quam beatae neque! Saepe, commodi.</p>
    <p>Iste assumenda quidem tenetur neque a inventore eligendi delectus ipsa sed quis? Atque expedita aliquid voluptatibus asperiores. Voluptas ipsa natus, quia laboriosam provident, sapiente earum quas ratione doloribus et distinctio.</p>
    <p>Facilis, quibusdam! Necessitatibus atque quasi tenetur nostrum sapiente quos magni maxime nihil sint eveniet quae quaerat rerum repellendus, eius explicabo magnam fugit accusantium at? Dolore facilis aliquam eveniet dolorum deleniti?</p>
    <p>Cupiditate odio nobis pariatur enim sapiente, est laborum dolores autem quasi, sed consequuntur repellendus tempore ut asperiores recusandae qui maiores quibusdam magnam aperiam voluptatem, officia dolor eveniet molestias eos? Praesentium?</p>
    <p>Expedita dolores iusto excepturi voluptatem? Doloremque maxime blanditiis laboriosam voluptas. Doloremque hic eaque in vel eos! Ea perferendis repudiandae neque aperiam, ducimus tempore nobis omnis illo aut ab eius veritatis?</p>
  </div>
</div>

@import url("https://fonts.googleapis.com/css2?family=Inter:slnt,wght@-10..0,100..900&display=swap");
/* 
<weight>: Use a value from 100 to 900
<slant>: Use a value from -10 to 0
 */

* {
  box-sizing: border-box;
}

body {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-variation-settings: "slnt" 0;

  hyphes: auto;
}

.outer {
  padding: 2rem;
  display: flex;
  flex-flow: row;
  align-content: start;
  /*   border: 2px solid hotpink; */
  gap: 3rem;

  inline-size: 80vw;
  margin: 0 auto;
}

.vertical {
  /*   border: 2px solid lightblue; */
  font-size: 4rem;

  /* rotate: 180deg; */
  writing-mode: vertical-rl;
  text-orientation: sideways;

  padding-inline: 2rem;
  inline-size: max-content;
  margin-trim: block-end;
}

.container {
  /*   border: 2px solid limegreen; */
  inline-size: 80ch;
}