---
layout: page
title: Home
---

<div class="text-center p-4 md:p-8">
  <h1 class="font-[Indie Flower] text-2xl md:text-4xl mb-4 md:mb-6">Welcome to Hawatri Logs</h1>
  <p class="text-lg md:text-xl mb-6 md:mb-8">A digital chronicle of discovery, learning, and shared knowledge.</p>
  
  <div class="max-w-4xl mx-auto text-left">
    <div class="mb-6 md:mb-8">
      <h2 class="font-[Indie Flower] text-xl md:text-2xl mb-3 md:mb-4 text-center">Why This Space Exists</h2>
      <p class="mb-4 text-base md:text-lg leading-relaxed">
        This website serves as my personal laboratory for documenting the continuous journey of learning and discovery. Every day brings new challenges, insights, and breakthrough moments that deserve to be captured, analyzed, and shared with others who walk similar paths.
      </p>
      
      <p class="mb-4 md:mb-6 text-base md:text-lg leading-relaxed">
        What started as a simple desire to record my daily learnings has evolved into something much more meaningful—a platform where knowledge flows in both directions, where the act of teaching deepens my own understanding, and where building tutorials becomes a collaborative effort that benefits everyone involved.
      </p>
    </div>
    
    <div class="grid grid-cols-1 md:grid-cols-2 gap-4 md:gap-8 mb-6 md:mb-8">
      <div class="border-2 border-black rounded-lg p-4 md:p-6">
        <h3 class="font-[Indie Flower] text-lg md:text-xl mb-3">Learning Through Documentation</h3>
        <p class="mb-4">
          Recording my learning journey serves multiple purposes. It helps solidify new concepts in my mind, creates a searchable reference for future use, and most importantly, transforms fleeting moments of understanding into permanent knowledge that can be revisited and built upon.
        </p>
        <p>
          Each post becomes a stepping stone in my educational path, creating a visible trail of growth and progress that others can follow and learn from.
        </p>
      </div>
      
      <div class="border-2 border-black rounded-lg p-4 md:p-6">
        <h3 class="font-[Indie Flower] text-lg md:text-xl mb-3">Building Together</h3>
        <p class="mb-4">
          The tutorials and guides I create here are not just one-way knowledge transfers. They represent invitations for collaboration and improvement. When I share what I learn, I open the door for others to contribute their expertise, correct my mistakes, and enhance the content.
        </p>
        <p>
          This collaborative approach creates a cycle where teaching leads to learning, and learning leads to better teaching.
        </p>
      </div>
    </div>
    
    <div class="mb-6 md:mb-8">
      <h2 class="font-[Indie Flower] text-xl md:text-2xl mb-3 md:mb-4 text-center">The Power of Habit</h2>
      <p class="mb-4 text-base md:text-lg leading-relaxed">
        Writing regularly has become more than just documentation—it has become a practice that sharpens thinking, improves communication, and creates accountability. The simple act of putting thoughts into words forces clarity and reveals gaps in understanding that might otherwise go unnoticed.
      </p>
      
      <p class="mb-4 md:mb-6 text-base md:text-lg leading-relaxed">
        This habit of logging thoughts, experiments, and discoveries creates a compound effect. Each entry builds upon previous ones, creating connections and insights that emerge only through consistent practice and reflection.
      </p>
    </div>
    
    <div class="mb-6 md:mb-8">
      <h2 class="font-[Indie Flower] text-xl md:text-2xl mb-3 md:mb-4 text-center">What You'll Find Here</h2>
      <div class="space-y-3 md:space-y-4">
        <div class="border-l-4 border-black pl-4 md:pl-6">
          <h4 class="font-bold mb-2">Learning Chronicles</h4>
          <p>Detailed accounts of new concepts, technologies, and methodologies I encounter, complete with explanations of how they work and why they matter.</p>
        </div>
        
        <div class="border-l-4 border-black pl-4 md:pl-6">
          <h4 class="font-bold mb-2">Practical Tutorials</h4>
          <p>Step-by-step guides for building, creating, and implementing various projects and solutions, designed to be clear, complete, and useful for learners at different levels.</p>
        </div>
        
        <div class="border-l-4 border-black pl-4 md:pl-6">
          <h4 class="font-bold mb-2">Problem-Solving Sessions</h4>
          <p>Real-world challenges I face and the approaches I take to solve them, including both successful solutions and instructive failures.</p>
        </div>
        
        <div class="border-l-4 border-black pl-4 md:pl-6">
          <h4 class="font-bold mb-2">Reflective Analysis</h4>
          <p>Deeper dives into patterns, connections, and insights that emerge from daily practice and continuous learning.</p>
        </div>
      </div>
    </div>
    
    <div class="mb-6 md:mb-8">
      <h2 class="font-[Indie Flower] text-xl md:text-2xl mb-3 md:mb-4 text-center">Join the Conversation</h2>
      <p class="mb-4 text-base md:text-lg leading-relaxed">
        While this space begins as my personal learning log, it thrives when it becomes part of a larger conversation. Your perspectives, corrections, suggestions, and alternative approaches make every piece of content more valuable and accurate.
      </p>
      
      <p class="mb-4 md:mb-6 text-base md:text-lg leading-relaxed">
        Whether you're someone just starting their learning journey or an expert with years of experience, your input helps create a richer, more complete understanding for everyone who visits this space.
      </p>
    </div>
    
<div class="border-2 border-black rounded-lg p-4 md:p-6">
  <h2 class="font-[Indie Flower] text-xl md:text-2xl mb-3 md:mb-4">Ready to Explore?</h2>
<p class="mb-4 md:mb-6 text-base md:text-lg">
        Dive into the collection of posts, tutorials, and insights that make up this growing knowledge base. Every entry represents a moment of learning captured and shared.
      </p>

  <div class="flex flex-col sm:flex-row justify-center gap-3 md:gap-6">
    <a 
      href="{{ '/blog/' | absolute_url }}" 
      class="border-2 border-black rounded-lg px-4 md:px-6 py-3 hover:bg-gray-100 transition-colors duration-200 text-center text-sm md:text-base"
        
    >
      Start Reading
    </a>
    <a 
      href="{{ '/about/' | absolute_url }}" 
      class="border-2 border-black rounded-lg px-4 md:px-6 py-3 hover:bg-gray-100 transition-colors duration-200 text-center text-sm md:text-base"
        
    >
      Learn More
    </a>
  </div>
</div>


  </div>
</div>