index.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Guru Gear</title>
    <link rel="stylesheet" href="styles.css" />
  </head>
  <body>
    <header>
      <nav style="text-align: center; color: #7170b4">
        <a href="#">Home</a>
        <a href="#">About Us</a>
        <a href="#">Shop</a>
        <a href="#">Reviews</a>
        <a href="#">Contact Us</a>
        <a href="#" style="font-size: 1.5em">🛒</a>
      </nav>
      <img class="logonotext" src="images/GuruGearNoText.png" alt="GuruGearlogonotext" />
    </header>

    <section class="hero">
      <div style="position: relative; display: inline-block; text-align: left">
        <img class="plamtree" src="images/plamtree.webp" alt="plamtree" style="opacity: 0.4" />
        <img
          class="logo"
          src="images/GuruGearText.png"
          alt="GuruGearText"
          style="position: absolute; top: 0; left: 50%; transform: translateX(-50%)"
        />
      </div>
      <div>
        <h2>New Arrivals</h2>
        <p>
          Welcome to Guru Gear! We specialize in high-quality apparel and accessories designed for
          yoga and meditative practices.
        </p>

        <p>
          Our commitment to sustainability ensures that every piece is crafted using fair-trade
          materials and produced in equitable factories across three continents.
        </p>
        <p>Experience the comfort and care in every item we create!</p>
        <p>@GuruGear</p>
      </div>
    </section>
    <footer class="footer">
      <p>&copy; 2025 Guru Gear. All Rights Reserved.</p>
    </footer>
  </body>
</html>