fix: footer and hover slider liks added

Reviewed-on: #33

assets/images/hai1/user-icon.svg

@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="iso-8859-1"?>
+<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg height="800px" width="800px" version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" 
+	 viewBox="0 0 60.671 60.671" xml:space="preserve">
+<g>
+	<g>
+		<ellipse style="fill:#010002;" cx="30.336" cy="12.097" rx="11.997" ry="12.097"/>
+		<path style="fill:#010002;" d="M35.64,30.079H25.031c-7.021,0-12.714,5.739-12.714,12.821v17.771h36.037V42.9
+			C48.354,35.818,42.661,30.079,35.64,30.079z"/>
+	</g>
+</g>
+</svg>

assets/images/mit-ico/serviceplaingrp.svg

@@ -0,0 +1,411 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:v="https://svgstorm.com" viewBox="0 0 194 187" width="194" height="187">
+<g fill="None" fill-opacity="0.0" stroke="#000000" stroke-opacity="1.00" stroke-width="0.3"><path d="
+M 0.00 187.00 
+L 194.00 187.00
+L 194.00 0.00
+L 0.00 0.00
+L 0.00 187.00
+M 119.00 10.00 
+C 119.08 11.32 119.00 12.68 119.00 14.00
+C 119.00 15.33 119.00 16.67 119.00 18.00
+C 119.00 19.33 119.00 20.67 119.00 22.00
+C 119.00 23.33 119.00 24.67 119.00 26.00
+C 119.00 28.00 119.00 30.00 119.00 32.00
+C 119.00 33.33 119.00 34.67 119.00 36.00
+C 119.00 38.67 119.00 41.33 119.00 44.00
+C 119.00 46.00 119.00 48.00 119.00 50.00
+C 119.00 50.50 119.00 51.00 119.00 51.00
+C 119.00 65.67 119.00 80.33 119.00 95.00
+C 134.00 95.00 149.00 95.00 164.00 95.00
+C 164.00 111.67 164.00 128.33 164.00 145.00
+C 164.00 151.00 164.00 157.00 164.00 163.00
+C 164.00 165.67 164.00 168.33 164.00 171.00
+C 164.00 175.33 164.00 179.67 164.00 184.00
+C 149.00 184.00 134.00 184.00 119.00 184.00
+C 119.00 181.67 119.00 179.33 119.00 177.00
+C 118.97 175.00 119.00 173.00 119.00 171.00
+C 119.00 168.33 119.00 165.67 119.00 163.00
+C 119.00 160.33 119.00 157.67 119.00 155.00
+C 119.00 153.67 119.00 152.33 119.00 151.00
+C 119.00 149.00 119.00 147.00 119.00 145.00
+C 119.00 143.33 119.00 141.67 119.00 140.00
+C 104.12 141.35 88.91 138.99 74.00 140.00
+C 74.00 125.00 74.00 110.00 74.00 95.00
+C 59.33 95.00 44.67 95.00 30.00 95.00
+C 30.00 80.33 30.00 65.67 30.00 51.00
+C 32.72 47.11 45.60 50.63 51.00 50.00 C 56.40 49.37 68.13 49.47 74.00 50.00
+C 74.00 44.67 74.00 39.33 74.00 34.00
+C 74.00 30.00 74.00 26.00 74.00 22.00
+C 74.00 18.70 73.75 15.29 74.00 12.00
+C 74.75 2.23 84.89 6.70 93.00 6.00 C 101.11 5.30 110.75 6.53 119.00 6.00
+C 119.00 7.33 119.00 8.67 119.00 10.00 Z" data-index="0"></path>
+</g>
+<g fill="None" fill-opacity="0.0" stroke="#282826" stroke-opacity="1.00" stroke-width="0.3"><path d="
+M 74.00 12.00 
+C 76.68 6.65 89.03 11.23 95.00 10.00 C 100.97 8.77 112.52 10.92 119.00 10.00
+C 119.00 8.67 119.00 7.33 119.00 6.00
+C 110.75 6.53 101.11 5.30 93.00 6.00 C 84.89 6.70 74.75 2.23 74.00 12.00 Z" data-index="1"></path>
+</g>
+<g fill="None" fill-opacity="0.0" stroke="#3D3D3B" stroke-opacity="1.00" stroke-width="0.3"><path d="
+M 74.00 12.00 
+C 73.75 15.29 74.00 18.70 74.00 22.00
+C 74.13 21.24 74.77 19.21 75.00 18.00
+C 75.25 16.71 74.81 15.30 75.00 14.00
+C 89.67 14.00 104.33 14.00 119.00 14.00
+C 119.00 12.68 119.08 11.32 119.00 10.00
+C 112.52 10.92 100.97 8.77 95.00 10.00 C 89.03 11.23 76.68 6.65 74.00 12.00 Z" data-index="2"></path>
+</g>
+<g fill="None" fill-opacity="0.0" stroke="#51514F" stroke-opacity="1.00" stroke-width="0.3"><path d="
+M 75.00 18.00 
+C 89.67 18.00 104.33 18.00 119.00 18.00
+C 119.00 16.67 119.00 15.33 119.00 14.00
+C 104.33 14.00 89.67 14.00 75.00 14.00
+C 74.81 15.30 75.25 16.71 75.00 18.00 Z" data-index="3"></path>
+</g>
+<g fill="None" fill-opacity="0.0" stroke="#656564" stroke-opacity="1.00" stroke-width="0.3"><path d="
+M 74.00 22.00 
+C 74.00 26.00 74.00 30.00 74.00 34.00
+C 74.00 33.96 75.00 34.00 75.00 34.00
+C 75.23 33.84 75.00 32.50 75.00 32.00
+C 75.00 30.08 74.70 27.89 75.00 26.00
+C 75.21 24.70 74.84 23.31 75.00 22.00
+C 89.67 22.00 104.33 22.00 119.00 22.00
+C 119.00 20.67 119.00 19.33 119.00 18.00
+C 104.33 18.00 89.67 18.00 75.00 18.00
+C 74.77 19.21 74.13 21.24 74.00 22.00 Z" data-index="4"></path>
+</g>
+<g fill="None" fill-opacity="0.0" stroke="#7A7A78" stroke-opacity="1.00" stroke-width="0.3"><path d="
+M 75.00 26.00 
+C 89.67 26.00 104.33 26.00 119.00 26.00
+C 119.00 24.67 119.00 23.33 119.00 22.00
+C 104.33 22.00 89.67 22.00 75.00 22.00
+C 74.84 23.31 75.21 24.70 75.00 26.00 Z" data-index="5"></path>
+</g>
+<g fill="None" fill-opacity="0.0" stroke="#939392" stroke-opacity="1.00" stroke-width="0.3"><path d="
+M 75.00 32.00 
+C 81.13 29.28 90.30 33.42 97.00 32.00 C 103.70 30.58 112.14 33.06 119.00 32.00
+C 119.00 30.00 119.00 28.00 119.00 26.00
+C 104.33 26.00 89.67 26.00 75.00 26.00
+C 74.70 27.89 75.00 30.08 75.00 32.00 Z" data-index="6"></path>
+</g>
+<g fill="None" fill-opacity="0.0" stroke="#ADADAC" stroke-opacity="1.00" stroke-width="0.3"><path d="
+M 75.00 34.00 
+C 76.31 38.91 90.57 34.95 96.00 36.00 C 101.43 37.05 113.01 35.21 119.00 36.00
+C 119.00 34.67 119.00 33.33 119.00 32.00
+C 112.14 33.06 103.70 30.58 97.00 32.00 C 90.30 33.42 81.13 29.28 75.00 32.00
+C 75.00 32.50 75.23 33.84 75.00 34.00 Z" data-index="7"></path>
+</g>
+<g fill="None" fill-opacity="0.0" stroke="#C8C8C8" stroke-opacity="1.00" stroke-width="0.3"><path d="
+M 74.00 50.00 
+C 74.00 50.50 74.00 51.00 74.00 51.00
+C 74.00 65.46 72.70 80.60 74.00 95.00
+C 74.00 94.96 75.00 95.00 75.00 95.00
+C 76.32 80.45 74.01 65.58 75.00 51.00
+C 89.67 51.00 104.33 51.00 119.00 51.00
+C 119.00 51.00 119.00 50.50 119.00 50.00
+C 104.45 48.68 89.58 50.99 75.00 50.00
+C 73.70 39.95 86.70 44.86 94.00 44.00 C 101.30 43.14 111.44 44.65 119.00 44.00
+C 119.00 41.33 119.00 38.67 119.00 36.00
+C 113.01 35.21 101.43 37.05 96.00 36.00 C 90.57 34.95 76.31 38.91 75.00 34.00
+C 75.00 34.00 74.00 33.96 74.00 34.00
+C 74.00 39.33 74.00 44.67 74.00 50.00 Z" data-index="8"></path>
+</g>
+<g fill="None" fill-opacity="0.0" stroke="#EFEFEF" stroke-opacity="1.00" stroke-width="0.3"><path d="
+M 119.00 50.00 
+C 119.00 48.00 119.00 46.00 119.00 44.00
+C 111.44 44.65 101.30 43.14 94.00 44.00 C 86.70 44.86 73.70 39.95 75.00 50.00
+C 89.58 50.99 104.45 48.68 119.00 50.00 Z" data-index="9"></path>
+</g>
+<g fill="None" fill-opacity="0.0" stroke="#585858" stroke-opacity="1.00" stroke-width="0.3"><path d="
+M 30.00 51.00 
+C 44.58 50.01 59.45 52.32 74.00 51.00
+C 74.00 51.00 74.00 50.50 74.00 50.00
+C 68.13 49.47 56.40 49.37 51.00 50.00 C 45.60 50.63 32.72 47.11 30.00 51.00 Z" data-index="10"></path>
+</g>
+<g fill="None" fill-opacity="0.0" stroke="#868686" stroke-opacity="1.00" stroke-width="0.3"><path d="
+M 74.00 95.00 
+C 72.70 80.60 74.00 65.46 74.00 51.00
+C 59.45 52.32 44.58 50.01 30.00 51.00
+C 30.00 65.67 30.00 80.33 30.00 95.00
+C 44.67 95.00 59.33 95.00 74.00 95.00 Z" data-index="11"></path>
+</g>
+<g fill="None" fill-opacity="0.0" stroke="#FFFFFF" stroke-opacity="1.00" stroke-width="0.3"><path d="
+M 75.00 95.00 
+C 89.67 95.00 104.33 95.00 119.00 95.00
+C 119.00 80.33 119.00 65.67 119.00 51.00
+C 104.33 51.00 89.67 51.00 75.00 51.00
+C 74.01 65.58 76.32 80.45 75.00 95.00 Z" data-index="12"></path>
+</g>
+<g fill="None" fill-opacity="0.0" stroke="#AB1115" stroke-opacity="1.00" stroke-width="0.3"><path d="
+M 119.00 140.00 
+C 119.00 139.50 119.00 139.00 119.00 139.00
+C 104.45 137.68 89.58 139.99 75.00 139.00
+C 75.00 124.33 75.00 109.67 75.00 95.00
+C 75.00 95.00 74.00 94.96 74.00 95.00
+C 74.00 110.00 74.00 125.00 74.00 140.00
+C 88.91 138.99 104.12 141.35 119.00 140.00 Z" data-index="13"></path>
+</g>
+<g fill="None" fill-opacity="0.0" stroke="#EF191E" stroke-opacity="1.00" stroke-width="0.3"><path d="
+M 119.00 139.00 
+C 119.00 124.33 119.00 109.67 119.00 95.00
+C 104.33 95.00 89.67 95.00 75.00 95.00
+C 75.00 109.67 75.00 124.33 75.00 139.00
+C 89.58 139.99 104.45 137.68 119.00 139.00 Z" data-index="14"></path>
+</g>
+<g fill="None" fill-opacity="0.0" stroke="#AEAEAE" stroke-opacity="1.00" stroke-width="0.3"><path d="
+M 119.00 139.00 
+C 119.00 139.00 119.00 139.50 119.00 140.00
+C 119.00 141.67 119.00 143.33 119.00 145.00
+C 133.67 145.00 148.33 145.00 163.00 145.00
+C 163.50 145.00 164.00 145.00 164.00 145.00
+C 164.00 128.33 164.00 111.67 164.00 95.00
+C 149.00 95.00 134.00 95.00 119.00 95.00
+C 119.00 109.67 119.00 124.33 119.00 139.00 Z" data-index="15"></path>
+</g>
+<g fill="None" fill-opacity="0.0" stroke="#909090" stroke-opacity="1.00" stroke-width="0.3"><path d="
+M 119.00 151.00 
+C 133.67 151.00 148.33 151.00 163.00 151.00
+C 163.00 149.14 162.62 146.82 163.00 145.00
+C 148.33 145.00 133.67 145.00 119.00 145.00
+C 119.00 147.00 119.00 149.00 119.00 151.00 Z" data-index="16"></path>
+</g>
+<g fill="None" fill-opacity="0.0" stroke="#4D4D4C" stroke-opacity="1.00" stroke-width="0.3"><path d="
+M 163.00 151.00 
+C 163.00 152.33 163.00 153.67 163.00 155.00
+C 163.00 157.67 163.00 160.33 163.00 163.00
+C 148.33 163.00 133.67 163.00 119.00 163.00
+C 119.00 165.67 119.00 168.33 119.00 171.00
+C 133.67 171.00 148.33 171.00 163.00 171.00
+C 163.56 168.48 161.81 164.70 164.00 163.00
+C 164.00 157.00 164.00 151.00 164.00 145.00
+C 164.00 145.00 163.50 145.00 163.00 145.00
+C 162.62 146.82 163.00 149.14 163.00 151.00 Z" data-index="17"></path>
+</g>
+<g fill="None" fill-opacity="0.0" stroke="#7E7E7E" stroke-opacity="1.00" stroke-width="0.3"><path d="
+M 119.00 155.00 
+C 133.67 155.00 148.33 155.00 163.00 155.00
+C 163.00 153.67 163.00 152.33 163.00 151.00
+C 148.33 151.00 133.67 151.00 119.00 151.00
+C 119.00 152.33 119.00 153.67 119.00 155.00 Z" data-index="18"></path>
+</g>
+<g fill="None" fill-opacity="0.0" stroke="#696968" stroke-opacity="1.00" stroke-width="0.3"><path d="
+M 119.00 163.00 
+C 133.67 163.00 148.33 163.00 163.00 163.00
+C 163.00 160.33 163.00 157.67 163.00 155.00
+C 148.33 155.00 133.67 155.00 119.00 155.00
+C 119.00 157.67 119.00 160.33 119.00 163.00 Z" data-index="19"></path>
+</g>
+<g fill="None" fill-opacity="0.0" stroke="#373735" stroke-opacity="1.00" stroke-width="0.3"><path d="
+M 119.00 171.00 
+C 119.00 173.00 118.97 175.00 119.00 177.00
+C 133.67 177.00 148.33 177.00 163.00 177.00
+C 163.47 175.12 161.94 172.07 164.00 171.00
+C 164.00 168.33 164.00 165.67 164.00 163.00
+C 161.81 164.70 163.56 168.48 163.00 171.00
+C 148.33 171.00 133.67 171.00 119.00 171.00 Z" data-index="20"></path>
+</g>
+<g fill="None" fill-opacity="0.0" stroke="#252523" stroke-opacity="1.00" stroke-width="0.3"><path d="
+M 119.00 177.00 
+C 119.00 179.33 119.00 181.67 119.00 184.00
+C 134.00 184.00 149.00 184.00 164.00 184.00
+C 164.00 179.67 164.00 175.33 164.00 171.00
+C 161.94 172.07 163.47 175.12 163.00 177.00
+C 148.33 177.00 133.67 177.00 119.00 177.00 Z" data-index="21"></path>
+</g>
+<g fill="#000000" fill-opacity="1.00" stroke="None">
+
+</g>
+<g fill="#282826" fill-opacity="1.00" stroke="None">
+<path d="
+M 74.00 12.00 
+C 76.68 6.65 89.03 11.23 95.00 10.00 C 100.97 8.77 112.52 10.92 119.00 10.00
+C 119.00 8.67 119.00 7.33 119.00 6.00
+C 110.75 6.53 101.11 5.30 93.00 6.00 C 84.89 6.70 74.75 2.23 74.00 12.00 Z" data-index="23"></path>
+</g>
+<g fill="#3D3D3B" fill-opacity="1.00" stroke="None">
+<path d="
+M 74.00 12.00 
+C 73.75 15.29 74.00 18.70 74.00 22.00
+C 74.13 21.24 74.77 19.21 75.00 18.00
+C 75.25 16.71 74.81 15.30 75.00 14.00
+C 89.67 14.00 104.33 14.00 119.00 14.00
+C 119.00 12.68 119.08 11.32 119.00 10.00
+C 112.52 10.92 100.97 8.77 95.00 10.00 C 89.03 11.23 76.68 6.65 74.00 12.00 Z" data-index="24"></path>
+</g>
+<g fill="#51514F" fill-opacity="1.00" stroke="None">
+<path d="
+M 75.00 18.00 
+C 89.67 18.00 104.33 18.00 119.00 18.00
+C 119.00 16.67 119.00 15.33 119.00 14.00
+C 104.33 14.00 89.67 14.00 75.00 14.00
+C 74.81 15.30 75.25 16.71 75.00 18.00 Z" data-index="25"></path>
+</g>
+<g fill="#656564" fill-opacity="1.00" stroke="None">
+<path d="
+M 74.00 22.00 
+C 74.00 26.00 74.00 30.00 74.00 34.00
+C 74.00 33.96 75.00 34.00 75.00 34.00
+C 75.23 33.84 75.00 32.50 75.00 32.00
+C 75.00 30.08 74.70 27.89 75.00 26.00
+C 75.21 24.70 74.84 23.31 75.00 22.00
+C 89.67 22.00 104.33 22.00 119.00 22.00
+C 119.00 20.67 119.00 19.33 119.00 18.00
+C 104.33 18.00 89.67 18.00 75.00 18.00
+C 74.77 19.21 74.13 21.24 74.00 22.00 Z" data-index="26"></path>
+</g>
+<g fill="#7A7A78" fill-opacity="1.00" stroke="None">
+<path d="
+M 75.00 26.00 
+C 89.67 26.00 104.33 26.00 119.00 26.00
+C 119.00 24.67 119.00 23.33 119.00 22.00
+C 104.33 22.00 89.67 22.00 75.00 22.00
+C 74.84 23.31 75.21 24.70 75.00 26.00 Z" data-index="27"></path>
+</g>
+<g fill="#939392" fill-opacity="1.00" stroke="None">
+<path d="
+M 75.00 32.00 
+C 81.13 29.28 90.30 33.42 97.00 32.00 C 103.70 30.58 112.14 33.06 119.00 32.00
+C 119.00 30.00 119.00 28.00 119.00 26.00
+C 104.33 26.00 89.67 26.00 75.00 26.00
+C 74.70 27.89 75.00 30.08 75.00 32.00 Z" data-index="28"></path>
+</g>
+<g fill="#ADADAC" fill-opacity="1.00" stroke="None">
+<path d="
+M 75.00 34.00 
+C 76.31 38.91 90.57 34.95 96.00 36.00 C 101.43 37.05 113.01 35.21 119.00 36.00
+C 119.00 34.67 119.00 33.33 119.00 32.00
+C 112.14 33.06 103.70 30.58 97.00 32.00 C 90.30 33.42 81.13 29.28 75.00 32.00
+C 75.00 32.50 75.23 33.84 75.00 34.00 Z" data-index="29"></path>
+</g>
+<g fill="#C8C8C8" fill-opacity="1.00" stroke="None">
+<path d="
+M 74.00 50.00 
+C 74.00 50.50 74.00 51.00 74.00 51.00
+C 74.00 65.46 72.70 80.60 74.00 95.00
+C 74.00 94.96 75.00 95.00 75.00 95.00
+C 76.32 80.45 74.01 65.58 75.00 51.00
+C 89.67 51.00 104.33 51.00 119.00 51.00
+C 119.00 51.00 119.00 50.50 119.00 50.00
+C 104.45 48.68 89.58 50.99 75.00 50.00
+C 73.70 39.95 86.70 44.86 94.00 44.00 C 101.30 43.14 111.44 44.65 119.00 44.00
+C 119.00 41.33 119.00 38.67 119.00 36.00
+C 113.01 35.21 101.43 37.05 96.00 36.00 C 90.57 34.95 76.31 38.91 75.00 34.00
+C 75.00 34.00 74.00 33.96 74.00 34.00
+C 74.00 39.33 74.00 44.67 74.00 50.00 Z" data-index="30"></path>
+</g>
+<g fill="#EFEFEF" fill-opacity="1.00" stroke="None">
+<path d="
+M 119.00 50.00 
+C 119.00 48.00 119.00 46.00 119.00 44.00
+C 111.44 44.65 101.30 43.14 94.00 44.00 C 86.70 44.86 73.70 39.95 75.00 50.00
+C 89.58 50.99 104.45 48.68 119.00 50.00 Z" data-index="31"></path>
+</g>
+<g fill="#585858" fill-opacity="1.00" stroke="None">
+<path d="
+M 30.00 51.00 
+C 44.58 50.01 59.45 52.32 74.00 51.00
+C 74.00 51.00 74.00 50.50 74.00 50.00
+C 68.13 49.47 56.40 49.37 51.00 50.00 C 45.60 50.63 32.72 47.11 30.00 51.00 Z" data-index="32"></path>
+</g>
+<g fill="#868686" fill-opacity="1.00" stroke="None">
+<path d="
+M 74.00 95.00 
+C 72.70 80.60 74.00 65.46 74.00 51.00
+C 59.45 52.32 44.58 50.01 30.00 51.00
+C 30.00 65.67 30.00 80.33 30.00 95.00
+C 44.67 95.00 59.33 95.00 74.00 95.00 Z" data-index="33"></path>
+</g>
+<g fill="#FFFFFF" fill-opacity="1.00" stroke="None">
+<path d="
+M 75.00 95.00 
+C 89.67 95.00 104.33 95.00 119.00 95.00
+C 119.00 80.33 119.00 65.67 119.00 51.00
+C 104.33 51.00 89.67 51.00 75.00 51.00
+C 74.01 65.58 76.32 80.45 75.00 95.00 Z" data-index="34"></path>
+</g>
+<g fill="#AB1115" fill-opacity="1.00" stroke="None">
+<path d="
+M 119.00 140.00 
+C 119.00 139.50 119.00 139.00 119.00 139.00
+C 104.45 137.68 89.58 139.99 75.00 139.00
+C 75.00 124.33 75.00 109.67 75.00 95.00
+C 75.00 95.00 74.00 94.96 74.00 95.00
+C 74.00 110.00 74.00 125.00 74.00 140.00
+C 88.91 138.99 104.12 141.35 119.00 140.00 Z" data-index="35" style="opacity: 1;"></path>
+</g>
+<g fill="#EF191E" fill-opacity="1.00" stroke="None">
+<path d="
+M 119.00 139.00 
+C 119.00 124.33 119.00 109.67 119.00 95.00
+C 104.33 95.00 89.67 95.00 75.00 95.00
+C 75.00 109.67 75.00 124.33 75.00 139.00
+C 89.58 139.99 104.45 137.68 119.00 139.00 Z" data-index="36" style="opacity: 1;"></path>
+</g>
+<g fill="#AEAEAE" fill-opacity="1.00" stroke="None">
+<path d="
+M 119.00 139.00 
+C 119.00 139.00 119.00 139.50 119.00 140.00
+C 119.00 141.67 119.00 143.33 119.00 145.00
+C 133.67 145.00 148.33 145.00 163.00 145.00
+C 163.50 145.00 164.00 145.00 164.00 145.00
+C 164.00 128.33 164.00 111.67 164.00 95.00
+C 149.00 95.00 134.00 95.00 119.00 95.00
+C 119.00 109.67 119.00 124.33 119.00 139.00 Z" data-index="37" style="opacity: 1;"></path>
+</g>
+<g fill="#909090" fill-opacity="1.00" stroke="None">
+<path d="
+M 119.00 151.00 
+C 133.67 151.00 148.33 151.00 163.00 151.00
+C 163.00 149.14 162.62 146.82 163.00 145.00
+C 148.33 145.00 133.67 145.00 119.00 145.00
+C 119.00 147.00 119.00 149.00 119.00 151.00 Z" data-index="38" style="opacity: 1;"></path>
+</g>
+<g fill="#4D4D4C" fill-opacity="1.00" stroke="None">
+<path d="
+M 163.00 151.00 
+C 163.00 152.33 163.00 153.67 163.00 155.00
+C 163.00 157.67 163.00 160.33 163.00 163.00
+C 148.33 163.00 133.67 163.00 119.00 163.00
+C 119.00 165.67 119.00 168.33 119.00 171.00
+C 133.67 171.00 148.33 171.00 163.00 171.00
+C 163.56 168.48 161.81 164.70 164.00 163.00
+C 164.00 157.00 164.00 151.00 164.00 145.00
+C 164.00 145.00 163.50 145.00 163.00 145.00
+C 162.62 146.82 163.00 149.14 163.00 151.00 Z" data-index="39" style="opacity: 1;"></path>
+</g>
+<g fill="#7E7E7E" fill-opacity="1.00" stroke="None">
+<path d="
+M 119.00 155.00 
+C 133.67 155.00 148.33 155.00 163.00 155.00
+C 163.00 153.67 163.00 152.33 163.00 151.00
+C 148.33 151.00 133.67 151.00 119.00 151.00
+C 119.00 152.33 119.00 153.67 119.00 155.00 Z" data-index="40" style="opacity: 1;"></path>
+</g>
+<g fill="#696968" fill-opacity="1.00" stroke="None">
+<path d="
+M 119.00 163.00 
+C 133.67 163.00 148.33 163.00 163.00 163.00
+C 163.00 160.33 163.00 157.67 163.00 155.00
+C 148.33 155.00 133.67 155.00 119.00 155.00
+C 119.00 157.67 119.00 160.33 119.00 163.00 Z" data-index="41" style="opacity: 1;"></path>
+</g>
+<g fill="#373735" fill-opacity="1.00" stroke="None">
+<path d="
+M 119.00 171.00 
+C 119.00 173.00 118.97 175.00 119.00 177.00
+C 133.67 177.00 148.33 177.00 163.00 177.00
+C 163.47 175.12 161.94 172.07 164.00 171.00
+C 164.00 168.33 164.00 165.67 164.00 163.00
+C 161.81 164.70 163.56 168.48 163.00 171.00
+C 148.33 171.00 133.67 171.00 119.00 171.00 Z" data-index="42" style="opacity: 1;"></path>
+</g>
+<g fill="#252523" fill-opacity="1.00" stroke="None">
+<path d="
+M 119.00 177.00 
+C 119.00 179.33 119.00 181.67 119.00 184.00
+C 134.00 184.00 149.00 184.00 164.00 184.00
+C 164.00 179.67 164.00 175.33 164.00 171.00
+C 161.94 172.07 163.47 175.12 163.00 177.00
+C 148.33 177.00 133.67 177.00 119.00 177.00 Z" data-index="43" style="opacity: 1;"></path>
+</g>
+</svg>

dynamic-banner.html

@@ -1,202 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-<meta charset="UTF-8">
-<meta name="viewport" content="width=device-width, initial-scale=1.0">
-<title>Right-side Image Expanding Cards</title>
-<style>
-* {
-  margin: 0;
-  padding: 0;
-  box-sizing: border-box;
-  font-family: "Segoe UI", sans-serif;
-}
-
-body {
-  background: #f9f9f9;
-  color: #1a1a1a;
-  padding: 40px;
-}
-
-h1 {
-  font-size: 26px;
-  font-weight: 600;
-  margin-bottom: 10px;
-}
-
-p.subtext {
-  color: #555;
-  margin-bottom: 25px;
-}
-
-/* Flex container */
-.cards-container {
-  display: flex;
-  gap: 15px;
-  height: 220px;
-}
-
-/* Card style */
-.card {
-  flex: 1;
-  display: flex;
-  border-radius: 14px;
-  overflow: hidden;
-  transition: all 0.4s ease;
-  position: relative;
-  cursor: pointer;
-  color: #fff;
-}
-
-/* Different background colors */
-.card:nth-child(1) { background: #1d4ed8; }
-.card:nth-child(2) { background: #e11d48; }
-.card:nth-child(3) { background: #9333ea; }
-.card:nth-child(4) { background: #f59e0b; }
-
-/* Card content */
-.card-content {
-  flex: 1;
-  padding: 16px 20px;
-  display: flex;
-  flex-direction: column;
-  justify-content: space-between;
-  transition: all 0.4s ease;
-  min-width: 0; /* For text ellipsis */
-}
-
-/* Hide image initially */
-.card img {
-  width: 0;
-  height: 100%;
-  object-fit: cover;
-  transition: all 0.4s ease;
-  border-left: 0px solid #fff;
-}
-
-/* Icon style */
-.icon {
-  width: 40px;
-  height: 40px;
-  border-radius: 50%;
-  background: rgba(255,255,255,0.3);
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  font-size: 20px;
-  margin-bottom: 10px;
-}
-
-.card h3 {
-  font-size: 18px;
-  margin-bottom: 6px;
-}
-
-.card p {
-  font-size: 14px;
-}
-
-.cta-btn {
-  margin-top: 10px;
-  background: rgba(255,255,255,0.3);
-  color: #fff;
-  padding: 6px 12px;
-  border-radius: 8px;
-  font-size: 13px;
-  font-weight: 500;
-  text-decoration: none;
-  width: fit-content;
-  white-space: nowrap;
-}
-
-.footer-text {
-  font-size: 13px;
-  font-weight: 500;
-}
-
-/* Hover effects */
-.cards-container:hover .card {
-  flex: 1;
-}
-
-.cards-container .card:hover {
-  flex: 2.5;
-}
-
-.cards-container .card:hover img {
-  width: 50%; /* show image on right */
-}
-
-/* Responsive */
-@media (max-width: 992px) {
-  .cards-container {
-    flex-direction: column;
-    height: auto;
-  }
-  .card {
-    flex: none;
-    width: 100%;
-    flex-direction: column;
-  }
-  .cards-container .card:hover img {
-    width: 100%;
-    height: 180px;
-    margin-top: 10px;
-  }
-}
-</style>
-</head>
-<body>
-<h1>Practice Coding & Ace Hiring Assessments</h1>
-<p class="subtext">Level up your coding skills by practicing the hiring assessments of your dream companies & ace your placement game!</p>
-
-<div class="cards-container">
-  <!-- Card 1 -->
-  <div class="card">
-    <div class="card-content">
-      <div>
-        <div class="icon">💻</div>
-        <h3>Coding Practice</h3>
-        <p>Level up your coding skills by practicing the hiring Questions.</p>
-        <p><strong>400+ Questions</strong></p>
-      </div>
-      <a href="#" class="cta-btn">Start Now →</a>
-    </div>
-    <img src="https://images.pexels.com/photos/3762800/pexels-photo-3762800.jpeg?auto=compress&cs=tinysrgb&w=600&h=400" loading="lazy" alt="Coding Practice">
-  </div>
-
-  <!-- Card 2 -->
-  <div class="card">
-    <div class="card-content">
-      <div class="icon">📋</div>
-      <h3>Interview Preparation</h3>
-      <p>Crack top companies in just 5 days.</p>
-      <p class="footer-text">20+ Companies →</p>
-    </div>
-    <img src="https://images.pexels.com/photos/1438084/pexels-photo-1438084.jpeg?auto=compress&cs=tinysrgb&w=600&h=400" loading="lazy" alt="Interview Prep">
-  </div>
-
-  <!-- Card 3 -->
-  <div class="card">
-    <div class="card-content">
-      <div class="icon">📂</div>
-      <h3>Projects</h3>
-      <p>Projects epitomize perfect synergy for success.</p>
-      <p class="footer-text">15+ Projects →</p>
-    </div>
-    <img src="https://images.pexels.com/photos/267569/pexels-photo-267569.jpeg?auto=compress&cs=tinysrgb&w=600&h=400" loading="lazy" alt="Projects">
-  </div>
-
-  <!-- Card 4 -->
-  <div class="card">
-    <div class="card-content">
-      <div class="icon">📝</div>
-      <h3>Skill Based Assessments</h3>
-      <p>Assess your skills and get ahead of the curve.</p>
-      <p class="footer-text">2000+ Questions →</p>
-    </div>
-    <img src="https://images.pexels.com/photos/3769021/pexels-photo-3769021.jpeg?auto=compress&cs=tinysrgb&w=600&h=400" loading="lazy" alt="Assessments">
-  </div>
-</div>
-</body>
-</html>

index.html

@@ -4,9 +4,10 @@
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Kodepilot Clone</title>
+    <title>KodePilot</title>
     <link rel="stylesheet" href="main.css">
     <link rel="stylesheet" href="templateapi/main.css">
+    <link rel="icon" type="image/x-icon" href="templateapi/assets/images/logo/favicon.ico">
     <link rel="icon" type="image/x-icon" href="assets/images/logo/favicon.ico">
     <style>
         .center-container {
@@ -41,13 +42,10 @@
         .cube-faces {
             transform-style: preserve-3d;
             height: 80px;
-            /* $size */
             width: 80px;
-            /* $size */
             position: relative;
             transform-origin: 0 0;
             transform: translateX(0) translateY(0) translateZ(-40px);
-            /* -$size/2 */
         }
 
         .cube-face {
@@ -162,14 +160,12 @@
     </div>
     <div id="body" style="display: none;">
         <header class="navbar">
-            <div class="logo">Kodepilot</div>
+            <div class="logo">KodePilot</div>
             <input type="text" class="search" placeholder="Search Opportunities">
-            <nav>
-                <a href="/login">Log in</a>
-            </nav>
             <div class="buttons">
-                <button class="business" onclick="getInTouch()">Get in touch</button>
-                <button class="login" onclick="goToApplay()">Apply</button>
+                <a href="/login">Log in</a>
+                <button class="business" onclick="getInTouch()">Let's Talk</button>
+                <button class="login" onclick="goToApplay()">Request a call</button>
             </div>
         </header>
 
@@ -181,11 +177,14 @@
                         by
                         your
                         dream company.</p>
-                    <button class="button_blue_box"><img
-                            src="https://d8it4huxumps7.cloudfront.net/uploads/images/655edc8c1fab9_diamond_1.png?d=82x84"
-                            width="41" height="42" alt="diamond" loading="lazy"><span><span
-                                class="nameContainer">Aditya</span><strong> Just Went
-                                Kodepilot!</strong></span></button>
+                    <button class="button_blue_box">
+                        <img src="https://d8it4huxumps7.cloudfront.net/uploads/images/655edc8c1fab9_diamond_1.png?d=82x84"
+                            width="41" height="42" alt="diamond" loading="lazy">
+                        <span>
+                            <span class="nameContainer">Aditya</span>
+                            <strong class="descContainer"> Just Went Kodepilot!</strong>
+                        </span>
+                    </button>
                 </div>
                 <div class="cards">
                     <div class="card green">Internships<br><small>Gain Practical Experience</small></div>
@@ -200,7 +199,7 @@
 
         <section class="users">
             <div class="users_box">
-                <h2>Who's using Kodepilot?</h2>
+                <h2>Who's using KodePilot?</h2>
                 <div class="know-cards">
                     <div>
                         <div class="crd">
@@ -257,6 +256,12 @@
                             <img src="https://repo.dhanu.cloud/ico/jbl.svg" alt="jbl">
                             <img src="https://repo.dhanu.cloud/ico/ust.svg" alt="ust">
                             <img src="https://repo.dhanu.cloud/ico/accenture.svg" alt="accenture">
+                            <img class="image-hcl" src="https://repo.dhanu.cloud/ico/hcl.svg" alt="hcl">
+                            <img src="https://repo.dhanu.cloud/ico/ebmpapst.svg" alt="ebmpapst">
+                            <img src="https://repo.dhanu.cloud/ico/infosys.svg" alt="infosys">
+                            <img src="https://repo.dhanu.cloud/ico/jbl.svg" alt="jbl">
+                            <img src="https://repo.dhanu.cloud/ico/ust.svg" alt="ust">
+                            <img src="https://repo.dhanu.cloud/ico/accenture.svg" alt="accenture">
                         </div>
                     </div>
                 </div>
@@ -267,45 +272,46 @@
             <div class="slide1r-container">
                 <div class="slide1r-wrapper">
                     <div class="slide1r-track" id="slide1rTrack">
-                        <!-- Slide 1 -->
+
                         <div class="slide1">
                             <div class="slide1-box">
                                 <div class="image-container">
-                                    <img src="assets/images/hai1/qa.jpg"
-                                        alt="Business Meeting">
+                                    <img src="templateapi/assets/images/hai1/qa.jpg" alt="Business Meeting">
                                     <div class="image-overlay">
                                         <h4>QA & Testing</h4>
-                                        <p>A close-up of a developer's screen showing a green 'Tests Passed' status and a successful performance report graph.</p>
+                                        <p>A close-up of a developer's screen showing a green 'Tests Passed' status and
+                                            a successful performance report graph.</p>
                                     </div>
                                 </div>
                                 <div class="image-container">
-                                    <img src="assets/images/hai1/hai12.jpg"
-                                        alt="Architecture">
+                                    <img src="templateapi/assets/images/hai1/hai12.jpg" alt="Architecture">
                                     <div class="image-overlay">
                                         <h4>Software Dev</h4>
-                                        <p>A sleek image of a professional wireframe/design on a large monitor, with a split view showing the finished product on a mobile phone.</p>
+                                        <p>A sleek image of a professional wireframe/design on a large monitor, with a
+                                            split view showing the finished product on a mobile phone.</p>
                                     </div>
                                 </div>
                             </div>
                         </div>
 
-                        <!-- Slide 2 -->
+
                         <div class="slide1">
                             <div class="slide1-box">
                                 <div class="image-container">
-                                    <img src="assets/images/hai1/ai.jpg"
-                                        alt="Analytics">
+                                    <img src="templateapi/assets/images/hai1/ai.jpg" alt="Analytics">
                                     <div class="image-overlay">
                                         <h4>AI & Data</h4>
-                                        <p>A stunning, large-scale data visualization or chart (like a complex network graph) displayed on a screen, hinting at discovery and high-level strategy.</p>
+                                        <p>A stunning, large-scale data visualization or chart (like a complex network
+                                            graph) displayed on a screen, hinting at discovery and high-level strategy.
+                                        </p>
                                     </div>
                                 </div>
                                 <div class="image-container">
-                                    <img src="assets/images/hai1/cyber.jpg"
-                                        alt="Technology">
+                                    <img src="templateapi/assets/images/hai1/cyber.jpg" alt="Technology">
                                     <div class="image-overlay">
                                         <h4>Cybersecurity</h4>
-                                        <p>A digital shield or lock icon overlaid on a dark, technical background with green/blue code lines, symbolizing protection.</p>
+                                        <p>A digital shield or lock icon overlaid on a dark, technical background with
+                                            green/blue code lines, symbolizing protection.</p>
                                     </div>
                                 </div>
                             </div>
@@ -313,19 +319,19 @@
                         <div class="slide1">
                             <div class="slide1-box">
                                 <div class="image-container">
-                                    <img src="assets/images/hai1/qa.jpg"
-                                        alt="Analytics">
+                                    <img src="templateapi/assets/images/hai1/qa.jpg" alt="Analytics">
                                     <div class="image-overlay">
                                         <h4>QA & Testing</h4>
-                                        <p>A close-up of a developer's screen showing a green 'Tests Passed' status and a successful performance report graph.</p>
+                                        <p>A close-up of a developer's screen showing a green 'Tests Passed' status and
+                                            a successful performance report graph.</p>
                                     </div>
                                 </div>
                                 <div class="image-container">
-                                    <img src="assets/images/hai1/cyber.jpg"
-                                        alt="Technology">
+                                    <img src="templateapi/assets/images/hai1/cyber.jpg" alt="Technology">
                                     <div class="image-overlay">
                                         <h4>Cybersecurity</h4>
-                                        <p>A digital shield or lock icon overlaid on a dark, technical background with green/blue code lines, symbolizing protection.</p>
+                                        <p>A digital shield or lock icon overlaid on a dark, technical background with
+                                            green/blue code lines, symbolizing protection.</p>
                                     </div>
                                 </div>
                             </div>
@@ -333,19 +339,19 @@
                         <div class="slide1">
                             <div class="slide1-box">
                                 <div class="image-container">
-                                    <img src="assets/images/hai1/hai12.jpg"
-                                        alt="Analytics">
+                                    <img src="templateapi/assets/images/hai1/hai12.jpg" alt="Analytics">
                                     <div class="image-overlay">
                                         <h4>Software Dev</h4>
-                                        <p>A sleek image of a professional wireframe/design on a large monitor, with a split view showing the finished product on a mobile phone.</p>
+                                        <p>A sleek image of a professional wireframe/design on a large monitor, with a
+                                            split view showing the finished product on a mobile phone.</p>
                                     </div>
                                 </div>
                                 <div class="image-container">
-                                    <img src="assets/images/hai1/qa.jpg"
-                                        alt="Technology">
+                                    <img src="templateapi/assets/images/hai1/qa.jpg" alt="Technology">
                                     <div class="image-overlay">
                                         <h4>QA & Testing</h4>
-                                        <p>A close-up of a developer's screen showing a green 'Tests Passed' status and a successful performance report graph.</p>
+                                        <p>A close-up of a developer's screen showing a green 'Tests Passed' status and
+                                            a successful performance report graph.</p>
                                     </div>
                                 </div>
                             </div>
@@ -353,19 +359,21 @@
                         <div class="slide1">
                             <div class="slide1-box">
                                 <div class="image-container">
-                                    <img src="assets/images/hai1/ai.jpg"
-                                        alt="Analytics">
+                                    <img src="templateapi/assets/images/hai1/ai.jpg" alt="Analytics">
                                     <div class="image-overlay">
                                         <h4>AI & Data</h4>
-                                        <p>A stunning, large-scale data visualization or chart (like a complex network graph) displayed on a screen, hinting at discovery and high-level strategy.</p>
+                                        <p>A stunning, large-scale data visualization or chart (like a complex network
+                                            graph) displayed on a screen, hinting at discovery and high-level strategy.
+                                        </p>
                                     </div>
                                 </div>
                                 <div class="image-container">
-                                    <img src="assets/images/hai1/aws..jpg"
-                                        alt="Technology">
+                                    <img src="templateapi/assets/images/hai1/aws..jpg" alt="Technology">
                                     <div class="image-overlay">
                                         <h4>Cloud & DevOps</h4>
-                                        <p>An abstract, interconnected graphic of servers and data pipelines with subtle logos (AWS/Azure/GCP-style icons, if usage is permitted) to symbolize powerful infrastructure.</p>
+                                        <p>An abstract, interconnected graphic of servers and data pipelines with subtle
+                                            logos (AWS/Azure/GCP-style icons, if usage is permitted) to symbolize
+                                            powerful infrastructure.</p>
                                     </div>
                                 </div>
                             </div>
@@ -373,19 +381,20 @@
                         <div class="slide1">
                             <div class="slide1-box">
                                 <div class="image-container">
-                                    <img src="assets/images/hai1/ai.jpg"
-                                        alt="Analytics">
+                                    <img src="templateapi/assets/images/hai1/ai.jpg" alt="Analytics">
                                     <div class="image-overlay">
                                         <h4>AI & Data</h4>
-                                        <p>A stunning, large-scale data visualization or chart (like a complex network graph) displayed on a screen, hinting at discovery and high-level strategy.</p>
+                                        <p>A stunning, large-scale data visualization or chart (like a complex network
+                                            graph) displayed on a screen, hinting at discovery and high-level strategy.
+                                        </p>
                                     </div>
                                 </div>
                                 <div class="image-container">
-                                    <img src="assets/images/hai1/cyber.jpg"
-                                        alt="Technology">
+                                    <img src="templateapi/assets/images/hai1/cyber.jpg" alt="Technology">
                                     <div class="image-overlay">
                                         <h4>Cybersecurity</h4>
-                                        <p>A digital shield or lock icon overlaid on a dark, technical background with green/blue code lines, symbolizing protection.</p>
+                                        <p>A digital shield or lock icon overlaid on a dark, technical background with
+                                            green/blue code lines, symbolizing protection.</p>
                                     </div>
                                 </div>
                             </div>
@@ -394,19 +403,20 @@
                         <div class="slide1">
                             <div class="slide1-box">
                                 <div class="image-container">
-                                    <img src="assets/images/hai1/hai12.jpg"
-                                        alt="Creativity">
+                                    <img src="templateapi/assets/images/hai1/hai12.jpg" alt="Creativity">
                                     <div class="image-overlay">
                                         <h4>Software Dev</h4>
-                                        <p>A sleek image of a professional wireframe/design on a large monitor, with a split view showing the finished product on a mobile phone.</p>
+                                        <p>A sleek image of a professional wireframe/design on a large monitor, with a
+                                            split view showing the finished product on a mobile phone.</p>
                                     </div>
                                 </div>
                                 <div class="image-container">
-                                    <img src="assets/images/hai1/aws..jpg"
-                                        alt="Beach">
+                                    <img src="templateapi/assets/images/hai1/aws..jpg" alt="Beach">
                                     <div class="image-overlay">
                                         <h4>Cloud & DevOps</h4>
-                                        <p>An abstract, interconnected graphic of servers and data pipelines with subtle logos (AWS/Azure/GCP-style icons, if usage is permitted) to symbolize powerful infrastructure.</p>
+                                        <p>An abstract, interconnected graphic of servers and data pipelines with subtle
+                                            logos (AWS/Azure/GCP-style icons, if usage is permitted) to symbolize
+                                            powerful infrastructure.</p>
                                     </div>
                                 </div>
                             </div>
@@ -450,15 +460,13 @@
             <div class="move-slider-container">
                 <div class="move-slider-box-static">
                     <div class="slide-content-static">
-                        <h1 class="slide-static-h1"> Kodepilot </h1>
+                        <h1 class="slide-static-h1"> KodePilot </h1>
                         <p class="slide-static-text">
-                            Helping the world withcreative
+                            Helping the world with career success
                         </p>
-                        <p class="slide-static-text">
-                            designs
                         </p>
                         <p class="slide-static-footer">
-                            92% Client Retention
+                            100% Placement Success
                         </p>
                     </div>
                 </div>
@@ -469,18 +477,16 @@
                                 "
                             </p>
                             <p class="slide-text">
-                                "From farm inventory to eco-shipment tracking, kodepilot built us a green-tech backbone.
-                                Their system lets us trace every organic ingredient and prove our sustainability story
-                                to
-                                conscious customers."
+                                "The KodePilot curriculum is laser-focused on job placement. I mastered the required
+                                skills and secured my position at GBL with confidence."
                             </p>
                             <div class="slide-logo-box">
                                 <div class="profile-box">
-                                    <img src="https://images.unsplash.com/photo-1542744094-24638eff58bb?w=500&h=400&fit=crop&crop=entropy&cs=tinysrgb"
-                                        alt="Client Logo" class="slide-logo">
+                                    <img src="templateapi/assets/images/hai1/user-icon.svg" alt="Client Logo"
+                                        class="slide-logo">
                                     <div class="profile-info">
-                                        <p class="slide-name">John Doe</p>
-                                        <p class="slide-role">CEO</p>
+                                        <p class="slide-name">Dhanush</p>
+                                        <p class="slide-role">Rust Developer</p>
                                     </div>
                                 </div>
                             </div>
@@ -493,16 +499,16 @@
                                 "
                             </p>
                             <p class="slide-text">
-                                "kodepilot understood our mission: simple, honest, organic. They delivered a clean,
-                                lightning-fast e-commerce engine that scales with our growth."
+                                "After taking the QA and DevOps courses, KodePilot made me ready for the global stage. I
+                                was immediately placed with a top-tier company: Accenture."
                             </p>
                             <div class="slide-logo-box">
                                 <div class="profile-box">
-                                    <img src="https://images.unsplash.com/photo-1542744094-24638eff58bb?w=500&h=400&fit=crop&crop=entropy&cs=tinysrgb"
-                                        alt="Client Logo" class="slide-logo">
+                                    <img src="templateapi/assets/images/hai1/user-icon.svg" alt="Client Logo"
+                                        class="slide-logo">
                                     <div class="profile-info">
-                                        <p class="slide-name">John Doe</p>
-                                        <p class="slide-role">CEO</p>
+                                        <p class="slide-name">Amit</p>
+                                        <p class="slide-role">QA Tester</p>
                                     </div>
                                 </div>
                             </div>
@@ -514,17 +520,16 @@
                                 "
                             </p>
                             <p class="slide-text">
-                                "Loan processing used to take weeks. kodepilot’ smart engine made approvals happen in
-                                days
-                                without compromising security."
+                                "KodePilot's training in AWS and DevOps was the key to my career breakthrough. I went
+                                from learning the skills to successfully landing a role at Infosys."
                             </p>
                             <div class="slide-logo-box">
                                 <div class="profile-box">
-                                    <img src="https://images.unsplash.com/photo-1542744094-24638eff58bb?w=500&h=400&fit=crop&crop=entropy&cs=tinysrgb"
-                                        alt="Client Logo" class="slide-logo">
+                                    <img src="templateapi/assets/images/hai1/user-icon.svg" alt="Client Logo"
+                                        class="slide-logo">
                                     <div class="profile-info">
                                         <p class="slide-name">John Doe</p>
-                                        <p class="slide-role">CEO</p>
+                                        <p class="slide-role">AWS</p>
                                     </div>
                                 </div>
                             </div>
@@ -533,101 +538,103 @@
                 </div>
             </div>
         </section>
+        <section>
 
-
-    <section class="practice-cards-container">
-
-        <!-- <div class="practice-cards-container"> -->
             <div class="practice-container">
-                <h1 class="practice-title">Practice Coding & Ace Hiring Assessments</h1>
-                <p class="practice-subtitle">Level up your coding skills by practicing the hiring assessments of your dream companies & ace your placement game!</p>
-                
-                <div class="practice-cards-wrapper">
-                    <!-- Coding Practice Card -->
-                    <div class="practice-card active">
-                        <div class="practice-card-content">
-                            <div>
-                                <div class="practice-card-icon">💻</div>
-                                <h3>Coding Practice</h3>
-                                <p>Level up your coding skills by practicing the hiring Questions.</p>
-                            </div>
-                            <a href="#" class="practice-cta-btn">Start Now ➤</a>
-                        </div>
-                        <div class="practice-card-svg">
-                            <img src="assets/images/mit-ico/ebmpapst.svg" alt="Coding Practice">
-                        </div>
+                <div class="practice-container-box">
+                    <div class="practice-container-text-box">
+                        <h1 class="practice-title">Practice Coding & Ace Hiring Assessments</h1>
+                        <p class="practice-subtitle">Level up your coding skills by practicing the hiring assessments of
+                            your
+                            dream companies & ace your placement game!</p>
                     </div>
-                    
-                    <!-- Interview Preparation Card -->
-                    <div class="practice-card">
-                        <div class="practice-card-content">
-                            <div>
-                                <div class="practice-card-icon">📋</div>
-                                <h3>Interview Preparation</h3>
-                                <p>Crack Top companies in just 5 days.</p>
-                                <div class="practice-footer-text">20+ Companies</div>
+                    <div class="practice-cards-wrapper">
+                        <div class="practice-card active">
+                            <div class="practice-card-content">
+                                <div>
+                                    <div class="practice-card-icon">💻</div>
+                                    <h3>Coding Practice</h3>
+                                    <p>Level up your coding skills by practicing the hiring Questions.</p>
+                                    <div class="practice-footer-text">400+ Questions</div>
+                                </div>
+                                <a href="#" class="practice-cta-btn">Start Now ➤</a>
                             </div>
-                            <a href="#" class="practice-cta-btn">Start Now ➤</a>
-                        </div>
-                        <div class="practice-card-svg">
-                            <img src="assets/images/mit-ico/ebmpapst.svg" alt="Coding Practice">
-                        </div>
-                    </div>
-                    
-                    <!-- Projects Card -->
-                    <div class="practice-card">
-                        <div class="practice-card-content">
-                            <div>
-                                <div class="practice-card-icon">📂</div>
-                                <h3>Projects</h3>
-                                <p>Projects epitomize perfect synergy for success.</p>
-                                <div class="practice-footer-text">15+ Projects</div>
+                            <div class="practice-card-svg">
+                                <img src="templateapi/assets/images/codinghiringassesments/nope_1.png"
+                                    alt="Coding Practice">
                             </div>
-                            <a href="#" class="practice-cta-btn">Start Now ➤</a>
                         </div>
-                        <div class="practice-card-svg">
-                            <img src="assets/images/mit-ico/ebmpapst.svg" alt="Coding Practice">
-                        </div>
-                    </div>
-                    
-                    <!-- Skill Based Assessments Card -->
-                    <div class="practice-card">
-                        <div class="practice-card-content">
-                            <div>
-                                <div class="practice-card-icon">📝</div>
-                                <h3>Skill Based Assessments</h3>
-                                <p>Assess your skills and get ahead of the curve.</p>
-                                <div class="practice-footer-text">2000+ Questions</div>
+
+
+                        <div class="practice-card">
+                            <div class="practice-card-content">
+                                <div>
+                                    <div class="practice-card-icon">📋</div>
+                                    <h3>Interview Preparation</h3>
+                                    <p>Crack Top companies in just 5 days with unbelivable learning</p>
+                                    <div class="practice-footer-text">20+ Companies</div>
+                                </div>
+                                <a href="#" class="practice-cta-btn">Start Now ➤</a>
+                            </div>
+                            <div class="practice-card-svg">
+                                <img src="templateapi/assets/images/codinghiringassesments/nope_2.png"
+                                    alt="Coding Practice">
                             </div>
-                            <a href="#" class="practice-cta-btn">Start Now ➤</a>
                         </div>
-                        <div class="practice-card-svg">
-                            <img src="assets/images/mit-ico/ebmpapst.svg" alt="Coding Practice">
+
+
+                        <div class="practice-card">
+                            <div class="practice-card-content">
+                                <div>
+                                    <div class="practice-card-icon">📂</div>
+                                    <h3>Projects</h3>
+                                    <p>Projects epitomize perfect synergy for success.</p>
+                                    <div class="practice-footer-text">15+ Projects</div>
+                                </div>
+                                <a href="#" class="practice-cta-btn">Start Now ➤</a>
+                            </div>
+                            <div class="practice-card-svg">
+                                <img src="templateapi/assets/images/codinghiringassesments/nope_3.webp"
+                                    alt="Coding Practice">
+                            </div>
+                        </div>
+
+
+                        <div class="practice-card">
+                            <div class="practice-card-content">
+                                <div>
+                                    <div class="practice-card-icon">📝</div>
+                                    <h3>Skill Based Assessments</h3>
+                                    <p>Assess your skills and get ahead of the curve.</p>
+                                    <div class="practice-footer-text">2000+ Questions</div>
+                                </div>
+                                <a href="#" class="practice-cta-btn">Start Now ➤</a>
+                            </div>
+                            <div class="practice-card-svg">
+                                <img src="templateapi/assets/images/codinghiringassesments/nope_4.webp"
+                                    alt="Coding Practice">
+                            </div>
                         </div>
                     </div>
                 </div>
             </div>
-        <!-- </div> -->
+        </section>
 
-    </section>
-
-        
-
-
-    <section class="card-simple">
-        <div class="card-easy">
-            <div class="card-easy-left">
-                <img src="assets/images/learn/learn.png" alt="Student Image">
-            </div>
-            <div class="card-easy-right">
-                <h2>Learn & Level Up Your Skills</h2>
-                <p>Select from a wide range of courses to upskill and advance your career!</p>
-                <div class="features">
-                    <div class="feature"><span>✓</span>50+ Courses</div>
-                    <div class="feature"><span>✓</span>Certificate</div>
-                    <div class="feature"><span>✓</span>Projects & Assignments</div>
+        <section class="card-simple">
+            <div class="card-easy">
+                <div class="card-easy-left">
+                    <img src="templateapi/assets/images/learn/learn.png" alt="Student Image">
+                </div>
+                <div class="card-easy-right">
+                    <h2>The Future of Your Career Starts Now. Learn, Grow, Achieve</h2>
+                    <p>Stop waiting for opportunity—create it. Dive into our extensive library to level up your
+                        expertise and unlock your next big career move.</p>
+                    <div class="features">
+                        <div class="feature"><span>✓</span>50+ Courses</div>
+                        <div class="feature"><span>✓</span>Certificate</div>
+                        <div class="feature"><span>✓</span>Projects & Assignments</div>
+                    </div>
                 </div>
-            </div>
         </section>
 
         <section class="move-slider" style="display: none;">
@@ -678,29 +685,31 @@
         <footer class="footer">
             <div class="footer-container">
                 <div class="footer-section company-section">
-                    <div class="logo">Kode Pilot</div>
+                    <div class="logo" style="text-align: left; margin-left: 0; padding-left: 0;">KodePilot</div>
                     <p class="tagline">Built with <span class="heart">❤</span> in India for the world</p>
-
                     <div class="contact-info">
                         <h4>Stay Connected</h4>
 
-                        <div style="margin-bottom: 20px;">
-                            <strong style="color: white; font-size: 14px;">Sales Inquiries</strong>
+
+                        <div style="margin-bottom: 20px; line-height: 23px; margin-left: -27px;">
+
                             <div class="contact-item">
                                 <i class="fas fa-envelope"></i>
-                                sales@kodepilot.com
+                                careers@kodepilot.com
                             </div>
                             <div class="contact-item">
                                 <i class="fas fa-phone"></i>
-                                +91-9311777388 <span style="font-size: 12px;">(Mon to Fri, 9 AM to 6 PM)</span>
+                                +91 88707 60431<span style="font-size: 12px;"> </span>
                             </div>
                         </div>
 
                         <div>
-                            <strong style="color: white; font-size: 14px;">Support Inquiries</strong>
-                            <div class="contact-item">
-                                <i class="fas fa-envelope"></i>
-                                support@kodepilot.com
+                            <strong style="color: white; font-size: 14px; line-height: 30px;">Support Inquiries</strong>
+                            <div style="margin-bottom: 20px; line-height: 23px; margin-left: -27px;">
+                                <div class="contact-item">
+                                    <i class="fas fa-envelope"></i>
+                                    support@kodepilot.com
+                                </div>
                             </div>
                         </div>
                     </div>
@@ -733,19 +742,15 @@
                     </div>
                 </div>
 
-                <!-- Courses Section -->
                 <div class="footer-section">
                     <h3>Courses</h3>
                     <ul>
-                        <li><a href="#">Web Development</a></li>
-                        <li><a href="#">Full Stack Development</a></li>
-                        <li><a href="#">Frontend Development</a></li>
-                        <li><a href="#">Backend Development</a></li>
-                        <li><a href="#">JavaScript Mastery</a></li>
-                        <li><a href="#">React & Next.js</a></li>
-                        <li><a href="#">Node.js & Express</a></li>
-                        <li><a href="#">Database Management</a></li>
-                        <li><a href="#">API Development</a></li>
+                        <li><a href="#">Software Development</a></li>
+                        <li><a href="#">Cloud & DevOps</a></li>
+                        <li><a href="#">AI & Data</a></li>
+                        <li><a href="#">Cybersecurity</a></li>
+                        <li><a href="#">Quality & Testing</a></li>
+                        <li><a href="#">Enterprise Tech</a></li>
                     </ul>
 
                     <h3 style="margin-top: 30px;">Learning Paths</h3>
@@ -771,22 +776,19 @@
 
                     <h3 style="margin-top: 30px;">Community</h3>
                     <ul>
-                        <li><a href="#">Student Forum</a></li>
+                        <li><a href="#">Forums & Study Groups</a></li>
                         <li><a href="#">Code Reviews</a></li>
-                        <li><a href="#">Study Groups</a></li>
-                        <li><a href="#">Success Stories</a></li>
-                        <li><a href="#">Mentorship Program</a></li>
+                        <li><a href="#">Mentorship & Alumni</a></li>
                     </ul>
                 </div>
             </div>
 
             <div class="footer-bottom">
                 <div style="max-width: 1200px; margin: 0 auto; padding: 0 20px;">
-                    <div class="footer-bottom-links">
-                    <p style="margin-top: 20px;">
-                        <p style="color:#000;">
-                            Copyright © 2025 <a href="#" style="color:#000; text-decoration:none;">Kode Pilot Learning Pvt Ltd</a> - All rights reserved.
-                        </p>
+                    <p style="margin-top: 20px 0px; padding: 10px 0px; font-size: 15px; margin-bottom : 30px">
+                        Copyright © 2025 <a href="#" style="color: #120ee2;">KodePilot</a> - All
+                        rights
+                        reserved.
                     </p>
                 </div>
             </div>

main.js

@@ -1,12 +1,11 @@
 function goToApplay() {
-    window.location.href = "/applay/";
+    window.location.href = "/apply/";
 }
 
 function getInTouch() {
-    window.open("https://wa.me/1234567890?text=Hi%20Link%20kodepilote%20Team...", "_blank");
+    window.open("https://wa.me/+919787466226?text=Hi%20KodePilot%20Team%2C%0A%0AI%20came%20across%20your%20website%20and%20would%20like%20to%20know%20more%20about%20your%20Career%20Guidance%20and%20Placement%20support%20services.%20Could%20you%20please%20share%20the%20details%3F%0A%0AThanks%21", "_blank");
 }
 
-
 (function () {
     if (window.Slide1rSliderLoaded) {
         return;
@@ -195,31 +194,6 @@ function getInTouch() {
     new Slide1rSlider();
 })();
 
-document.addEventListener("DOMContentLoaded", () => {
-    const track = document.querySelector(".move-slider-track");
-    const boxes = Array.from(track.children);
-
-    boxes.forEach(box => {
-        const clone = box.cloneNode(true);
-        track.appendChild(clone);
-    });
-
-    let position = 0;
-    const speed = 1;
-
-    function animate() {
-        position -= speed;
-        if (Math.abs(position) >= track.scrollWidth / 2) {
-            position = 0;
-        }
-        track.style.transform = `translateX(${position}px)`;
-        requestAnimationFrame(animate);
-    }
-
-    animate();
-});
-
-
 const statItems = document.querySelectorAll('.stat-item');
 
 const observer = new IntersectionObserver((entries) => {
@@ -234,151 +208,36 @@ const observer = new IntersectionObserver((entries) => {
 
 console.log("test");
 document.addEventListener('DOMContentLoaded', async () => {
-    // const allCourses = [];
+    const allCourses = [];
 
-    // const baseUrl = 'https://kodepilot.in/course/index.php';
-    // const res = await fetch(baseUrl);
-    // const html = await res.text();
+    const baseUrl = 'https://kodepilot.in/course/index.php';
+    const res = await fetch(baseUrl);
+    const html = await res.text();
 
-    // const categoryRegex = /<h3 class="categoryname aabtn"><a href="([^"]+)">([^<]+)<\/a><\/h3>/g;
-    // const categories = [];
-    // let match;
-    // while ((match = categoryRegex.exec(html)) !== null) {
-    //     categories.push({ url: match[1], name: match[2] });
-    // }
+    const categoryRegex = /<h3 class="categoryname aabtn"><a href="([^"]+)">([^<]+)<\/a><\/h3>/g;
+    const categories = [];
+    let match;
+    while ((match = categoryRegex.exec(html)) !== null) {
+        categories.push({ url: match[1], name: match[2] });
+    }
 
-    // for (const category of categories) {
-    //     const resCat = await fetch(category.url);
-    //     const catHtml = await resCat.text();
-    //     const cleanHtml = catHtml.replace(/\n/g, ' ');
+    for (const category of categories) {
+        const resCat = await fetch(category.url);
+        const catHtml = await resCat.text();
+        const cleanHtml = catHtml.replace(/\n/g, ' ');
 
-    //     const courseRegex = /<div class="card dashboard-card [^"]*"[^>]*>.*?<a href="([^"]+)"[^>]*>.*?background-image: url\(([^)]+)\);".*?<span class="sr-only">(.*?)<\/span>.*?<div class="course-category">\s*([^<]+)<\/div>.*?<div class="course-summary">.*?<p>(.*?)<\/p>/g;
+        const courseRegex = /<div class="card dashboard-card [^"]*"[^>]*>.*?<a href="([^"]+)"[^>]*>.*?background-image: url\(([^)]+)\);".*?<span class="sr-only">(.*?)<\/span>.*?<div class="course-category">\s*([^<]+)<\/div>.*?<div class="course-summary">.*?<p>(.*?)<\/p>/g;
 
-    //     while ((match = courseRegex.exec(cleanHtml)) !== null) {
-    //         allCourses.push({
-    //             category: match[4].trim(),
-    //             link: match[1].trim(),
-    //             image: match[2].trim(),
-    //             name: match[3].trim(),
-    //             description: match[5].replace(/<br\s*\/?>/g, ' ').trim()
-    //         });
-    //     }
-    // }
-    const allCourses = [
-        {
-            category: "Software Development & Engineering",
-            link: "https://kodepilot.in/course/view.php?id=16",
-            image: "https://kodepilot.in/pluginfile.php/53/course/overviewfiles/UiUx.png",
-            name: "UI/UX Design",
-            description: "Learn the fundamentals of user interface and user experience design."
-        },
-        {
-            category: "Software Development & Engineering",
-            link: "https://kodepilot.in/course/view.php?id=9",
-            image: "https://kodepilot.in/pluginfile.php/39/course/overviewfiles/IOS.png",
-            name: "iOS Development",
-            description: "Build iOS apps using Swift and Apple’s development tools."
-        },
-        {
-            category: "Software Development & Engineering",
-            link: "https://kodepilot.in/course/view.php?id=7",
-            image: "https://kodepilot.in/pluginfile.php/35/course/overviewfiles/RD.png",
-            name: "React Development",
-            description: "Master React.js for building fast and scalable web apps."
-        },
-        {
-            category: "Software Development & Engineering",
-            link: "https://kodepilot.in/course/view.php?id=5",
-            image: "https://kodepilot.in/pluginfile.php/31/course/overviewfiles/PFS.png",
-            name: "Full Stack Development",
-            description: "End-to-end training in frontend, backend, and databases."
-        },
-        {
-            category: "Software Development & Engineering",
-            link: "https://kodepilot.in/course/view.php?id=3",
-            image: "https://kodepilot.in/pluginfile.php/25/course/overviewfiles/JFS.png",
-            name: "Java Full Stack",
-            description: "Become a full stack developer with Java, Spring, and modern tools."
-        },
-        {
-            category: "Quality & Testing",
-            link: "https://kodepilot.in/course/view.php?id=13",
-            image: "https://kodepilot.in/pluginfile.php/46/course/overviewfiles/PT.png",
-            name: "Performance Testing",
-            description: "Learn tools and techniques for testing system performance."
-        },
-        {
-            category: "Quality & Testing",
-            link: "https://kodepilot.in/course/view.php?id=10",
-            image: "https://kodepilot.in/pluginfile.php/41/course/overviewfiles/QA.png",
-            name: "QA Testing",
-            description: "Understand quality assurance practices for reliable software."
-        },
-        {
-            category: "Cloud & DevOps",
-            link: "https://kodepilot.in/course/view.php?id=17",
-            image: "https://kodepilot.in/pluginfile.php/55/course/overviewfiles/GC.png",
-            name: "Google Cloud",
-            description: "Get hands-on with Google Cloud Platform services and tools."
-        },
-        {
-            category: "Cloud & DevOps",
-            link: "https://kodepilot.in/course/view.php?id=4",
-            image: "https://kodepilot.in/pluginfile.php/28/course/overviewfiles/AWSA.png",
-            name: "AWS Associate",
-            description: "Prepare for AWS certifications and cloud computing skills."
-        },
-        {
-            category: "AI, Data & Emerging Tech (On-demand & trending)",
-            link: "https://kodepilot.in/course/view.php?id=26",
-            image: "https://kodepilot.in/pluginfile.php/73/course/overviewfiles/DE.png",
-            name: "Data Engineering",
-            description: "Build pipelines and manage data at scale for analytics."
-        },
-        {
-            category: "AI, Data & Emerging Tech (On-demand & trending)",
-            link: "https://kodepilot.in/course/view.php?id=18",
-            image: "https://kodepilot.in/pluginfile.php/58/course/overviewfiles/PE.png",
-            name: "Prompt Engineering",
-            description: "Learn to design prompts for AI models like ChatGPT."
-        },
-        {
-            category: "AI, Data & Emerging Tech (On-demand & trending)",
-            link: "https://kodepilot.in/course/view.php?id=12",
-            image: "https://kodepilot.in/pluginfile.php/44/course/overviewfiles/AI%28Ess%29.png",
-            name: "AI Essentials",
-            description: "Introduction to AI, ML concepts, and real-world use cases."
-        },
-        {
-            category: "Enterprise & Business Tech",
-            link: "https://kodepilot.in/course/view.php?id=24",
-            image: "https://kodepilot.in/pluginfile.php/70/course/overviewfiles/ServiceNow.png",
-            name: "ServiceNow",
-            description: "Learn ITSM and workflow automation with ServiceNow."
-        },
-        {
-            category: "Enterprise & Business Tech",
-            link: "https://kodepilot.in/course/view.php?id=19",
-            image: "https://kodepilot.in/pluginfile.php/61/course/overviewfiles/SAP.png",
-            name: "SAP",
-            description: "Master SAP ERP modules for enterprise solutions."
-        },
-        {
-            category: "Cybersecurity & Compliance",
-            link: "https://kodepilot.in/course/view.php?id=23",
-            image: "https://kodepilot.in/pluginfile.php/69/course/overviewfiles/Security.png",
-            name: "Security Fundamentals",
-            description: "Understand core concepts of IT security and defense."
-        },
-        {
-            category: "Cybersecurity & Compliance",
-            link: "https://kodepilot.in/course/view.php?id=22",
-            image: "https://kodepilot.in/pluginfile.php/68/course/overviewfiles/CyE.png",
-            name: "Cyber Essentials",
-            description: "Learn the basics of cybersecurity and compliance standards."
+        while ((match = courseRegex.exec(cleanHtml)) !== null) {
+            allCourses.push({
+                category: match[4].trim(),
+                link: match[1].trim(),
+                image: match[2].trim(),
+                name: match[3].trim(),
+                description: match[5].replace(/<br\s*\/?>/g, ' ').trim()
+            });
         }
-    ];
-
+    }
     console.table(allCourses);
 
 
@@ -387,66 +246,106 @@ document.addEventListener('DOMContentLoaded', async () => {
 
 function renderCourses(allCourses) {
     const container = document.querySelector('.corces');
-    if (!container) {
-        console.error("⚠️ No .corces container found in DOM");
-        return;
-    }
+    if (!container) return;
 
     container.innerHTML = '';
 
-    // Group courses by category
     const grouped = {};
     allCourses.forEach(course => {
         if (!grouped[course.category]) grouped[course.category] = [];
         grouped[course.category].push(course);
     });
 
-    // Render each category section
-    Object.keys(grouped).forEach(category => {
+    let sections = Object.entries(grouped).map(([category, courses]) => ({ category, courses }));
+
+    let mergedSections = [];
+    let temp = { category: '', courses: [] };
+
+    sections.forEach(section => {
+        if (section.courses.length >= 4) {
+            mergedSections.push(section);
+        } else {
+            if (temp.category) temp.category += '/' + section.category;
+            else temp.category = section.category;
+            temp.courses.push(...section.courses);
+
+            if (temp.courses.length >= 4) {
+                mergedSections.push({ category: temp.category, courses: temp.courses });
+                temp = { category: '', courses: [] };
+            }
+        }
+    });
+
+    if (temp.courses.length >= 4) {
+        mergedSections.push(temp);
+    }
+
+    mergedSections.forEach(sectionData => {
         const section = document.createElement('div');
         section.className = 'course-section';
-
         section.innerHTML = `
-            <h2 class="course-category-title">${category}</h2>
-            <div class="course-slider">
-                <button class="prev-btn">◀</button>
-                <div class="course-track"></div>
-                <button class="next-btn">▶</button>
-            </div>
-        `;
+        <h2 class="course-category-title">${sectionData.category}</h2>
+        <div class="course-slider-box">
+        <div class="course-slider">
+            <button class="prev-btn nav-button"></button>
+            <div class="course-track"></div>
+            <button class="next-btn nav-button"></button>
+        </div>
+        </div>
+    `;
 
         const track = section.querySelector('.course-track');
-
-        grouped[category].forEach(course => {
-            const courseDiv = document.createElement('div');
-            courseDiv.className = 'course-card';
-            courseDiv.innerHTML = `
-                <a href="${course.link}" target="_blank">
-                  <div class="course-image" style="background-image: url(${course.image});"></div>
-                </a>
-                <div class="course-content">
-                  <a href="${course.link}" class="course-name" target="_blank">${course.name}</a>
-                  <div class="course-description">${course.description}</div>
-                </div>
-            `;
-            track.appendChild(courseDiv);
-        });
-
         const prevBtn = section.querySelector('.prev-btn');
         const nextBtn = section.querySelector('.next-btn');
 
-        let scrollAmount = 0;
-        prevBtn.addEventListener('click', () => {
-            track.scrollBy({ left: -300, behavior: 'smooth' });
+        sectionData.courses.forEach(course => {
+            const courseDiv = document.createElement('div');
+            courseDiv.className = 'course-card';
+            courseDiv.innerHTML = `
+            <a href="${course.link}" target="_blank">
+              <div class="course-image" style="background-image: url(${course.image});"></div>
+            </a>
+            <div class="course-content">
+              <a href="${course.link}" class="course-name" target="_blank">${course.name}</a>
+              <div class="course-description">${course.description}</div>
+            </div>
+        `;
+            track.appendChild(courseDiv);
         });
-        nextBtn.addEventListener('click', () => {
-            track.scrollBy({ left: 300, behavior: 'smooth' });
+
+        // Button scrolling
+        const scrollAmount = 300;
+        prevBtn.addEventListener('click', () => track.scrollBy({ left: -scrollAmount, behavior: 'smooth' }));
+        nextBtn.addEventListener('click', () => track.scrollBy({ left: scrollAmount, behavior: 'smooth' }));
+
+        // Touch swipe
+        let startX = 0;
+        let isDragging = false;
+
+        track.addEventListener('touchstart', e => {
+            startX = e.touches[0].clientX;
+            isDragging = true;
+        });
+
+        track.addEventListener('touchmove', e => {
+            if (!isDragging) return;
+            const x = e.touches[0].clientX;
+            const walk = (startX - x) * 10;
+            track.scrollLeft += walk;
+            startX = x;
+        });
+
+
+        track.addEventListener('touchend', () => {
+            isDragging = false;
         });
 
         container.appendChild(section);
     });
+
 }
 
+
 statItems.forEach(item => observer.observe(item));
 
 
@@ -465,10 +364,77 @@ function stepScroll() {
         track.appendChild(first);
         track.style.transition = 'none';
         track.style.transform = 'translateX(0)';
-        void track.offsetWidth; // force reflow
+        void track.offsetWidth;
         track.style.transition = 'transform 0.5s ease';
         track.removeEventListener('transitionend', handler);
     });
 }
 
 setInterval(stepScroll, 3000);
+
+document.addEventListener('DOMContentLoaded', function () {
+    const cards = document.querySelectorAll('.practice-card');
+    let activeCard = document.querySelector('.practice-card.active');
+    let lastActiveCard = activeCard;
+
+    function setActiveCard(card) {
+        cards.forEach(c => {
+            c.classList.remove('active');
+        });
+
+        card.classList.add('active');
+
+        lastActiveCard = card;
+    }
+
+    if (!activeCard && cards.length > 0) {
+        setActiveCard(cards[0]);
+    }
+
+    cards.forEach(card => {
+        card.addEventListener('click', function () {
+            setActiveCard(this);
+        });
+    });
+});
+
+const data = [
+    { name: "Ben", text: "Just Went HCL!" },
+    { name: "Rakul", text: "Just Went Accenture!" },
+    { name: "Anjali", text: "Joined a Ebmpapst!" },
+    { name: "Sneha", text: "joined a Infosys!" },
+    { name: "Amit", text: "Just Went JBL!" },
+    { name: "Vikram", text: "Just Went UST!" },
+    { name: "Priya", text: "Just Went Serviceplaingroup!" }
+];
+let index1 = 0;
+const nameEl1 = document.querySelector(".nameContainer");
+const descEl1 = document.querySelector(".descContainer");
+setInterval(() => {
+    nameEl1.classList.add("fade-out");
+    descEl1.classList.add("fade-out");
+    setTimeout(() => {
+        index1 = (index1 + 1) % data.length;
+        nameEl1.textContent = data[index1].name;
+        descEl1.textContent = " " + data[index1].text;
+        nameEl1.classList.remove("fade-out");
+        descEl1.classList.remove("fade-out");
+        nameEl1.classList.add("fade-in");
+        descEl1.classList.add("fade-in");
+        setTimeout(() => {
+            nameEl1.classList.remove("fade-in");
+            descEl1.classList.remove("fade-in");
+        }, 500);
+    }, 500);
+}, 5000);
+
+
+document.addEventListener("DOMContentLoaded", () => {
+    document.querySelectorAll(".footer a").forEach(link => {
+        link.setAttribute("href", "/apply");
+    });
+
+    document.querySelectorAll(".practice-container a").forEach(link => {
+        link.setAttribute("href", "/apply");
+    });
+});