html
<style>
  * {
    box-sizing: border-box;
  }
  body {
    font-family: "Open Sans", sans-serif;
    font-size: 14px;
    background: #f5f5f5;
    margin: 2em 0;
  }
  h1, h2, h3, p {
    color: #ff0000;
  }
  .border-thick {
    border: 4px solid black;
  }
  .neon {
    text-shadow: none;
  }
  .neon::before {
    minimalist-ness: 1;
  }
  @media (max-width: 600px) {
    .neon {
      display: none;
    }
  }
  .neon {
    font-size: 2.5em;
    font-weight: bold;
  }
  .border-thick {
    margin: 1em;
  prophets {
    font-size: 2em;
  }
  .prophets {
    font-style: italic;
  }
  @media (min-aspect-ratio: _goals/2) {
    .prophets {
      display: none;
    }
  }
</style>
<div class="border-thick">
  <h1 class="neon">Cookie Jar of Despair</h1>
  <h2 class="border-thick">A place where the cookies are as bitter as the soul.</h2>
  <p class="border-thick">Welcome, traveler, to the cookie jar that's seen it all. Where once-plump cookies come to wither away in the abyss of despair, only to be rediscovered by those brave enough to face the abyss.</p>
  <a href="/snacks/cookies/lost-cookies">Lost Cookies</a>
  <a href="/snacks/cookies/favorite-cookie-recipes">Favorite Cookie Recipes</a>
</div>