diff --git a/index_test_odoo/static/description/assets/cybro-icon.png b/index_test_odoo/static/description/assets/cybro-icon.png
new file mode 100644
index 000000000..06e73e11d
Binary files /dev/null and b/index_test_odoo/static/description/assets/cybro-icon.png differ
diff --git a/index_test_odoo/static/description/assets/cybro-odoo.png b/index_test_odoo/static/description/assets/cybro-odoo.png
new file mode 100644
index 000000000..ed02e07a4
Binary files /dev/null and b/index_test_odoo/static/description/assets/cybro-odoo.png differ
diff --git a/index_test_odoo/static/description/assets/h2.png b/index_test_odoo/static/description/assets/h2.png
new file mode 100644
index 000000000..0bfc4707d
Binary files /dev/null and b/index_test_odoo/static/description/assets/h2.png differ
diff --git a/index_test_odoo/static/description/assets/img/banner-img.png b/index_test_odoo/static/description/assets/img/banner-img.png
deleted file mode 100644
index 0617b6e7d..000000000
Binary files a/index_test_odoo/static/description/assets/img/banner-img.png and /dev/null differ
diff --git a/index_test_odoo/static/description/assets/img/banner.jpg b/index_test_odoo/static/description/assets/img/banner.jpg
deleted file mode 100644
index b729449a2..000000000
Binary files a/index_test_odoo/static/description/assets/img/banner.jpg and /dev/null differ
diff --git a/index_test_odoo/static/description/assets/img/box1.png b/index_test_odoo/static/description/assets/img/box1.png
deleted file mode 100644
index 00d2c921c..000000000
Binary files a/index_test_odoo/static/description/assets/img/box1.png and /dev/null differ
diff --git a/index_test_odoo/static/description/assets/img/box2.png b/index_test_odoo/static/description/assets/img/box2.png
deleted file mode 100644
index 567a5b68c..000000000
Binary files a/index_test_odoo/static/description/assets/img/box2.png and /dev/null differ
diff --git a/index_test_odoo/static/description/assets/img/box3.png b/index_test_odoo/static/description/assets/img/box3.png
deleted file mode 100644
index f7f7cfc6f..000000000
Binary files a/index_test_odoo/static/description/assets/img/box3.png and /dev/null differ
diff --git a/index_test_odoo/static/description/assets/img/box4.png b/index_test_odoo/static/description/assets/img/box4.png
deleted file mode 100644
index 9270cde14..000000000
Binary files a/index_test_odoo/static/description/assets/img/box4.png and /dev/null differ
diff --git a/index_test_odoo/static/description/assets/img/cybro.jpg b/index_test_odoo/static/description/assets/img/cybro.jpg
deleted file mode 100644
index 414d443b0..000000000
Binary files a/index_test_odoo/static/description/assets/img/cybro.jpg and /dev/null differ
diff --git a/index_test_odoo/static/description/assets/img/header.jpg b/index_test_odoo/static/description/assets/img/header.jpg
deleted file mode 100644
index 1705fa59e..000000000
Binary files a/index_test_odoo/static/description/assets/img/header.jpg and /dev/null differ
diff --git a/index_test_odoo/static/description/assets/img/icon1.svg b/index_test_odoo/static/description/assets/img/icon1.svg
deleted file mode 100644
index e2a561fe7..000000000
--- a/index_test_odoo/static/description/assets/img/icon1.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-<svg width="50" height="50" viewBox="0 0 50 50" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M45.1875 3H4.5625C3.69962 3 3 3.69885 3 4.5625V45.1875C3 46.0511 3.69962 46.75 4.5625 46.75H45.1875C46.0511 46.75 46.75 46.0511 46.75 45.1875V4.5625C46.75 3.69885 46.0511 3 45.1875 3ZM6.125 8.125C6.125 7.02043 7.02043 6.125 8.125 6.125H41.625C42.7296 6.125 43.625 7.02043 43.625 8.125V13.5C43.625 14.6046 42.7296 15.5 41.625 15.5H8.125C7.02043 15.5 6.125 14.6046 6.125 13.5V8.125ZM8.125 43.625C7.02043 43.625 6.125 42.7296 6.125 41.625V20.625C6.125 19.5204 7.02043 18.625 8.125 18.625H41.625C42.7296 18.625 43.625 19.5204 43.625 20.625V41.625C43.625 42.7296 42.7296 43.625 41.625 43.625H8.125ZM13.4164 10.8125C13.4164 11.6761 12.7168 12.375 11.8539 12.375H9.25C8.38712 12.375 7.6875 11.6761 7.6875 10.8125C7.6875 9.94885 8.38712 9.25 9.25 9.25H11.8539C12.7168 9.25 13.4164 9.94885 13.4164 10.8125ZM19.9273 10.8125C19.9273 11.6761 19.2277 12.375 18.3648 12.375H15.7602C14.8973 12.375 14.1977 11.6761 14.1977 10.8125C14.1977 9.94885 14.8973 9.25 15.7602 9.25H18.3648C19.2277 9.25 19.9273 9.94885 19.9273 10.8125ZM26.4375 10.8125C26.4375 11.6761 25.7379 12.375 24.875 12.375H22.2711C21.4082 12.375 20.7086 11.6761 20.7086 10.8125C20.7086 9.94885 21.4082 9.25 22.2711 9.25H24.875C25.7379 9.25 26.4375 9.94885 26.4375 10.8125ZM18.6235 37.375C18.3496 37.375 18.0726 37.3033 17.8209 37.1522L10.0084 32.4647C9.53763 32.1824 9.25 31.6743 9.25 31.125C9.25 30.5757 9.53763 30.0676 10.0084 29.7853L17.8209 25.0978C18.5609 24.6537 19.5207 24.8933 19.9647 25.6334C20.4088 26.3734 20.1692 27.3332 19.4291 27.7772C19.4291 27.7772 14.2184 30.125 12.375 30.875C10.7051 31.5544 17.8494 33.9553 19.209 34.4012C19.3553 34.4492 19.4995 34.5084 19.6184 34.6061C20.2071 35.0895 20.3684 35.9439 19.9647 36.6166C19.6718 37.1049 19.1545 37.375 18.6235 37.375ZM40.5 31.125C40.5 31.6743 40.2116 32.1824 39.7416 32.4647L31.9291 37.1522C31.6774 37.3033 31.3997 37.375 31.1265 37.375C30.5955 37.375 30.0782 37.1049 29.7853 36.6166C29.3968 35.9692 29.5315 35.1537 30.0668 34.6624C30.2218 34.5201 30.4224 34.4496 30.627 34.4006C32.4319 33.9684 41.5047 31.7019 38.5 30.5C36.3033 29.6213 31.6521 28.1846 30.5558 27.8489C30.3989 27.8009 30.2455 27.7394 30.1197 27.634C29.5407 27.1489 29.3843 26.3016 29.7853 25.6334C30.2278 24.8933 31.1876 24.6522 31.9291 25.0978L39.7416 29.7853C40.2116 30.0676 40.5 30.5757 40.5 31.125ZM30.2232 22.3512L22.4107 41.1012C22.1612 41.7009 21.5799 42.0625 20.968 42.0625C20.7681 42.0625 20.5644 42.0244 20.3676 41.942C19.571 41.6108 19.1949 40.6953 19.5268 39.8988L27.3393 21.1488C27.6719 20.3523 28.589 19.9769 29.3824 20.308C30.179 20.6392 30.5558 21.5547 30.2232 22.3512Z" fill="white"/>
-</svg>
diff --git a/index_test_odoo/static/description/assets/img/icon2.svg b/index_test_odoo/static/description/assets/img/icon2.svg
deleted file mode 100644
index 119165370..000000000
--- a/index_test_odoo/static/description/assets/img/icon2.svg
+++ /dev/null
@@ -1,24 +0,0 @@
-<svg width="50" height="51" viewBox="0 0 50 51" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g clip-path="url(#clip0_837_641)">
-<mask id="mask0_837_641" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="0" y="0" width="50" height="51">
-<path d="M0 0.195316H50V50.1953H0V0.195316Z" fill="white"/>
-</mask>
-<g mask="url(#mask0_837_641)">
-<path d="M41.0405 49.0352H7.88281C6.77824 49.0352 5.88281 48.1397 5.88281 47.0352V3.96485C5.88281 2.86028 6.77824 1.96485 7.88281 1.96485H32.2798C32.8102 1.96485 33.3192 2.1758 33.6942 2.55087C36.2467 5.10338 37.902 6.75863 40.4545 9.31115C40.8296 9.68622 41.0405 10.1952 41.0405 10.7256V30.4692" stroke="white" stroke-width="2" stroke-miterlimit="10"/>
-<path d="M32.251 1.96523L32.2521 10.7538L41.0406 10.7549" stroke="white" stroke-miterlimit="10"/>
-<path d="M11.5166 42.1431H31.7571" stroke="white" stroke-miterlimit="10"/>
-<path d="M11.5166 36.2837H32.4277" stroke="white" stroke-miterlimit="10"/>
-<path d="M11.5166 11.0073H17.4502" stroke="white" stroke-miterlimit="10"/>
-<path d="M24.9245 16.6415L21.998 30.6499" stroke="white" stroke-miterlimit="10"/>
-<path d="M18.2316 26.7275L15.1494 23.6453L18.2316 20.5632" stroke="white" stroke-miterlimit="10"/>
-<path d="M28.6914 20.5632L31.7736 23.6454L28.6914 26.7275" stroke="white" stroke-miterlimit="10"/>
-<path d="M48.0396 40.1999C48.0396 45.073 44.0892 49.0234 39.2161 49.0234C34.3429 49.0234 30.3926 45.073 30.3926 40.1999C30.3926 35.3267 34.3429 31.3764 39.2161 31.3764C44.0892 31.3764 48.0396 35.3267 48.0396 40.1999Z" stroke="white" stroke-width="2" stroke-miterlimit="10"/>
-<path d="M44.8368 37.2065L39.6195 42.4238L36.7871 39.5914" stroke="white" stroke-miterlimit="10"/>
-</g>
-</g>
-<defs>
-<clipPath id="clip0_837_641">
-<rect width="50" height="50" fill="white" transform="translate(0 0.195312)"/>
-</clipPath>
-</defs>
-</svg>
diff --git a/index_test_odoo/static/description/assets/img/icon3.svg b/index_test_odoo/static/description/assets/img/icon3.svg
deleted file mode 100644
index 105e35e49..000000000
--- a/index_test_odoo/static/description/assets/img/icon3.svg
+++ /dev/null
@@ -1,11 +0,0 @@
-<svg width="50" height="51" viewBox="0 0 50 51" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g clip-path="url(#clip0_837_670)">
-<path d="M42.707 10.4717L32.707 0.47168C32.5195 0.28418 32.2656 0.178711 31.9999 0.178711H10.9999C8.79391 0.178711 7 1.97262 7 4.17874V44.1788C7 46.3848 8.79391 48.1787 11 48.1787H39.0001C41.2061 48.1787 43 46.3848 43 44.1787V11.1787C43 10.9131 42.8945 10.6592 42.707 10.4717ZM33 3.5928L39.5859 10.1787H34.9999C33.8974 10.1787 33 9.28127 33 8.17877V3.5928ZM41 44.1787C41 45.2812 40.1026 46.1786 39.0001 46.1786H11C9.89753 46.1786 9.00006 45.2812 9.00006 44.1787V4.17874C9.00006 3.07624 9.89753 2.17877 11 2.17877H31V8.17877C31 10.3848 32.7939 12.1787 35 12.1787H41V44.1787Z" fill="white"/>
-<path d="M30.0986 29.5352C29.1728 28.8066 28.293 28.0577 27.707 27.4717C26.9453 26.71 26.2666 25.9717 25.6768 25.2686C26.5967 22.4258 27.0001 20.9601 27.0001 20.1787C27.0001 16.8594 25.8008 16.1787 24.0001 16.1787C22.6319 16.1787 21.0001 16.8896 21.0001 20.2745C21.0001 21.7667 21.8175 23.5782 23.4376 25.6836C23.0411 26.8936 22.5752 28.2891 22.0518 29.8624C21.7998 30.6172 21.5265 31.3164 21.2373 31.9629C21.002 32.0675 20.7735 32.1739 20.5528 32.2842C19.7579 32.6817 19.003 33.0391 18.3028 33.3711C15.1094 34.8829 13 35.8829 13 37.8575C13 39.2911 14.5577 40.1787 16 40.1787C17.8593 40.1787 20.667 37.6953 22.7178 33.5117C24.8466 32.6719 27.4932 32.0497 29.582 31.6601C31.2558 32.9472 33.1045 34.1787 34 34.1787C36.4795 34.1787 37 32.7451 37 31.5429C37 29.1786 34.2988 29.1786 33 29.1786C32.5967 29.1787 31.5147 29.2979 30.0986 29.5352ZM16 38.1787C15.4287 38.1787 15.042 37.9092 15 37.8575C15 37.1484 17.1142 36.1465 19.1592 35.1778C19.289 35.1163 19.4209 35.0547 19.5547 34.9912C18.0528 37.1691 16.5674 38.1787 16 38.1787ZM23 20.2745C23 18.1788 23.6505 18.1788 24.0001 18.1788C24.7071 18.1788 25.0001 18.1788 25.0001 20.1787C25.0001 20.6006 24.7188 21.6553 24.2042 23.3018C23.4189 22.0928 23 21.0567 23 20.2745ZM23.7666 31.0225C23.8292 30.8487 23.8897 30.6729 23.9483 30.4952C24.3194 29.3819 24.6534 28.3819 24.9512 27.4815C25.3663 27.9385 25.8136 28.4063 26.2931 28.8858C26.4806 29.0733 26.9454 29.4951 27.5646 30.0234C26.332 30.292 25.0205 30.625 23.7666 31.0225ZM35 31.543C35 31.9923 35 32.1787 34.0723 32.1846C33.7998 32.1261 33.1699 31.755 32.3926 31.2257C32.6748 31.1945 32.8828 31.1788 33 31.1788C34.4776 31.1788 34.8965 31.3233 35 31.543Z" fill="white"/>
-</g>
-<defs>
-<clipPath id="clip0_837_670">
-<rect width="48" height="48" fill="white" transform="translate(1 0.178711)"/>
-</clipPath>
-</defs>
-</svg>
diff --git a/index_test_odoo/static/description/assets/img/icon4.svg b/index_test_odoo/static/description/assets/img/icon4.svg
deleted file mode 100644
index 18c160e20..000000000
--- a/index_test_odoo/static/description/assets/img/icon4.svg
+++ /dev/null
@@ -1,9 +0,0 @@
-<svg width="50" height="51" viewBox="0 0 50 51" fill="none" xmlns="http://www.w3.org/2000/svg">
-<mask id="mask0_837_679" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="0" y="0" width="50" height="51">
-<path d="M0 0.58643H50V50.5864H0V0.58643Z" fill="white"/>
-</mask>
-<g mask="url(#mask0_837_679)">
-<path d="M27.7271 25.1803H27C25.8954 25.1803 25 24.2848 25 23.1803V18.9522C25 17.8476 24.1046 16.9522 23 16.9522H18.7719C17.6673 16.9522 16.7719 16.0567 16.7719 14.9522V14.225C16.7719 12.2702 15.1872 10.6856 13.2324 10.6856C11.2776 10.6856 9.69297 12.2702 9.69297 14.225V14.9522C9.69297 16.0567 8.79754 16.9522 7.69297 16.9522H3.46484C2.36028 16.9522 1.46484 17.8476 1.46484 18.9522V38.4873C1.46484 39.5919 2.36027 40.4873 3.46484 40.4873H7.69297C8.79754 40.4873 9.69297 39.5919 9.69297 38.4873V37.7602C9.69297 35.8054 11.2776 34.2207 13.2324 34.2207C15.1872 34.2207 16.7719 35.8054 16.7719 37.7602V38.4873C16.7719 39.5919 17.6673 40.4873 18.7719 40.4873H23C24.1046 40.4873 25 39.5919 25 38.4873V34.2592C25 33.1546 25.8954 32.2592 27 32.2592H27.7271C29.6819 32.2592 31.2666 30.6745 31.2666 28.7197C31.2666 26.7649 29.6819 25.1803 27.7271 25.1803Z" stroke="white" stroke-width="2" stroke-miterlimit="10"/>
-<path d="M25 32.2592V38.4873C25 39.5919 25.8954 40.4873 27 40.4873H46.5352C47.6397 40.4873 48.5352 39.5919 48.5352 38.4873V34.2592C48.5352 33.1546 47.6397 32.2592 46.5352 32.2592H45.808C43.8532 32.2592 42.2686 30.6745 42.2686 28.7197C42.2686 26.7649 43.8532 25.1803 45.808 25.1803H46.5352C47.6397 25.1803 48.5352 24.2848 48.5352 23.1803V18.9522C48.5352 17.8476 47.6397 16.9522 46.5352 16.9522H42.307C41.2025 16.9522 40.307 16.0567 40.307 14.9522V14.2251C40.307 12.2702 38.7224 10.6856 36.7676 10.6856C34.8128 10.6856 33.2281 12.2702 33.2281 14.2251V14.9522C33.2281 16.0567 32.3327 16.9522 31.2281 16.9522H27C25.8954 16.9522 25 17.8476 25 18.9522V25.1803" stroke="white" stroke-width="2" stroke-miterlimit="10"/>
-</g>
-</svg>
diff --git a/index_test_odoo/static/description/assets/img/minus.svg b/index_test_odoo/static/description/assets/img/minus.svg
deleted file mode 100644
index 93b596485..000000000
--- a/index_test_odoo/static/description/assets/img/minus.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-<svg width="18" height="7" viewBox="0 0 18 7" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M0 6.14V0.5H17.76V6.14H0Z" fill="black"/>
-</svg>
diff --git a/index_test_odoo/static/description/assets/img/plus.svg b/index_test_odoo/static/description/assets/img/plus.svg
deleted file mode 100644
index 07c068f5b..000000000
--- a/index_test_odoo/static/description/assets/img/plus.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-<svg width="26" height="26" viewBox="0 0 26 26" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M9.6 25.58V15.86H0V10.22H9.6V0.5H15.48V10.22H25.08V15.86H15.48V25.58H9.6Z" fill="#191A23"/>
-</svg>
diff --git a/index_test_odoo/static/description/assets/img/section.png b/index_test_odoo/static/description/assets/img/section.png
deleted file mode 100644
index 399e63095..000000000
Binary files a/index_test_odoo/static/description/assets/img/section.png and /dev/null differ
diff --git a/index_test_odoo/static/description/assets/img/threeimg.png b/index_test_odoo/static/description/assets/img/threeimg.png
deleted file mode 100644
index a4208ef96..000000000
Binary files a/index_test_odoo/static/description/assets/img/threeimg.png and /dev/null differ
diff --git a/index_test_odoo/static/description/assets/modules/1.gif b/index_test_odoo/static/description/assets/modules/1.gif
deleted file mode 100644
index ae3a880a2..000000000
Binary files a/index_test_odoo/static/description/assets/modules/1.gif and /dev/null differ
diff --git a/index_test_odoo/static/description/assets/modules/2.gif b/index_test_odoo/static/description/assets/modules/2.gif
deleted file mode 100644
index d19e2b352..000000000
Binary files a/index_test_odoo/static/description/assets/modules/2.gif and /dev/null differ
diff --git a/index_test_odoo/static/description/assets/modules/3.png b/index_test_odoo/static/description/assets/modules/3.png
deleted file mode 100644
index 8513873ea..000000000
Binary files a/index_test_odoo/static/description/assets/modules/3.png and /dev/null differ
diff --git a/index_test_odoo/static/description/assets/modules/4.png b/index_test_odoo/static/description/assets/modules/4.png
deleted file mode 100644
index 3bedf7981..000000000
Binary files a/index_test_odoo/static/description/assets/modules/4.png and /dev/null differ
diff --git a/index_test_odoo/static/description/assets/modules/5.png b/index_test_odoo/static/description/assets/modules/5.png
deleted file mode 100644
index 0e311ca87..000000000
Binary files a/index_test_odoo/static/description/assets/modules/5.png and /dev/null differ
diff --git a/index_test_odoo/static/description/assets/modules/6.jpg b/index_test_odoo/static/description/assets/modules/6.jpg
deleted file mode 100644
index 67c7f7062..000000000
Binary files a/index_test_odoo/static/description/assets/modules/6.jpg and /dev/null differ
diff --git a/index_test_odoo/static/description/assets/modules/courier_management.jpg b/index_test_odoo/static/description/assets/modules/courier_management.jpg
new file mode 100644
index 000000000..3e4a22c32
Binary files /dev/null and b/index_test_odoo/static/description/assets/modules/courier_management.jpg differ
diff --git a/index_test_odoo/static/description/assets/modules/cw_sale.png b/index_test_odoo/static/description/assets/modules/cw_sale.png
new file mode 100644
index 000000000..1b75c62d5
Binary files /dev/null and b/index_test_odoo/static/description/assets/modules/cw_sale.png differ
diff --git a/index_test_odoo/static/description/assets/modules/cw_stock.png b/index_test_odoo/static/description/assets/modules/cw_stock.png
new file mode 100644
index 000000000..62af09ec6
Binary files /dev/null and b/index_test_odoo/static/description/assets/modules/cw_stock.png differ
diff --git a/index_test_odoo/static/description/assets/modules/delivery_split.jpg b/index_test_odoo/static/description/assets/modules/delivery_split.jpg
new file mode 100644
index 000000000..76724ebda
Binary files /dev/null and b/index_test_odoo/static/description/assets/modules/delivery_split.jpg differ
diff --git a/index_test_odoo/static/description/assets/modules/multi_product_return_from_website.jpg b/index_test_odoo/static/description/assets/modules/multi_product_return_from_website.jpg
new file mode 100644
index 000000000..7f2cc2ab5
Binary files /dev/null and b/index_test_odoo/static/description/assets/modules/multi_product_return_from_website.jpg differ
diff --git a/index_test_odoo/static/description/assets/modules/purchase_history_of_product.jpg b/index_test_odoo/static/description/assets/modules/purchase_history_of_product.jpg
new file mode 100644
index 000000000..dab7b184c
Binary files /dev/null and b/index_test_odoo/static/description/assets/modules/purchase_history_of_product.jpg differ
diff --git a/index_test_odoo/static/description/assets/screenshots.zip b/index_test_odoo/static/description/assets/screenshots.zip
new file mode 100644
index 000000000..cb1c4783b
Binary files /dev/null and b/index_test_odoo/static/description/assets/screenshots.zip differ
diff --git a/index_test_odoo/static/description/assets/screenshots/branch_management.png b/index_test_odoo/static/description/assets/screenshots/branch_management.png
new file mode 100644
index 000000000..7332b5a76
Binary files /dev/null and b/index_test_odoo/static/description/assets/screenshots/branch_management.png differ
diff --git a/index_test_odoo/static/description/assets/screenshots/branch_management_1.png b/index_test_odoo/static/description/assets/screenshots/branch_management_1.png
new file mode 100644
index 000000000..ff8b55beb
Binary files /dev/null and b/index_test_odoo/static/description/assets/screenshots/branch_management_1.png differ
diff --git a/index_test_odoo/static/description/assets/screenshots/branch_management_2.png b/index_test_odoo/static/description/assets/screenshots/branch_management_2.png
new file mode 100644
index 000000000..c949ec121
Binary files /dev/null and b/index_test_odoo/static/description/assets/screenshots/branch_management_2.png differ
diff --git a/index_test_odoo/static/description/assets/screenshots/branch_management_3.png b/index_test_odoo/static/description/assets/screenshots/branch_management_3.png
new file mode 100644
index 000000000..d01d1c3f2
Binary files /dev/null and b/index_test_odoo/static/description/assets/screenshots/branch_management_3.png differ
diff --git a/index_test_odoo/static/description/assets/screenshots/branch_management_4.png b/index_test_odoo/static/description/assets/screenshots/branch_management_4.png
new file mode 100644
index 000000000..f8cfc480e
Binary files /dev/null and b/index_test_odoo/static/description/assets/screenshots/branch_management_4.png differ
diff --git a/index_test_odoo/static/description/assets/screenshots/branch_management_5.png b/index_test_odoo/static/description/assets/screenshots/branch_management_5.png
new file mode 100644
index 000000000..0b09adff2
Binary files /dev/null and b/index_test_odoo/static/description/assets/screenshots/branch_management_5.png differ
diff --git a/index_test_odoo/static/description/assets/screenshots/branch_management_6.png b/index_test_odoo/static/description/assets/screenshots/branch_management_6.png
new file mode 100644
index 000000000..ac3c02af4
Binary files /dev/null and b/index_test_odoo/static/description/assets/screenshots/branch_management_6.png differ
diff --git a/index_test_odoo/static/description/assets/screenshots/commit_1.png b/index_test_odoo/static/description/assets/screenshots/commit_1.png
new file mode 100644
index 000000000..5e18b3687
Binary files /dev/null and b/index_test_odoo/static/description/assets/screenshots/commit_1.png differ
diff --git a/index_test_odoo/static/description/assets/screenshots/commits.png b/index_test_odoo/static/description/assets/screenshots/commits.png
new file mode 100644
index 000000000..9227e467e
Binary files /dev/null and b/index_test_odoo/static/description/assets/screenshots/commits.png differ
diff --git a/index_test_odoo/static/description/assets/screenshots/config_settings.png b/index_test_odoo/static/description/assets/screenshots/config_settings.png
new file mode 100644
index 000000000..233f51999
Binary files /dev/null and b/index_test_odoo/static/description/assets/screenshots/config_settings.png differ
diff --git a/index_test_odoo/static/description/assets/screenshots/config_settings_1.png b/index_test_odoo/static/description/assets/screenshots/config_settings_1.png
new file mode 100644
index 000000000..1bd0b5548
Binary files /dev/null and b/index_test_odoo/static/description/assets/screenshots/config_settings_1.png differ
diff --git a/index_test_odoo/static/description/assets/screenshots/config_settings_3.png b/index_test_odoo/static/description/assets/screenshots/config_settings_3.png
new file mode 100644
index 000000000..a3dbdf99d
Binary files /dev/null and b/index_test_odoo/static/description/assets/screenshots/config_settings_3.png differ
diff --git a/index_test_odoo/static/description/assets/screenshots/gif.gif b/index_test_odoo/static/description/assets/screenshots/gif.gif
deleted file mode 100644
index a5acabdf1..000000000
Binary files a/index_test_odoo/static/description/assets/screenshots/gif.gif and /dev/null differ
diff --git a/index_test_odoo/static/description/assets/screenshots/img1.png b/index_test_odoo/static/description/assets/screenshots/img1.png
deleted file mode 100644
index 2dc823ed0..000000000
Binary files a/index_test_odoo/static/description/assets/screenshots/img1.png and /dev/null differ
diff --git a/index_test_odoo/static/description/assets/screenshots/img2.png b/index_test_odoo/static/description/assets/screenshots/img2.png
deleted file mode 100644
index a120e597d..000000000
Binary files a/index_test_odoo/static/description/assets/screenshots/img2.png and /dev/null differ
diff --git a/index_test_odoo/static/description/assets/screenshots/img3.png b/index_test_odoo/static/description/assets/screenshots/img3.png
deleted file mode 100644
index b1907f34a..000000000
Binary files a/index_test_odoo/static/description/assets/screenshots/img3.png and /dev/null differ
diff --git a/index_test_odoo/static/description/assets/screenshots/img4.png b/index_test_odoo/static/description/assets/screenshots/img4.png
deleted file mode 100644
index 3e7f6fe27..000000000
Binary files a/index_test_odoo/static/description/assets/screenshots/img4.png and /dev/null differ
diff --git a/index_test_odoo/static/description/assets/screenshots/img5.png b/index_test_odoo/static/description/assets/screenshots/img5.png
deleted file mode 100644
index 4b315945f..000000000
Binary files a/index_test_odoo/static/description/assets/screenshots/img5.png and /dev/null differ
diff --git a/index_test_odoo/static/description/assets/screenshots/img6.png b/index_test_odoo/static/description/assets/screenshots/img6.png
deleted file mode 100644
index 1d27fd4ce..000000000
Binary files a/index_test_odoo/static/description/assets/screenshots/img6.png and /dev/null differ
diff --git a/index_test_odoo/static/description/assets/screenshots/img7.png b/index_test_odoo/static/description/assets/screenshots/img7.png
deleted file mode 100644
index 7c0425a06..000000000
Binary files a/index_test_odoo/static/description/assets/screenshots/img7.png and /dev/null differ
diff --git a/index_test_odoo/static/description/assets/screenshots/is_view_1.png b/index_test_odoo/static/description/assets/screenshots/is_view_1.png
new file mode 100644
index 000000000..9f8b21570
Binary files /dev/null and b/index_test_odoo/static/description/assets/screenshots/is_view_1.png differ
diff --git a/index_test_odoo/static/description/assets/screenshots/is_view_2.png b/index_test_odoo/static/description/assets/screenshots/is_view_2.png
new file mode 100644
index 000000000..7b0de2bc2
Binary files /dev/null and b/index_test_odoo/static/description/assets/screenshots/is_view_2.png differ
diff --git a/index_test_odoo/static/description/assets/screenshots/pr_view.png b/index_test_odoo/static/description/assets/screenshots/pr_view.png
new file mode 100644
index 000000000..d82b1e8a4
Binary files /dev/null and b/index_test_odoo/static/description/assets/screenshots/pr_view.png differ
diff --git a/index_test_odoo/static/description/assets/screenshots/pr_view_1.png b/index_test_odoo/static/description/assets/screenshots/pr_view_1.png
new file mode 100644
index 000000000..40b73a17d
Binary files /dev/null and b/index_test_odoo/static/description/assets/screenshots/pr_view_1.png differ
diff --git a/index_test_odoo/static/description/assets/screenshots/pr_view_2.png b/index_test_odoo/static/description/assets/screenshots/pr_view_2.png
new file mode 100644
index 000000000..9a85c77ed
Binary files /dev/null and b/index_test_odoo/static/description/assets/screenshots/pr_view_2.png differ
diff --git a/index_test_odoo/static/description/assets/screenshots/repository_setup.png b/index_test_odoo/static/description/assets/screenshots/repository_setup.png
new file mode 100644
index 000000000..5a2bc40d8
Binary files /dev/null and b/index_test_odoo/static/description/assets/screenshots/repository_setup.png differ
diff --git a/index_test_odoo/static/description/assets/screenshots/repository_setup_1.png b/index_test_odoo/static/description/assets/screenshots/repository_setup_1.png
new file mode 100644
index 000000000..a2bf05279
Binary files /dev/null and b/index_test_odoo/static/description/assets/screenshots/repository_setup_1.png differ
diff --git a/index_test_odoo/static/description/assets/screenshots/repository_setup_2.png b/index_test_odoo/static/description/assets/screenshots/repository_setup_2.png
new file mode 100644
index 000000000..72a2b6294
Binary files /dev/null and b/index_test_odoo/static/description/assets/screenshots/repository_setup_2.png differ
diff --git a/index_test_odoo/static/description/assets/screenshots/repository_setup_3.png b/index_test_odoo/static/description/assets/screenshots/repository_setup_3.png
new file mode 100644
index 000000000..1564f2ef1
Binary files /dev/null and b/index_test_odoo/static/description/assets/screenshots/repository_setup_3.png differ
diff --git a/index_test_odoo/static/description/assets/screenshots/repository_setup_4.png b/index_test_odoo/static/description/assets/screenshots/repository_setup_4.png
new file mode 100644
index 000000000..a8bbf5be2
Binary files /dev/null and b/index_test_odoo/static/description/assets/screenshots/repository_setup_4.png differ
diff --git a/index_test_odoo/static/description/assets/y18.jpg b/index_test_odoo/static/description/assets/y18.jpg
new file mode 100644
index 000000000..eea1714f2
Binary files /dev/null and b/index_test_odoo/static/description/assets/y18.jpg differ
diff --git a/index_test_odoo/static/description/banner.png b/index_test_odoo/static/description/banner.png
deleted file mode 100644
index b39ac272a..000000000
Binary files a/index_test_odoo/static/description/banner.png and /dev/null differ
diff --git a/index_test_odoo/static/description/icon.png b/index_test_odoo/static/description/icon.png
deleted file mode 100644
index 4a4b29d2e..000000000
Binary files a/index_test_odoo/static/description/icon.png and /dev/null differ
diff --git a/index_test_odoo/static/description/index.html b/index_test_odoo/static/description/index.html
index bbacd2d2c..233177ab1 100644
--- a/index_test_odoo/static/description/index.html
+++ b/index_test_odoo/static/description/index.html
@@ -1,322 +1,535 @@
 <!DOCTYPE html>
 <html lang="en">
 <head>
-  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>Health Report</title>
+    <meta charset="UTF-8"/>
+    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
+    <title>GitHub Odoo Integration</title>
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet"/>
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.6.0/css/all.min.css"/>
+    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&family=Plus+Jakarta+Sans:wght@600;700&display=swap"
+          rel="stylesheet"/>
+    <style>
+        body {
+          font-family: "Inter", sans-serif;
+          background: #fff;
+          color: #111;
+        }
+        h1, h2 {
+          font-family: "Plus Jakarta Sans", sans-serif;
+          font-weight: 700;
+          color: #111;
+        }
 
-  <link rel="preconnect" href="https://fonts.googleapis.com">
-  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
-  <link href="https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap"
-        rel="stylesheet">
-  <link rel="preconnect" href="https://fonts.googleapis.com">
-  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
-  <link href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300..700&display=swap" rel="stylesheet">
+        /* Hero */
+        .hero {
+          text-align: center;
+          padding: 80px 20px 60px;
+        }
+        .hero h1 {
+          font-size: 3rem;
+          font-weight: 700;
+          letter-spacing: -0.5px;
+        }
+        .hero h1 span {
+          color: #3B82F6;
+        }
+        .hero p {
+          font-size: 1.2rem;
+          color: #555;
+          margin-top: 10px;
+        }
+        .cta-btn {
+          margin-top: 25px;
+          padding: 12px 28px;
+          font-size: 1rem;
+          font-weight: 600;
+          border-radius: 30px;
+          border: none;
+          background: #111;
+          color: #fff;
+          text-decoration: none;
+          display: inline-block;
+          transition: all .3s ease;
+        }
+        .cta-btn:hover {
+          background: #333;
+          transform: translateY(-3px);
+        }
 
-  <style>
-    .accordion-item:first-of-type .accordion-button {
-      border-top-left-radius: 3rem;
-      border-top-right-radius: 3rem;
-    }
+        /* Section */
+        .section {
+          padding: 70px 0;
+        }
+        .section h2 {
+          font-size: 1.8rem;
+          margin-bottom: 16px;
+        }
+        .section p {
+          font-size: 1rem;
+          color: #444;
+        }
 
-    .accordion-item:last-of-type .accordion-button.collapsed {
-      border-bottom-right-radius: 3rem;
-      border-bottom-left-radius: 3rem;
-    }
+        /* Screenshot Box */
+        .screenshot-box {
+          border-radius: 14px;
+          padding: 10px;
+          background: #f9f9f9;
+        }
+        .screenshot-box img {
+          border-radius: 10px;
+          width: 100%;
+          height: auto;
+          cursor: zoom-in;
+          transition: transform .3s;
+        }
+        .screenshot-box img:hover {
+          transform: scale(1.02);
+        }
 
-    .accordion-item:last-of-type {
-      border-bottom-right-radius: 3rem;
-      border-bottom-left-radius: 3rem;
-    }
+        /* Workflow */
+        .workflow-menu .nav-link {
+          font-weight: 600;
+          color: #444;
+          padding: 12px 16px;
+          border-radius: 8px;
+          margin-bottom: 6px;
+          transition: .3s;
+        }
+        .workflow-menu .nav-link.active {
+          background: #111;
+          color: #fff !important;
+        }
+        .workflow-menu .nav-link:hover { background: #f5f5f5; }
+        .workflow-menu .active:hover { background: #6b6060 !important; }
+        .workflow-content {
+          border-radius: 12px;
+          padding: 20px;
+          background: #fff;
+          box-shadow: 0 4px 14px rgba(0,0,0,.08);
+          height: 570px !important;
+        }
 
-    .accordion-item:first-of-type {
-      border-top-left-radius: 3rem;
-      border-top-right-radius: 3rem;
-    }
+        /* Lightbox */
+        .lightbox {
+          display: none;
+          position: fixed;
+          z-index: 1050;
+          top: 0; left: 0; right: 0; bottom: 0;
+          background: rgba(0,0,0,0.9);
+          justify-content: center;
+          align-items: center;
+        }
+        .lightbox img {
+          max-width: 90%;
+          max-height: 90%;
+          border-radius: 10px;
+          box-shadow: 0 8px 20px rgba(0,0,0,.4);
+        }
+        .lightbox:target { display: flex; }
+        .lightbox-close {
+          position: absolute;
+          top: 20px; right: 30px;
+          font-size: 2rem;
+          color: #fff;
+          text-decoration: none;
+          font-weight: bold;
+        }
 
-    .accordion-button:focus {
-      border-color: unset;
-      box-shadow: unset;
-    }
+        /* Carousel Arrows */
+        .carousel-control-prev-icon,
+        .carousel-control-next-icon {
+          background-image: none !important;
+        }
+        .carousel-control-prev-icon::after,
+        .carousel-control-next-icon::after {
+          font-family: "Font Awesome 6 Free";
+          font-weight: 900;
+          font-size: 28px;
+          color: #111;
+        }
+        .carousel-control-prev-icon::after { content: "\f104"; }
+        .carousel-control-next-icon::after { content: "\f105"; }
 
-    .accordion-button:not(.collapsed) {
-      background-color: #0480e1;
-      color: white;
-      border-radius: 0;
-      box-shadow: unset;
-    }
+        /* Related Products */
+        .product-overlay {
+          position: relative;
+          border-radius: 14px;
+          overflow: hidden;
+          box-shadow: 0 6px 18px rgba(0,0,0,.1);
+        }
+        .product-overlay img {
+          width: 100%;
+          height: auto;
+          display: block;
+          transition: transform .4s ease;
+        }
+        .product-overlay:hover img {
+          transform: scale(1.08);
+        }
+        .product-overlay .overlay {
+          position: absolute;
+          inset: 0;
+          background: linear-gradient(to top,rgba(0,0,0,0.7),rgba(0,0,0,0));
+          color: #fff;
+          display: flex;
+          flex-direction: column;
+          justify-content: flex-end;
+          padding: 20px;
+          opacity: 0;
+          transition: opacity .4s ease;
+        }
+        .product-overlay:hover .overlay { opacity: 1; }
+        .overlay h5 { font-weight: 600; margin-bottom: 10px; }
 
-    .accordion-item:not(:first-of-type) {
-      border-top: 1px solid black;
-    }
-
-    .accordion-button:not(.collapsed) .head {
-      border-bottom: 1px solid white;
-    }
-
-    .accordion-button::after {
-      position: relative;
-      top: -10px;
-      background-color: #ffffff;
-      width: 50px;
-      height: 50px;
-      border-radius: 50%;
-      background-position: center;
-      border: 1px solid black;
-      background-image: url(./assets/img/plus.svg);
-    }
-
-    .accordion-button:not(.collapsed)::after {
-      background-image: url(./assets/img/minus.svg);
-    }
-  </style>
+        /* Footer */
+        .footer {
+          margin-top: 60px;
+          text-align: center;
+          font-size: 14px;
+          color: #666;
+          padding: 20px 0;
+          border-top: 1px solid #eee;
+        }
+    </style>
 </head>
+<body>
 
-<body style="font-family: Poppins, sans-serif; background: linear-gradient(180deg, #dcebf9, #faecff);">
-  <!-- Heading -->
-  <div class="oe_container container-fluid py-5" style="max-width:1526.4px; margin-left:auto; margin-right:auto; padding-left:54px; padding-right:54px;">
-    <div class="header" style="background-image: url('/odoo_health_report/static/description/assets/img/header.jpg'); background-position: center; background-size: cover; height: 130px; border-radius: 3rem; box-shadow: 0px 5px #0480e1; display: flex; align-items: center; justify-content: center; border: 1px solid #0480e1;">
-      <h1 style="font-size: 3rem; font-weight: 700; margin-bottom: 0;">Health Report</h1>
-    </div>
-  </div>
+<!-- Hero -->
+<section class="hero">
+    <h1>GitHub <span>Odoo Integration</span></h1>
+    <p>Seamlessly connect GitHub with Odoo – manage repositories, branches, commits, issues & PRs from one place.</p>
+    <a href="#" class="cta-btn">Try Now</a>
+</section>
 
-  <!-- Overview -->
-  <div class="container-fluid py-5" style="max-width:1526.4px; margin-left:auto; margin-right:auto; padding-left:54px; padding-right:54px;">
-    <div class="banner" style="background-image: url('/odoo_health_report/static/description/assets/img/banner.jpg'); background-position: top; background-size: cover; border-radius: 3rem; display: flex; align-items: center; justify-content: center; color: white; overflow: hidden; position: relative;">
-      <img src="./assets/img/cybro.jpg" alt="" class="cybro" style="position: absolute; right: -5px; bottom: -3px; width: 115px; border-radius: 10px; max-width: 100%;">
-      <div class="row">
-        <div class="col-md-6 p-5 d-flex flex-column justify-content-center">
-          <h2 style="font-size: 3rem; font-weight: 700;color: white;">Analyze. Audit. Improve.</h2>
-          <p style="font-size: 1.2rem; color: rgb(255 255 255 / 80%); line-height: 28px;">Odoo Module Health Report is a powerful developer tool designed to help Odoo developers and technical teams
-            maintain high-quality code standards across custom modules. It offers deep analysis and visual insights on
-            code health, along with a PDF report for audits or documentation.</p>
-          <ul style="list-style: none; padding-left: 0;">
-            <li style="font-size: 1.3rem; font-weight: 600; padding: 1rem 0; display: flex; align-items: center; gap: 1rem;">
-              <img src="./assets/img/icon1.svg" alt="" style="width: 40px;">
-              Comprehensive Code Checks
-            </li>
-            <li style="font-size: 1.3rem; font-weight: 600; padding: 1rem 0; display: flex; align-items: center; gap: 1rem;">
-              <img src="./assets/img/icon2.svg" alt="" style="width: 40px;">
-              Odoo Code Standards Check
-            </li>
-            <li style="font-size: 1.3rem; font-weight: 600; padding: 1rem 0; display: flex; align-items: center; gap: 1rem;">
-              <img src="./assets/img/icon3.svg" alt="" style="width: 40px;">
-              Interactive Dashboard & PDF Report
-            </li>
-            <li style="font-size: 1.3rem; font-weight: 600; padding: 1rem 0; display: flex; align-items: center; gap: 1rem;">
-              <img src="./assets/img/icon4.svg" alt="" style="width: 40px;">
-              Compatible with V18 CE & EE
-            </li>
-          </ul>
-        </div>
-        <div class="col-md-6 position-relative d-flex justify-content-center align-items-center">
-          <img src="./assets/img/banner-img.png" alt="" class="banner-img" style="margin-left: 13rem; width: 100%;">
-        </div>
-      </div>
-    </div>
-  </div>
-
-  <!-- Featured Categories -->
-  <div class="container-fluid py-5" style="max-width:1526.4px; margin-left:auto; margin-right:auto; padding-left:54px; padding-right:54px;">
-    <h2 class="headmain" style="font-family: sans-serif; background-color: #b9ff66; width: max-content; padding: 5px 10px; margin-bottom: 1rem; border-radius: 8px; font-size: 2.3rem;">Featured Categories</h2>
-    <div class="row row-cols-lg-2 row-cols-1 g-xl-4 g-3 ">
-      <div class="col">
-        <div class="box box1" style="padding: 3rem; border-radius: 2rem; position: relative; min-height: 300px; border: 1px solid black; box-shadow: 0px 5px #000000; background: white;">
-          <img src="./assets/img/box1.png" alt="" width="150" style="max-width: 100%; position: absolute; right: 2rem; bottom: 2rem;">
-          <h3 class="head" style="width: max-content; padding: 8px 10px; margin-bottom: 2rem; border-radius: 8px; background: #0480e1; color: white;">Clean Code is Beautiful Code</h3>
-          <p style="max-width: 350px; font-size: 1.1rem; font-weight: 500;">Detect spacing, indentation, and unused code issues to maintain clean and readable code.</p>
-        </div>
-      </div>
-      <div class="col">
-        <div class="box box2" style="padding: 3rem; border-radius: 2rem; position: relative; min-height: 300px; border: 1px solid black; box-shadow: 0px 5px #000000; background: black;">
-          <img src="./assets/img/box2.png" alt="" width="150" style="max-width: 100%;position: absolute; right: 2rem; bottom: 2rem;">
-          <h3 class="head" style="width: max-content; padding: 8px 10px; margin-bottom: 2rem; border-radius: 8px;background: white; color: black;">Built to Work, Not Break</h3>
-          <p style="max-width: 350px; font-size: 1.1rem; font-weight: 500; color: white;">Catch logic issues and unsafe patterns early to improve code quality.</p>
-        </div>
-      </div>
-      <div class="col">
-        <div class="box box3" style="padding: 3rem; border-radius: 2rem; position: relative; min-height: 300px; border: 1px solid 0480e1; box-shadow: 0px 5px #0480e1; background: #0480e1;">
-          <img src="./assets/img/box3.png" alt="" width="150" style="max-width: 100%; position: absolute; right: 2rem; bottom: 2rem;">
-          <h3 class="head" style="width: max-content; padding: 8px 10px; margin-bottom: 2rem; border-radius: 8px; background: white; color: black;">Code Safe. Business Safer.</h3>
-          <p style="max-width: 350px; font-size: 1.1rem; font-weight: 500;color: white;">Spot security risks early, like unsafe access and weak encryption, to write safer code from the star</p>
-        </div>
-      </div>
-      <div class="col">
-        <div class="box box1" style="padding: 3rem; border-radius: 2rem; position: relative; min-height: 300px; border: 1px solid black; box-shadow: 0px 5px #000000; background: white;">
-          <img src="./assets/img/box4.png" alt="" width="200" style="max-width: 100%; position: absolute; right: 2rem; bottom: 2rem;">
-          <h3 class="head mb-0" style="width: max-content; padding: 8px 10px; margin-bottom: 2rem; border-radius: 8px; background: #0480e1; color: white;">Complex Code? Simplify </h3>
-          <h3 class="head" style="width: max-content; padding: 8px 10px; margin-bottom: 2rem; border-radius: 8px; background: #0480e1; color: white;">Like a Pro</h3>
-          <p style="max-width: 350px; font-size: 1.1rem; font-weight: 500;">Analyze function complexity and simplify code for better reliability.</p>
+<!-- Section 1 - Configuration Settings -->
+<section class="section">
+    <div class="container">
+        <div class="row align-items-center">
+            <div class="col-md-4">
+                <h2>Configuration Settings</h2>
+                <p>Easily configure GitHub API credentials, webhook secrets, and access tokens directly from Odoo’s
+                    settings menu.</p>
+            </div>
+            <div class="col-md-8">
+                <div class="screenshot-box">
+                    <a href="#lightbox1"><img src="./assets/screenshots/config_settings.png"
+                                              alt="Configuration Settings"/></a>
+                </div>
+            </div>
         </div>
-      </div>
     </div>
-  </div>
+</section>
 
-  <!-- Stay Odoo-official! -->
-  <div class="container-fluid py-5" style="max-width:1526.4px; margin-left:auto; margin-right:auto; padding-left:54px; padding-right:54px;">
-    <div class="section" style="box-shadow: 0px 5px black; border: 1px solid black; background-color: #b9ff66; border-radius: 3rem; padding: 3rem;">
-      <div class="row">
-        <div class="col-md-6 d-flex flex-column justify-content-center">
-          <h5 style="font-size: 1.5rem;">Stay Odoo-official!</h5>
-          <p>Ensure your custom modules follow Odoo’s official coding standards, from proper naming to a clean
-            structure.
-            Build confidently with fully compliant code.</p>
-        </div>
-        <div class="col-md-6 position-relative">
-          <img src="./assets/img/section.png" alt="" width="200" style="max-width: 100%;position: absolute; top: 0; bottom: 0; margin: auto; right: 3rem;">
+<!-- Section 2 - Repository Setup -->
+<section class="section bg-light">
+    <div class="container">
+        <div class="row align-items-center flex-md-row-reverse">
+            <div class="col-md-4">
+                <h2>Repository Setup</h2>
+                <p>Link one or more GitHub repositories with Odoo projects, sync metadata, and manage forks within
+                    Odoo.</p>
+            </div>
+            <div class="col-md-8">
+                <div class="screenshot-box">
+                    <a href="#lightbox2"><img src="./assets/screenshots/repository_setup.png"
+                                              alt="Repository Setup"/></a>
+                </div>
+            </div>
         </div>
-      </div>
     </div>
-  </div>
+</section>
 
-  <!-- Installation -->
-  <div class="container-fluid py-5" style="max-width:1526.4px; margin-left:auto; margin-right:auto; padding-left:54px; padding-right:54px;">
-    <div class="d-flex gap-3">
-      <h2 class="headmain" style="font-family: sans-serif; background-color: #b9ff66; width: max-content; padding: 5px 10px; margin-bottom: 1rem; border-radius: 8px; font-size: 2.3rem;">Installation</h2>
-      <p>To install the Odoo Module Health Report, follow these<br> standard Odoo module steps:</p>
-    </div>
-    <div class="row row-cols-lg-4 row-cols-1 g-xl-4 g-3 ">
-      <div class="col">
-        <div class="box box2" style="padding: 3rem; border-radius: 2rem; position: relative; min-height: 300px; border: 1px solid black; box-shadow: 0px 5px #000000; background: black;">
-          <span class="num" style="width: 50px; height: 50px; background-color: white; color: black; display: flex; align-items: center; justify-content: center; margin-bottom: 1rem; font-size: 1.2rem; font-weight: 600; border-radius: 50%;">01</span>
-          <p style="max-width: 350px; font-size: 1.1rem; font-weight: 500;color: white;">Place the module folder inside your <span style="color: #b9ff66;">Odoo custom_addons/</span> directory.</p>
-        </div>
-      </div>
-      <div class="col">
-        <div class="box box2" style="padding: 3rem; border-radius: 2rem; position: relative; min-height: 300px; border: 1px solid black; box-shadow: 0px 5px #000000; background: black;">
-          <span class="num" style="width: 50px; height: 50px; background-color: white; color: black; display: flex; align-items: center; justify-content: center; margin-bottom: 1rem; font-size: 1.2rem; font-weight: 600; border-radius: 50%;">02</span>
-          <p style="max-width: 350px; font-size: 1.1rem; font-weight: 500;color: white;">
-            Install the required Python dependencies using the provided requirements.txt file: <span
-              style="color: #b9ff66;">pip install -r requirements.txt</span></p>
-        </div>
-      </div>
-      <div class="col">
-        <div class="box box2" style="padding: 3rem; border-radius: 2rem; position: relative; min-height: 300px; border: 1px solid black; box-shadow: 0px 5px #000000; background: black;">
-          <span class="num" style="width: 50px; height: 50px; background-color: white; color: black; display: flex; align-items: center; justify-content: center; margin-bottom: 1rem; font-size: 1.2rem; font-weight: 600; border-radius: 50%;">03</span>
-          <p style="max-width: 350px; font-size: 1.1rem; font-weight: 500;color: white;">In Odoo, go to Apps > Update App List to refresh available modules.</p>
-        </div>
-      </div>
-      <div class="col">
-        <div class="box box2" style="padding: 3rem; border-radius: 2rem; position: relative; min-height: 300px; border: 1px solid black; box-shadow: 0px 5px #000000; background: black;">
-          <span class="num" style="width: 50px; height: 50px; background-color: white; color: black; display: flex; align-items: center; justify-content: center; margin-bottom: 1rem; font-size: 1.2rem; font-weight: 600; border-radius: 50%;">04</span>
-          <p style="max-width: 350px; font-size: 1.1rem; font-weight: 500;color: white;">Search for Odoo Module Health Report in the Apps menu and click Install</p>
+<section class="section">
+    <div class="container">
+        <div class="row align-items-center">
+            <div class="col-md-4">
+                <h2>Branch Management</h2>
+                <p>Easily configure GitHub API credentials, webhook secrets, and access tokens directly from Odoo’s
+                    settings menu.</p>
+            </div>
+            <div class="col-md-8">
+                <div class="screenshot-box">
+                    <a href="#lightbox22"><img src="./assets/screenshots/branch_management.png" alt="Branch Management"/></a>
+                </div>
+            </div>
         </div>
-      </div>
     </div>
+</section>
 
-  </div>
-
-  <!--  Frequently Asked Questions -->
-  <div class="container-fluid py-5" style="max-width:1526.4px; margin-left:auto; margin-right:auto; padding-left:54px; padding-right:54px;">
-    <h2 class="headmain" style="font-family: sans-serif; background-color: #b9ff66; width: max-content; padding: 5px 10px; margin-bottom: 1rem; border-radius: 8px; font-size: 2.3rem;">Frequently Asked Questions </h2>
-    <div class="accordion myaccordion" id="accordionExample">
-      <div class="accordion-item" style="margin-bottom: 1rem; border-radius: 3rem; box-shadow: 0px 5px black; border: 1px solid black; overflow: hidden;">
-        <h2 class="accordion-header" id="headingOne">
-          <button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#collapseOne"
-            aria-expanded="true" aria-controls="collapseOne" style="background-color: #f3f3f3; padding: 2rem; font-size: 1.3rem; padding-bottom: 0;">
-            <div class="head" style="width: 100%; border: transparent; display: flex; align-items: center; padding-bottom: 2rem;">
-              <span style="font-size: 3rem; margin-right: 2.5rem;">01</span> What does this module actually check?
+<section class="section bg-light">
+    <div class="container">
+        <div class="row align-items-center flex-md-row-reverse">
+            <div class="col-md-4">
+                <h2>Commits Tracking</h2>
+                <p>Track commits linked to tasks and manage real-time updates via GitHub webhooks.</p>
             </div>
-          </button>
-        </h2>
-        <div id="collapseOne" class="accordion-collapse collapse show" aria-labelledby="headingOne"
-          data-bs-parent="#accordionExample">
-          <div class="accordion-body" style="padding: 3rem; background: #0480e1; color: white;">
-            This module analyzes Odoo custom modules for code quality, maintainability, and structure. It checks naming
-            conventions, code style, formatting, complexity, security risks, and overall code health.
-          </div>
-        </div>
-      </div>
-      <div class="accordion-item" style="margin-bottom: 1rem; border-radius: 3rem; box-shadow: 0px 5px black; border: 1px solid black; overflow: hidden;">
-        <h2 class="accordion-header" id="headingTwo">
-          <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse"
-            data-bs-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo" style="background-color: #f3f3f3; padding: 2rem; font-size: 1.3rem; padding-bottom: 0;">
-            <div class="head" style="width: 100%; border: transparent; display: flex; align-items: center; padding-bottom: 2rem;">
-              <span style="font-size: 3rem; margin-right: 2.5rem;">02</span> Will it make changes to my code automatically?
+            <div class="col-md-8">
+                <div class="screenshot-box">
+                    <a href="#lightbox23"><img src="./assets/screenshots/commits.png" alt="Commits & PR Tracking"/></a>
+                </div>
             </div>
-          </button>
-        </h2>
-        <div id="collapseTwo" class="accordion-collapse collapse" aria-labelledby="headingTwo"
-          data-bs-parent="#accordionExample">
-          <div class="accordion-body" style="padding: 3rem; background: #0480e1; color: white;">
-            No, it only detects and reports issues. It does not modify your files. You will receive a dashboard view and
-            optional PDF reports to take action manually.
-          </div>
         </div>
-      </div>
-      <div class="accordion-item" style="margin-bottom: 1rem; border-radius: 3rem; box-shadow: 0px 5px black; border: 1px solid black; overflow: hidden;">
-        <h2 class="accordion-header" id="headingThree">
-          <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse"
-            data-bs-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree" style="background-color: #f3f3f3; padding: 2rem; font-size: 1.3rem; padding-bottom: 0;">
-            <div class="head" style="width: 100%; border: transparent; display: flex; align-items: center; padding-bottom: 2rem;">
-              <span style="font-size: 3rem; margin-right: 2.5rem;">03</span> Does this work with Odoo.sh or Docker setups?
+    </div>
+</section>
+<!-- Workflow Section -->
+<section class="section">
+    <div class="container">
+        <h2 class="text-center mb-5">Workflow Demo</h2>
+        <div class="row">
+            <!-- Sidebar -->
+            <div class="col-md-3">
+                <ul class="nav flex-column nav-pills workflow-menu" id="workflow-tabs">
+                    <li><a class="nav-link active" data-bs-toggle="pill" href="#wf-config"><i
+                            class="fa-solid fa-gear me-2"></i> Configuration</a></li>
+                    <li><a class="nav-link" data-bs-toggle="pill" href="#wf-repo"><i
+                            class="fa-solid fa-database me-2"></i> Repositories</a></li>
+                    <li><a class="nav-link" data-bs-toggle="pill" href="#wf-branch"><i
+                            class="fa-solid fa-code-branch me-2"></i> Branches</a></li>
+                    <li><a class="nav-link" data-bs-toggle="pill" href="#wf-commit"><i
+                            class="fa-solid fa-clock-rotate-left me-2"></i> Commits</a></li>
+                    <li><a class="nav-link" data-bs-toggle="pill" href="#wf-pr"><i
+                            class="fa-solid fa-code-pull-request me-2"></i> Pull Requests</a></li>
+                    <li><a class="nav-link" data-bs-toggle="pill" href="#wf-issue"><i class="fa-solid fa-bug me-2"></i>
+                        Issues</a></li>
+                </ul>
             </div>
-          </button>
-        </h2>
-        <div id="collapseThree" class="accordion-collapse collapse" aria-labelledby="headingThree"
-          data-bs-parent="#accordionExample">
-          <div class="accordion-body" style="padding: 3rem; background: #0480e1; color: white;">
-            Yes, it can be used in Odoo.sh or Docker environments as long as the required Python dependencies are
-            installed using the provided <code>requirements.txt</code>.
-          </div>
-        </div>
-      </div>
-      <div class="accordion-item" style="margin-bottom: 1rem; border-radius: 3rem; box-shadow: 0px 5px black; border: 1px solid black; overflow: hidden;">
-        <h2 class="accordion-header" id="headingFour">
-          <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse"
-            data-bs-target="#collapseFour" aria-expanded="false" aria-controls="collapseFour" style="background-color: #f3f3f3; padding: 2rem; font-size: 1.3rem; padding-bottom: 0;">
-            <div class="head" style="width: 100%; border: transparent; display: flex; align-items: center; padding-bottom: 2rem;">
-              <span style="font-size: 3rem; margin-right: 2.5rem;">04</span> Can I export reports?
+
+            <!-- Content -->
+            <div class="col-md-9">
+                <div class="tab-content workflow-content">
+                    <div class="tab-pane fade show active" id="wf-config">
+                        <h4>Configuration</h4>
+                        <div id="carousel-config" class="carousel slide mt-3" data-bs-ride="carousel">
+                            <div class="carousel-inner">
+                                <div class="carousel-item active"><p>1.Choose the github user access rights from the
+                                    user settings.</p>
+                                    <div class="screenshot-box"><a href="#lightbox3"><img
+                                            src="./assets/screenshots/config_settings_3.png"
+                                            class="d-block w-100"/></a></div>
+                                </div>
+                                <div class="carousel-item active"><p>2.Open the github configuration settings to setup
+                                    the API tokens and webhooks</p>
+                                    <div class="screenshot-box"><a href="#lightbox9"><img
+                                            src="./assets/screenshots/config_settings_1.png"
+                                            class="d-block w-100"/></a></div>
+                                </div>
+                                <div class="carousel-item"><p>3.Set up API tokens and webhooks easily inside Odoo.</p>
+                                    <div class="screenshot-box"><a href="#lightbox10"><img
+                                            src="./assets/screenshots/config_settings.png"
+                                            class="d-block w-100"/></a></div>
+                                </div>
+                            </div>
+                            <button class="carousel-control-prev" type="button" data-bs-target="#carousel-config"
+                                    data-bs-slide="prev"><span class="carousel-control-prev-icon"></span></button>
+                            <button class="carousel-control-next" type="button" data-bs-target="#carousel-config"
+                                    data-bs-slide="next"><span class="carousel-control-next-icon"></span></button>
+                        </div>
+                    </div>
+                    <div class="tab-pane fade" id="wf-repo">
+                        <h4>Repositories</h4>
+                        <div id="carousel-repo" class="carousel slide mt-3" data-bs-ride="carousel">
+                            <div class="carousel-inner">
+                                <div class="carousel-item active"><p>1.Enter the repository name and owner in the form
+                                    view, then click the <strong>Setup Webhook</strong> button to configure the webhook
+                                    in the GitHub repository.</p>
+                                    <div class="screenshot-box"><a href="#lightbox4"><img
+                                            src="./assets/screenshots/repository_setup_1.png"
+                                            class="d-block w-100"/></a></div>
+                                </div>
+                                <div class="carousel-item"><p>2.If the webhook is created successfully, a success
+                                    message will appear in the chatter, and the webhook URL will be generated.</p>
+                                    <div class="screenshot-box"><a href="#lightbox11"><img
+                                            src="./assets/screenshots/repository_setup_2.png"
+                                            class="d-block w-100"/></a></div>
+                                </div>
+                                <div class="carousel-item"><p>3.Click on the <strong>Sync Repository</strong> button to
+                                    synchronize all GitHub repository data into the Odoo repository.</p>
+                                    <div class="screenshot-box"><a href="#lightbox12"><img
+                                            src="./assets/screenshots/repository_setup_3.png"
+                                            class="d-block w-100"/></a></div>
+                                </div>
+                                <div class="carousel-item"><p>4. After the repository is successfully synced, the state
+                                    will change to <strong>Success</strong>, and all other details will be fetched.</p>
+                                    <div class="screenshot-box"><a href="#lightbox13"><img
+                                            src="./assets/screenshots/repository_setup_4.png"
+                                            class="d-block w-100"/></a></div>
+                                </div>
+                            </div>
+                            <button class="carousel-control-prev" type="button" data-bs-target="#carousel-repo"
+                                    data-bs-slide="prev"><span class="carousel-control-prev-icon"></span></button>
+                            <button class="carousel-control-next" type="button" data-bs-target="#carousel-repo"
+                                    data-bs-slide="next"><span class="carousel-control-next-icon"></span></button>
+                        </div>
+                    </div>
+                    <div class="tab-pane fade" id="wf-branch">
+                        <h4>Branches</h4>
+                        <div id="carousel-branch" class="carousel slide mt-3" data-bs-ride="carousel">
+                            <div class="carousel-inner">
+                                <div class="carousel-item active"><p>1.By clicking on the Branches, you can view all the
+                                    corresponding branches linked to each repository.</p>
+                                    <div class="screenshot-box"><a href="#lightbox5"><img
+                                            src="./assets/screenshots/branch_management_1.png"
+                                            class="d-block w-100"/></a></div>
+                                </div>
+                                <div class="carousel-item"><p>2.From the Branch form view, you can see all the details
+                                    related to the corresponding branch.</p>
+                                    <div class="screenshot-box"><a href="#lightbox14"><img
+                                            src="./assets/screenshots/branch_management_2.png"
+                                            class="d-block w-100"/></a></div>
+                                </div>
+                                <div class="carousel-item"><p>3.Click on the <strong>Sync Branch</strong> button to
+                                    synchronise the branch details from the github.</p>
+                                    <div class="screenshot-box"><a href="#lightbox15"><img
+                                            src="./assets/screenshots/branch_management_3.png"
+                                            class="d-block w-100"/></a></div>
+                                </div>
+                                <div class="carousel-item"><p>4.From the repository record, you can create a new branch
+                                    in GitHub directly from Odoo.</p>
+                                    <div class="screenshot-box"><a href="#lightbox16"><img
+                                            src="./assets/screenshots/branch_management_4.png"
+                                            class="d-block w-100"/></a></div>
+                                </div>
+                                <div class="carousel-item">
+                                    <div class="screenshot-box"><a href="#lightbox17"><img
+                                            src="./assets/screenshots/branch_management_5.png"
+                                            class="d-block w-100"/></a></div>
+                                </div>
+                                <div class="carousel-item">
+                                    <div class="screenshot-box"><a href="#lightbox18"><img
+                                            src="./assets/screenshots/branch_management_6.png"
+                                            class="d-block w-100"/></a></div>
+                                </div>
+                            </div>
+                            <button class="carousel-control-prev" type="button" data-bs-target="#carousel-branch"
+                                    data-bs-slide="prev"><span class="carousel-control-prev-icon"></span></button>
+                            <button class="carousel-control-next" type="button" data-bs-target="#carousel-branch"
+                                    data-bs-slide="next"><span class="carousel-control-next-icon"></span></button>
+                        </div>
+                    </div>
+                    <div class="tab-pane fade" id="wf-commit">
+                        <h4>Commits</h4>
+                        <p>Track commits per branch and auto-link with tasks.</p>
+                        <div id="carousel-commit" class="carousel slide mt-3" data-bs-ride="carousel">
+                            <div class="carousel-inner">
+                                <div class="carousel-item active">
+                                    <div class="screenshot-box"><a href="#lightbox6"><img
+                                            src="./assets/screenshots/commits.png"
+                                            class="d-block w-100"/></a></div>
+                                </div>
+                                <div class="carousel-item">
+                                    <div class="screenshot-box"><a href="#lightbox19"><img
+                                            src="./assets/screenshots/commit_1.png"
+                                            class="d-block w-100"/></a></div>
+                                </div>
+                            </div>
+                            <button class="carousel-control-prev" type="button" data-bs-target="#carousel-commit"
+                                    data-bs-slide="prev"><span class="carousel-control-prev-icon"></span></button>
+                            <button class="carousel-control-next" type="button" data-bs-target="#carousel-commit"
+                                    data-bs-slide="next"><span class="carousel-control-next-icon"></span></button>
+                        </div>
+                    </div>
+                    <div class="tab-pane fade" id="wf-pr">
+                        <h4>Pull Requests</h4>
+                        <p>Monitor open, closed, and merged pull requests.</p>
+                        <div id="carousel-pr" class="carousel slide mt-3" data-bs-ride="carousel">
+                            <div class="carousel-inner">
+                                <div class="carousel-item active">
+                                    <div class="screenshot-box"><a href="#lightbox7"><img
+                                            src="./assets/screenshots/pr_view_1.png"
+                                            class="d-block w-100"/></a></div>
+                                </div>
+                                <div class="carousel-item">
+                                    <div class="screenshot-box"><a href="#lightbox20"><img
+                                            src="./assets/screenshots/pr_view_2.png"
+                                            class="d-block w-100"/></a></div>
+                                </div>
+                            </div>
+                            <button class="carousel-control-prev" type="button" data-bs-target="#carousel-pr"
+                                    data-bs-slide="prev"><span class="carousel-control-prev-icon"></span></button>
+                            <button class="carousel-control-next" type="button" data-bs-target="#carousel-pr"
+                                    data-bs-slide="next"><span class="carousel-control-next-icon"></span></button>
+                        </div>
+                    </div>
+                    <div class="tab-pane fade" id="wf-issue">
+                        <h4>Issues</h4>
+                        <p>Track issues per repositories and auto-link with tasks.</p>
+                        <div id="carousel-is" class="carousel slide mt-3" data-bs-ride="carousel">
+                            <div class="carousel-inner">
+                                <div class="carousel-item active">
+                                    <div class="screenshot-box"><a href="#lightbox8"><img src="./assets/screenshots/is_view_1.png"
+                                                                                           class="d-block w-100"/></a></div>
+                                </div>
+                                <div class="carousel-item">
+                                    <div class="screenshot-box"><a href="#lightbox21"><img src="./assets/screenshots/is_view_2.png"
+                                                                                           class="d-block w-100"/></a></div>
+                                </div>
+                            </div>
+                            <button class="carousel-control-prev" type="button" data-bs-target="#carousel-is"
+                                    data-bs-slide="prev"><span class="carousel-control-prev-icon"></span></button>
+                            <button class="carousel-control-next" type="button" data-bs-target="#carousel-is"
+                                    data-bs-slide="next"><span class="carousel-control-next-icon"></span></button>
+                        </div>
+                    </div>
+                </div>
             </div>
-          </button>
-        </h2>
-        <div id="collapseFour" class="accordion-collapse collapse" aria-labelledby="headingFour"
-          data-bs-parent="#accordionExample">
-          <div class="accordion-body" style="padding: 3rem; background: #0480e1; color: white;">
-            Yes! You can generate and download a PDF report containing code violations, field counts, line-of-code
-            summaries, and maintainability scores for selected modules.
-          </div>
         </div>
-      </div>
     </div>
-  </div>
-
-  <!-- Who Is This Module For? -->
-  <div class="container-fluid py-5 mb-5" style="max-width:1526.4px; margin-left:auto; margin-right:auto; padding-left:54px; padding-right:54px;">
-    <h2 class="headmain" style="font-family: sans-serif; background-color: #b9ff66; width: max-content; padding: 5px 10px; margin-bottom: 1rem; border-radius: 8px; font-size: 2.3rem;">Who Is This Module For? </h2>
-    <div class="row row-cols-lg-3 row-cols-1 g-xl-4 g-3 ">
-      <div class="col">
-        <div class="box box2 w-box" style="padding: 3rem; border-radius: 2rem; position: relative; min-height: 300px; border: 1px solid black; box-shadow: 0px 5px #000000; background-color: white !important; color: black !important;">
-          <h3 style="border-bottom: 1px solid black !important; font-size: 1.5rem; padding-bottom: 1rem; margin-bottom: 1rem;">Odoo Developers</h3>
-          <p style="max-width: 350px; font-size: 1.1rem; font-weight: 500;color: black !important;"> Identify code issues early, follow best practices, and deliver cleaner, more maintainable modules.</p>
-        </div>
-      </div>
-      <div class="col">
-        <div class="box box2 w-box" style="padding: 3rem; border-radius: 2rem; position: relative; min-height: 300px; border: 1px solid black; box-shadow: 0px 5px #000000; background-color: white !important; color: black !important;">
-          <h3 style="border-bottom: 1px solid black !important; font-size: 1.5rem; padding-bottom: 1rem; margin-bottom: 1rem;">Code Reviewers</h3>
-          <p style="max-width: 350px; font-size: 1.1rem; font-weight: 500;color: black !important;"> Save time with automated insights into code quality, structure, and violations during reviews</p>
-        </div>
-      </div>
-      <div class="col">
-        <div class="box box2 w-box" style="padding: 3rem; border-radius: 2rem; position: relative; min-height: 300px; border: 1px solid black; box-shadow: 0px 5px #000000; background-color: white !important; color: black !important;">
-          <h3 style="border-bottom: 1px solid black !important; font-size: 1.5rem; padding-bottom: 1rem; margin-bottom: 1rem;">Technical Team Leads</h3>
-          <p style="max-width: 350px; font-size: 1.1rem; font-weight: 500;color: black !important;"> Ensure consistency across the team’s codebase and reduce long-term maintenance overhead</p>
-        </div>
-      </div>
-      <div class="col">
-        <div class="box box2 w-box" style="padding: 3rem; border-radius: 2rem; position: relative; min-height: 300px; border: 1px solid black; box-shadow: 0px 5px #000000; background-color: white !important; color: black !important;">
-          <h3 style="border-bottom: 1px solid black !important; font-size: 1.5rem; padding-bottom: 1rem; margin-bottom: 1rem;">QA and DevOps Teams</h3>
-          <p style="max-width: 350px; font-size: 1.1rem; font-weight: 500;color: black !important;">Validate module quality before deployment, catch risks early, and maintain stable environments.</p>
-        </div>
-      </div>
-      <div class="col">
-        <div class="box box2 w-box" style="padding: 3rem; border-radius: 2rem; position: relative; min-height: 300px; border: 1px solid black; box-shadow: 0px 5px #000000; background-color: white !important; color: black !important;">
-          <h3 style="border-bottom: 1px solid black !important; font-size: 1.5rem; padding-bottom: 1rem; margin-bottom: 1rem;">Clients and End Users</h3>
-          <p style="max-width: 350px; font-size: 1.1rem; font-weight: 500;color: black !important;">Gain confidence that installed modules meet quality standards and follow proper development practices,
-            reducing issues and improving reliability.</p>
-        </div>
-      </div>
     </div>
-  </div>
+</section>
+
+<!-- Lightbox Modals -->
+<div id="lightbox1" class="lightbox"><a href="#" class="lightbox-close">&times;</a><img
+        src="./assets/screenshots/config_settings.png"/></div>
+<div id="lightbox2" class="lightbox"><a href="#" class="lightbox-close">&times;</a><img
+        src="./assets/screenshots/repository_setup.png"/></div>
+<div id="lightbox3" class="lightbox"><a href="#" class="lightbox-close">&times;</a><img
+        src="./assets/screenshots/config_settings_3.png"/></div>
+<div id="lightbox9" class="lightbox"><a href="#" class="lightbox-close">&times;</a><img
+        src="./assets/screenshots/config_settings_1.png"/></div>
+<div id="lightbox10" class="lightbox"><a href="#" class="lightbox-close">&times;</a><img
+        src="./assets/screenshots/config_settings.png"/></div>
+<div id="lightbox4" class="lightbox"><a href="#" class="lightbox-close">&times;</a><img
+        src="./assets/screenshots/repository_setup_1.png"/></div>
+<div id="lightbox11" class="lightbox"><a href="#" class="lightbox-close">&times;</a><img
+        src="./assets/screenshots/repository_setup_2.png"/></div>
+<div id="lightbox12" class="lightbox"><a href="#" class="lightbox-close">&times;</a><img
+        src="./assets/screenshots/repository_setup_3.png"/></div>
+<div id="lightbox13" class="lightbox"><a href="#" class="lightbox-close">&times;</a><img
+        src="./assets/screenshots/repository_setup_4.png"/></div>
+<div id="lightbox5" class="lightbox"><a href="#" class="lightbox-close">&times;</a><img
+        src="./assets/screenshots/branch_management_1.png"/></div>
+<div id="lightbox14" class="lightbox"><a href="#" class="lightbox-close">&times;</a><img
+        src="./assets/screenshots/branch_management_2.png"/></div>
+<div id="lightbox15" class="lightbox"><a href="#" class="lightbox-close">&times;</a><img
+        src="./assets/screenshots/branch_management_3.png"/></div>
+<div id="lightbox16" class="lightbox"><a href="#" class="lightbox-close">&times;</a><img
+        src="./assets/screenshots/branch_management_4.png"/></div>
+<div id="lightbox17" class="lightbox"><a href="#" class="lightbox-close">&times;</a><img
+        src="./assets/screenshots/branch_management_5.png"/></div>
+<div id="lightbox18" class="lightbox"><a href="#" class="lightbox-close">&times;</a><img
+        src="./assets/screenshots/branch_management_6.png"/></div>
+<div id="lightbox6" class="lightbox"><a href="#" class="lightbox-close">&times;</a><img
+        src="./assets/screenshots/commits.png"/></div>
+<div id="lightbox19" class="lightbox"><a href="#" class="lightbox-close">&times;</a><img
+        src="./assets/screenshots/commit_1.png"/></div>
+<div id="lightbox7" class="lightbox"><a href="#" class="lightbox-close">&times;</a><img
+        src="./assets/screenshots/pr_view_1.png"/></div>
+<div id="lightbox20" class="lightbox"><a href="#" class="lightbox-close">&times;</a><img
+        src="./assets/screenshots/pr_view_2.png"/></div>
+<div id="lightbox8" class="lightbox"><a href="#" class="lightbox-close">&times;</a><img
+        src="./assets/screenshots/is_view_1.png"/></div>
+<div id="lightbox21" class="lightbox"><a href="#" class="lightbox-close">&times;</a><img
+        src="./assets/screenshots/is_view_2.png"/></div>
+<div id="lightbox22" class="lightbox"><a href="#" class="lightbox-close">&times;</a><img
+        src="./assets/screenshots/branch_management.png"/></div>
+<div id="lightbox23" class="lightbox"><a href="#" class="lightbox-close">&times;</a><img
+        src="./assets/screenshots/commits.png"/></div>
+
+<!-- Footer -->
+<div class="footer">
+    <p>© 2025 Your Company | GitHub Odoo Integration</p>
+</div>
+
+<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
 </body>
-</html>
\ No newline at end of file
+</html>