
<style>

.jumbotron .sun-icon {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 2; /* Make sure this is above the gradient */
}

.tagline h2 {
  font-size: 1.5rem; /* Adjust the font size as needed */
  color: #333; /* This is a dark gray, but change as per your color scheme */
  margin-top: 2rem; /* Adds space above the tagline */
  margin-bottom: 2rem; /* Adds space below the tagline */
  font-weight: normal; /* Adjust weight as needed */
}
</style>

<div class="jumbotron bg-white col-md-10 mx-auto text-center">
  <svg xmlns="http://www.w3.org/2000/svg" width="50" height="50" fill="currentColor" class="bi bi-sun sun-icon" viewBox="0 0 16 16">
<path d="M8 11a3 3 0 1 1 0-6 3 3 0 0 1 0 6zm0 1a4 4 0 1 0 0-8 4 4 0 0 0 0 8zM8 0a.5.5 0 0 1 .5.5v2a.5.5 0 0 1-1 0v-2A.5.5 0 0 1 8 0zm0 13a.5.5 0 0 1 .5.5v2a.5.5 0 0 1-1 0v-2A.5.5 0 0 1 8 13zm8-5a.5.5 0 0 1-.5.5h-2a.5.5 0 0 1 0-1h2a.5.5 0 0 1 .5.5zM3 8a.5.5 0 0 1-.5.5h-2a.5.5 0 0 1 0-1h2A.5.5 0 0 1 3 8zm10.657-5.657a.5.5 0 0 1 0 .707l-1.414 1.415a.5.5 0 1 1-.707-.708l1.414-1.414a.5.5 0 0 1 .707 0zm-9.193 9.193a.5.5 0 0 1 0 .707L3.05 13.657a.5.5 0 0 1-.707-.707l1.414-1.414a.5.5 0 0 1 .707 0zm9.193 2.121a.5.5 0 0 1-.707 0l-1.414-1.414a.5.5 0 0 1 .707-.707l1.414 1.414a.5.5 0 0 1 0 .707zM4.464 4.465a.5.5 0 0 1-.707 0L2.343 3.05a.5.5 0 1 1 .707-.707l1.414 1.414a.5.5 0 0 1 0 .708z"/>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" width="29" height="29" fill="currentColor" class="bi bi-search" viewBox="0 0 16 16" style="position: absolute; top: 13px; right: 8px;">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-search" viewBox="0 0 16 16">
  <path d="M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001c.03.04.062.078.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1.007 1.007 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0z"/>
</svg>
<h1 class="display-4">A search engine for your complaints.</h1>
<hr class="my-4">
<p>Ever voiced a frustration online and been met with a wave of unexpected solutions? Take, for instance, <a href="https://www.tiktok.com/@jordyntaylorcooke/video/7299104814707789098" target="_blank">a joking rant about the arrangement of the doors on your washer and dryer</a>, which led to helpful tips on reversing the door for better access. It's social troubleshooting at its finest.</p>
<p class="lead">Introducing Complainquiry, a unique engine designed not just to hear you out, but to direct your complaints to the platforms best suited to offer you advice, responses from individuals with similar experiences, or even resolutions from those who’ve been in your shoes.</p>
<div class="tagline">
<h2 class="text-center">You need to shout, but where? Complainquiry.</h2>
</div>
<hr>
<div class="alert alert-secondary col-md-6 mx-auto text-center" role="alert">
Echoing: <a href="https://meta.wikimedia.org/wiki/Cunningham%27s_Law" target="_blank">Cunningham's Law</a>
<blockquote>"The best way to get the right answer on the internet is not to ask a question; it's to post the wrong answer."</blockquote>
</div>
<div class="tagline">
<h2 class="text-center">You don't need to formulate the perfect question or query on a clunky search engine or a prompt for a chatbot, you need Complainquiry!</h2>
</div>


<div class="alert alert-secondary col-md-6 mx-auto text-center" role="alert">
As Lilly Irani <a href="https://twitter.com/gleemie/status/1489130849647742976">writes</a>:

<blockquote>"Complaint can be a way of finding collectivities..."</blockquote>
</div>


</div>