Bipasha Shivam & Sons – Personal Website

This repo is a small, static site built as a personal, story‑driven project around the fictional “firm” Bipasha Shivam & Sons. There is no backend; everything is plain HTML/CSS with a little JavaScript.

Project Structure

• index.html – Landing page / one‑page overview

  • Hero section explaining the “firm” idea and the emotional backstory.
  • Three core “services”: Communication & honesty, Ego & damage control, Time & presence.
  • History/“industries” section with chips and stats about years, places, and the relationship.
  • “Leadership” section with two cards (Bipasha and Shivam).
  • Contact section with a non‑functional form (front‑end only) and a footer.
  • JS at the bottom:
    • Swaps the hero image between asset/images/hero.png and asset/images/hero-2.png every 5 seconds.
    • Fills the current year in the footer.

• about.html – About / backstory page

  • Re‑uses the same visual style and header/footer.
  • Sections describing:
    • Early Shillong school days and the “book” misunderstanding (with photo asset/images/7.JPG).
    • “Our unofficial third partner: Golu” (dog logo from asset/images/doggy/logo.png) and a small placeholder gallery for future Golu photos.
    • “Who we really are” (pills with founded dates and HQ).
    • Values section (Honesty without drama, Respect before anything, One person, long term) plus meta cards for Vision / Mission / KPI.

• services.html – Detailed “services” / promises page

  • Expands the three core themes from the homepage into fuller cards:
    • Communication & honesty
    • Ego & damage control
    • Time & presence
    • Respect & boundaries
  • Right‑hand card explaining what this page is (a written record of promises, not pressure).
  • “Fine print” list at the bottom describing that there is only one intended person, no expiry, and no obligation to respond.
  • Footer with same pattern and dynamic year.

• gallery.html – 3D photo sphere of memories

  • Intro copy explaining the gallery as a “universe of us”.
  • 3D rotating reel (div#photoReel) that arranges images from asset/images/all/ into a circular 3D carousel:
    • Uses filenames like IMG_1354.png, IMG_1357.png, IMG_1359.jpg, IMG_1591.PNG, etc.
    • CSS keyframes spin the reel; hovering pauses the rotation.
  • Right‑side copy describing how to interpret the gallery emotionally and a note that any picture can be removed if it feels too personal.
  • Footer and year script like other pages.
  • Note: Some nav/footer links still point to test.html#...; these can be updated to index.html#... if you want consistent navigation.

• talk.html – “Talk to me please” / contact actions

  • Checklist card listing places where Shivam might be blocked (Phone, WhatsApp, Instagram, LinkedIn, Gmail, Facebook) – all with disabled checkboxes, purely visual.
  • Right‑hand card with:
    • WhatsApp link: https://wa.me/918840754203.
    • “Send an email” and “Send real letter” buttons that use smtpjs.com and the Email.send API.
    • A textarea where a message can be typed; the JS sends this as the email body or appends it as a P.S. for the “real letter”.
  • Important: SMTP credentials (host, username, password) are currently hard‑coded in the page. If this ever goes on a public server or Git repo, you should remove or rotate these credentials and move email sending to a secure backend instead.

• asset/images/

  • doggy/logo.png and logo.JPG – used as the site logo and for Golu.
  • hero.png, hero-2.png – swapped on the homepage hero.
  • Various .JPG/.PNG photos for memories and galleries, including the all/ folder for the 3D sphere and doggy/ / private/ folders for dog photos and private screenshots.

How to Run / View

• No build step is required. Everything is static.
• Simply open index.html in a browser (double‑click the file or drag it into Chrome/Edge).
• From there you can navigate to about.html, services.html, gallery.html, and talk.html using the header links.

Notes & Future Improvements

• Fix navigation links in about.html, services.html, and gallery.html that still reference test.html#... to point to index.html#....
• Consider removing or securing any real SMTP credentials before publishing the project publicly.
• Optionally extract shared styles (fonts, colors, header/footer CSS) into a common stylesheet to reduce duplication.