KIYARA HERBALS - DEVELOPER PACKAGE
==================================

QUICK START

1. Sabse pehle index.html ko Chrome, Edge ya Safari mein open karein.
2. index.html approved design ka self-contained working reference hai.
3. Saare high-quality images assets folder mein separately bhi diye gaye hain.
4. Instagram reels live embeds hain, isliye preview ke liye internet on rakhein.
5. Neeche diye gaye instructions aur final QA checklist exactly follow karein.

KIYARA HERBALS FINAL WEBSITE - DEVELOPER HANDOFF (HINGLISH)
Version: 03 August 2026
===============================================================================

DEVELOPER KE LIYE START HERE

Yeh single HTML file approved visual reference aur working prototype dono hai.
File ko browser mein open karke exact desktop/mobile layout dekhein. Saare hero,
product aur ingredient images high-quality form mein isi file ke andar embedded
hain. Sirf live Instagram reels ko internet connection chahiye.

IMPORTANT SCOPE

1. Existing Kiyara creation ka visual character, colours, spacing, copy aur
   section flow preserve karna hai. Unrequested redesign ya extra content nahi
   add karna hai.
2. Final section order exactly yeh rahe:
   Announcement ticker > Shop/Sign in/Bag navigation > original hero image >
   Our Products > Artisanal Soap Bars > Ingredients > Testimonial > Instagram
   reels > Footer.
3. Website ke visible output mein AI tool, Act+Acre ya kisi third-party builder
   ki branding bilkul nahi honi chahiye.

TOP NAVIGATION AUR HERO

4. Hero se upar sirf teen premium buttons rakhein, isi order mein:
   Shop | Sign in | Bag.
5. DNA button, Search button aur separate top Kiyara text/logo add nahi karna.
   Footer ka existing Kiyara logo aur Company links alag hain aur untouched
   rahenge.
6. Button destination mapping:
   Shop: https://goptimizers.co.in/Kiyara/shop/
   Sign in: https://goptimizers.co.in/Kiyara/my-account/
   Bag: https://goptimizers.co.in/Kiyara/cart/
7. Buttons keyboard, mouse aur touch se clickable hone chahiye. Current hover,
   focus outline, rounded corners, shadow aur premium green/cream styling same
   replicate karein.
8. Hero mein original Kiyara image hi use karni hai. Image ka artwork, crop,
   brand logo, colour ya product composition change nahi karna. Original image
   mein jo purane navigation labels baked-in the, unhe current white edge masks
   ki tarah cleanly conceal karna hai. Naya text image ke upar superimpose nahi
   karna.

REMOVE / DO NOT RESTORE

9. Pura section Care that carries through time remove hi rahe.
10. From the earth, with purpose line remove hi rahe.
11. Chhota red Artisanal Soap Bars label remove hi rahe.
12. Herbal wisdom for everyday wellbeing footer line remove hi rahe.
13. Top DNA navigation aur extra header logo restore nahi karna.

PRODUCTS

14. Our Products category labels aur actual product cards ka sequence exactly:
    Scrub > Soaps > Lotion > Hand Wash > Bodywash > Facewash > Vitamin C.
15. Soaps ko Lotion aur Hand Wash ke beech second position par hi rakhein.
16. Product images ko same aspect ratio, rounded corners aur object-fit: cover
    ke saath use karein. Product image par extra text/logo/overlay nahi lagana.
17. Saare product cards aur Add to Bag links clickable rakhein.

ARTISANAL SOAP SECTION

18. Approved spelling Artisanal hai. Herbal Bathing Bars wording kahin use nahi
    karni.
19. Bada white headline exactly:
    Artisanal Soap Bars for everyday freshness.
    Is headline ko untouched rakhein.
20. Soap image, deep green background, two-column desktop layout aur rounded
    arch treatment current file ke same rakhein.

INGREDIENTS

21. Heading exactly: Ingredients you can recognise
22. Ingredient order exactly:
    Kokum Butter > Olive Oil > Coconut and Sugar Bubbles > Argan Oil >
    Shea Butter.
23. Sirf real ingredient stock photographs use karni hain. Images par words,
    labels, packaging, Act+Acre branding ya decorative text nahi hona chahiye.
24. Current ingredient photographs file mein embedded hain. CMS migration ke
    time inhe original quality mein extract/upload karke meaningful alt text
    preserve karein.

INSTAGRAM

25. Static screenshots ke badle real Kiyara Herbals Instagram reels embed
    karni hain. Account: https://www.instagram.com/kiyara.herbals/
26. Approved reel embeds:
    https://www.instagram.com/reel/DZupnTbu26X/embed
    https://www.instagram.com/reel/DZb4e7KJ43D/embed
    https://www.instagram.com/reel/DXbGNW9EapO/embed
27. Desktop par multiple reels ek row mein dikhni chahiye; mobile par clean
    single-column stack. Reels playable, lazy-loaded aur Instagram ki official
    embed policy ke according honi chahiye.

RESPONSIVE BEHAVIOUR

28. Desktop product grid 3 columns; tablet 2 columns; mobile 1 column.
29. Ingredient grid desktop par 5 items, tablet par 2 columns, mobile par 1
    column. Reel grid desktop par 3 columns aur mobile par 1 column.
30. Existing breakpoints 900px aur 560px ko baseline maan kar reproduce karein.
    Horizontal overflow nahi aana chahiye.
31. Images responsive rahen, buttons minimum comfortable touch height rakhein,
    aur keyboard focus visibly clear ho.

QUALITY AND IMPLEMENTATION NOTES

32. Is file mein CSS aur photographs embedded hain, isliye developer exact
    colours, spacing, border-radius, typography scale aur image crops inspect
    kar sakta hai. CMS/WordPress implementation mein CSS classes same rakhna
    optional hai, lekin final appearance same honi chahiye.
33. Performance ke liye production mein embedded image data ko WebP/AVIF assets
    mein convert karke CDN par host kar sakte hain, lekin visible quality aur
    crop compromise nahi hona chahiye.
34. Instagram embeds aur destination links production domain par test karein.
35. SEO/accessibility ke liye title, description, heading hierarchy, alt text,
    aria labels, keyboard focus aur semantic links preserve karein.

FINAL QA CHECKLIST

[ ] Top par sirf Shop, Sign in, Bag buttons hain aur teenon work karte hain.
[ ] Original hero artwork unchanged hai; text overlap nahi hai.
[ ] Care that carries through time section absent hai.
[ ] From the earth, with purpose absent hai.
[ ] Chhota red Artisanal Soap Bars label absent hai.
[ ] Herbal wisdom for everyday wellbeing absent hai.
[ ] Product order Scrub, Soaps, Lotion, Hand Wash, Bodywash, Facewash,
    Vitamin C hai.
[ ] Bada white Artisanal Soap Bars headline retained hai.
[ ] Ingredients exact five-item order mein hain aur images text-free hain.
[ ] Teen real Instagram reels visible/playable hain.
[ ] Desktop, tablet aur mobile par layout clean hai.
[ ] Visible website mein AI ya third-party builder branding nahi hai.

===============================================================================
END OF DEVELOPER HANDOFF
