Update index.html

Author: SCodeGit

index.html

@@ -16,4 +16,102 @@
   <header class="hero-outer">
     <div class="container hero-inner">
       <div class="logo-wrap">
-        <img src="images/WhatsApp Image 2025-10-12 at 10.57.51 PM.jpeg" alt="SCode logo" class="hero-
+        <img src="images/WhatsApp Image 2025-10-12 at 10.57.51 PM.jpeg" alt="SCode logo" class="hero-logo">
+      </div>
+      <div class="hero-text">
+        <h1 class="name">SCode</h1>
+        <p class="tagline"><span id="typed"></span></p>
+        <div class="hero-cta">
+          <a class="btn primary" id="whatsappBtn" href="https://wa.me/233555578864" target="_blank" rel="noopener">Hire Me (WhatsApp)</a>
+          <a class="btn ghost" href="https://github.com/SCodeGit" target="_blank" rel="noopener">View GitHub</a>
+        </div>
+      </div>
+    </div>
+    <div class="hero-watermark">
+      <img src="images/WhatsApp Image 2025-10-12 at 10.57.52 PM.jpeg" alt="watermark" />
+    </div>
+  </header>
+
+  <!-- About -->
+  <section class="section about" id="about">
+    <div class="container">
+      <h2>About</h2>
+      <p>Hi — I’m <strong>SCode</strong>, a creative developer passionate about design, code, and user experience. I build clean, responsive websites for NGOs, startups and businesses.</p>
+    </div>
+  </section>
+
+  <!-- Projects -->
+  <section class="section projects" id="projects">
+    <div class="container">
+      <h2>Selected Projects</h2>
+      <div class="projects-grid">
+        <a class="project-card" href="https://scodegit.github.io/pacesettersfoundation.github.io/" target="_blank" rel="noopener">
+          <img src="images/WhatsApp Image 2025-10-12 at 10.57.53 PM.jpeg" alt="Pacesetters">
+          <div class="project-body">
+            <h3>Pacesetters Foundation</h3>
+            <p>Multi-page NGO site: donations, programs, and team profiles.</p>
+          </div>
+        </a>
+        <div class="project-card placeholder">
+          <div class="project-body">
+            <h3>Project Two</h3>
+            <p>Coming soon — demo and case study will be added here.</p>
+          </div>
+        </div>
+        <div class="project-card placeholder">
+          <div class="project-body">
+            <h3>Project Three</h3>
+            <p>Coming soon — demo and case study will be added here.</p>
+          </div>
+        </div>
+      </div>
+    </div>
+  </section>
+
+  <!-- Contact -->
+  <section class="section contact" id="contact">
+    <div class="container">
+      <h2>Contact</h2>
+      <div class="contact-grid">
+        <div class="contact-card">
+          <h3>Get in touch</h3>
+          <p>Email: <a href="mailto:[email protected]">[email protected]</a></p>
+          <p>WhatsApp: <a href="https://wa.me/233555578864" target="_blank" rel="noopener">+233 55 557 8864</a></p>
+          <p>Facebook: <a href="https://www.facebook.com/people/Atubra-Abraham/100072576882412/" target="_blank" rel="noopener">Atubra Abraham</a></p>
+          <p>GitHub: <a href="https://github.com/SCodeGit" target="_blank" rel="noopener">SCodeGit</a></p>
+        </div>
+        <div class="contact-card">
+          <h3>Message</h3>
+          <form action="mailto:[email protected]" method="post" enctype="text/plain">
+            <input name="name" placeholder="Your name" required>
+            <input name="email" type="email" placeholder="Your email" required>
+            <textarea name="message" rows="4" placeholder="Your message" required></textarea>
+            <button class="btn primary" type="submit">Send Email</button>
+          </form>
+        </div>
+      </div>
+    </div>
+  </section>
+
+  <!-- Footer -->
+  <footer class="footer">
+    <div class="container footer-inner">
+      <div class="left">
+        <strong>SCode</strong><br>
+        <small>© 2025 All Rights Reserved — built by 
+          <a class="dev-link" href="https://scodegit.github.io/scode.git.io/" target="_blank" rel="noopener">SCode</a>
+        </small>
+      </div>
+      <div class="right social-links">
+        <a href="https://github.com/SCodeGit" target="_blank" rel="noopener">GitHub</a>
+        <a href="https://www.facebook.com/people/Atubra-Abraham/100072576882412/" target="_blank" rel="noopener">Facebook</a>
+        <a href="https://wa.me/233555578864" target="_blank" rel="noopener">WhatsApp</a>
+      </div>
+    </div>
+  </footer>
+
+  <button id="topBtn" title="Back to top">↑</button>
+
+  <script src="script.js"></script>
+</body>
+</html>