up

.gitignore

@@ -5,3 +5,6 @@ dist/
 .env.local
 .env.*.local
 .codex
+.cache/
+.openvscode-server/
+docs/

assets/css/product.css

@@ -0,0 +1,390 @@
+:root {
+    --product-section-heading-gap: 48px;
+    --product-section-heading-inner-gap: 14px;
+}
+
+.cargo-platform-content {
+    display: flex;
+    flex-wrap: wrap;
+}
+
+.cargo-info-left {
+    width: 540px;
+    flex: 0 0 540px;
+    padding-right: 30px;
+    box-sizing: border-box;
+    text-align: left;
+}
+
+.cargo-info-left--compact {
+    flex-basis: 540px;
+}
+
+.cargo-info-left h2,
+.cargo-info-left p {
+    text-align: left;
+}
+
+.cargo-info-right {
+    flex: 1;
+    min-width: 0;
+    box-sizing: border-box;
+}
+
+.product-hero-container {
+    padding-top: 0;
+}
+
+@media screen and (min-width: 992px) {
+    .page-title.page-title-cargo-platform .container.product-hero-container,
+    .page-title.page-title-cargo-platform1 .container.product-hero-container,
+    .page-title.page-title-cargo-platform2 .container.product-hero-container {
+        padding-top: 0;
+    }
+}
+
+.product-hero-title {
+    margin-bottom: 20px;
+}
+
+.product-hero-description {
+    font-size: 16px;
+    line-height: 1.8;
+}
+
+.page-title-cargo-platform .product-hero-title,
+.page-title-cargo-platform .product-hero-description,
+.page-title-cargo-platform2 .product-hero-title,
+.page-title-cargo-platform2 .product-hero-description {
+    color: #021c3e;
+}
+
+.page-title-cargo-platform1 .product-hero-title {
+    color: #021c3e;
+}
+
+.page-title-cargo-platform1 .product-hero-description {
+    color: #012e67;
+}
+
+.main2 {
+    display: flex;
+    justify-content: center;
+    width: 100%;
+}
+
+.product-architecture-section--gradient {
+    background: linear-gradient(135deg, #d2e5fa 0%, #f0f7ff 30%, #f5f9ff 70%, #d2e7fd 100%);
+}
+
+.product-architecture-section--soft {
+    background-color: #eaf5fd;
+    padding: 60px 0;
+}
+
+.product-architecture-container {
+    padding: 20px;
+}
+
+.product-architecture-title {
+    margin: 40px 0 var(--product-section-heading-inner-gap);
+}
+
+.product-architecture-title--compact {
+    margin-bottom: var(--product-section-heading-inner-gap);
+}
+
+.product-architecture-section--gradient .text-center > p,
+.product-architecture-section--soft .text-center > p {
+    margin: 0 0 var(--product-section-heading-gap);
+}
+
+.product-advantages-header {
+    padding-top: 60px;
+    margin-bottom: var(--product-section-heading-gap);
+    text-align: center;
+}
+
+.product-advantages-header--compact {
+    padding-top: 50px;
+}
+
+.product-advantages-title {
+    margin-bottom: var(--product-section-heading-inner-gap);
+}
+
+.product-advantages-title--spacious {
+    margin-bottom: var(--product-section-heading-inner-gap);
+}
+
+.product-advantages-header p {
+    margin: 0;
+}
+
+.feature-highlight-section {
+    background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
+    padding-top: 90px;
+    padding-bottom: 90px;
+}
+
+.feature-highlight-heading {
+    text-align: center;
+    margin-bottom: var(--product-section-heading-gap);
+}
+
+.feature-highlight-heading h1 {
+    margin: 0 0 var(--product-section-heading-inner-gap);
+    color: #10233f;
+}
+
+.feature-highlight-heading p {
+    margin: 0;
+}
+
+.feature-highlight-tabs {
+    display: flex;
+    flex-wrap: nowrap;
+    justify-content: space-between;
+    gap: 10px;
+    margin: 0;
+    padding: 0;
+    list-style: none;
+    border-bottom: 1px solid #dfe8f3;
+    width: 100%;
+}
+
+.feature-highlight-tabs li {
+    flex: 0 0 auto;
+    min-width: auto;
+}
+
+.feature-highlight-tab {
+    position: relative;
+    width: 100%;
+    padding: 16px 10px 18px;
+    border: 0;
+    background: transparent;
+    color: #4f5f76;
+    font-size: clamp(16px, 0.95vw, 18px);
+    font-weight: 600;
+    line-height: 1.5;
+    cursor: pointer;
+    transition: color 0.25s ease;
+    white-space: nowrap;
+}
+
+.feature-highlight-tab:hover,
+.feature-highlight-tab:focus {
+    color: #1c6de0;
+    outline: none;
+}
+
+.feature-highlight-tab.active {
+    color: #006aff;
+    text-decoration-line: underline;
+    text-decoration-color: #1b68db;
+    text-decoration-thickness: 4px;
+    text-underline-offset: 18px;
+    text-decoration-skip-ink: none;
+}
+
+.feature-highlight-tab.active:after {
+    content: none;
+}
+
+.feature-highlight-panel {
+    display: none;
+    padding-top: 54px;
+}
+
+.feature-highlight-panel.active {
+    display: block;
+}
+
+.feature-highlight-detail {
+    display: flex;
+    align-items: center;
+    gap: 56px;
+}
+
+.feature-highlight-copy {
+    flex: 1 1 52%;
+    max-width: 520px;
+    text-align: left;
+}
+
+.feature-highlight-copy h2 {
+    margin: 0 0 18px;
+    color: #101820;
+    font-size: 30px;
+    font-weight: 700;
+    line-height: 1.25;
+}
+
+.feature-highlight-copy p {
+    margin: 0;
+    color: #4f5f76;
+    font-size: 18px;
+    font-weight: 700;
+    line-height: 1.9;
+}
+
+.feature-highlight-points {
+    margin: 28px 0 0;
+    padding: 0;
+    list-style: none;
+}
+
+.feature-highlight-points li {
+    position: relative;
+    margin-bottom: 18px;
+    padding-left: 22px;
+    color: #24374f;
+    font-size: 16px;
+    line-height: 1.8;
+}
+
+.feature-highlight-points li:before {
+    content: "";
+    position: absolute;
+    top: 13px;
+    left: 0;
+    width: 8px;
+    height: 8px;
+    border-radius: 50%;
+    background: #1c6de0;
+    box-shadow: 0 0 0 6px rgba(28, 109, 224, 0.12);
+}
+
+.feature-highlight-visual {
+    flex: 1 1 48%;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+}
+
+.feature-highlight-visual-card {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 100%;
+    max-width: 620px;
+    min-height: 300px;
+    padding: 8px 10px;
+    border: 1px solid rgba(40, 122, 221, 0.08);
+    border-radius: 20px;
+    background: linear-gradient(180deg, rgba(247, 251, 255, 0.96) 0%, rgba(255, 255, 255, 0.98) 100%);
+    box-shadow: 0 10px 24px rgba(22, 72, 140, 0.04);
+    overflow: hidden;
+}
+
+.feature-highlight-visual-card img {
+    display: block;
+    width: 100%;
+    max-width: 100%;
+    max-height: none;
+    object-fit: contain;
+    filter: drop-shadow(0 8px 14px rgba(30, 88, 165, 0.08));
+}
+
+@media (max-width: 1199px) {
+    .feature-highlight-tab {
+        font-size: 16px;
+    }
+
+    .feature-highlight-copy h2 {
+        font-size: 40px;
+    }
+}
+
+@media (max-width: 991px) {
+    .feature-highlight-detail {
+        flex-direction: column;
+        align-items: stretch;
+        gap: 34px;
+    }
+
+    .feature-highlight-copy,
+    .feature-highlight-visual {
+        max-width: none;
+        flex-basis: 100%;
+    }
+
+    .feature-highlight-copy h2 {
+        font-size: 36px;
+    }
+}
+
+@media (max-width: 768px) {
+    .cargo-platform-content {
+        flex-direction: column;
+    }
+
+    .cargo-info-left {
+        width: 100%;
+        flex: 1;
+        padding-right: 0;
+        margin-bottom: 20px;
+    }
+
+    .cargo-info-right {
+        width: 100%;
+    }
+}
+
+@media (max-width: 767px) {
+    .feature-highlight-section {
+        padding-top: 70px;
+        padding-bottom: 70px;
+    }
+
+    .feature-highlight-heading p {
+        font-size: 16px;
+    }
+
+    .feature-highlight-tabs li {
+        flex: 0 0 auto;
+    }
+
+    .feature-highlight-tabs {
+        justify-content: flex-start;
+        gap: 8px;
+    }
+
+    .feature-highlight-tab {
+        padding: 14px 8px 16px;
+        font-size: 15px;
+    }
+
+    .feature-highlight-tab.active {
+        text-underline-offset: 16px;
+    }
+
+    .feature-highlight-tabs {
+        overflow-x: auto;
+        overflow-y: hidden;
+        -webkit-overflow-scrolling: touch;
+    }
+
+    .feature-highlight-panel {
+        padding-top: 32px;
+    }
+
+    .feature-highlight-copy h2 {
+        font-size: 30px;
+    }
+
+    .feature-highlight-copy p,
+    .feature-highlight-points li {
+        font-size: 16px;
+    }
+
+    .feature-highlight-visual-card {
+        min-height: 210px;
+        padding: 8px;
+    }
+
+    .feature-highlight-visual-card img {
+        width: 100%;
+    }
+}

assets/css/style.css

@@ -115,8 +115,9 @@ body {
 }
 
 p {
-  color: #2a3e5d;
-  line-height: 2em;
+  color: #1d2f4b;
+
+  line-height: 1.5em;
 }
 
 h1,
@@ -653,7 +654,7 @@ img {
 }
 
 .page-title3 {
-  background: url("../images/page-title3.webp") center center/cover no-repeat local;
+  background: url("../images/page-title3.png") center center/cover no-repeat local;
   width: 100%;
   height: 330px;
   position: relative;
@@ -669,7 +670,7 @@ img {
 }
 
 .page-title5 {
-  background: url("../images/page-title6.jpg.webp") center center/cover no-repeat local;
+  background: url("../images/page-title5.png") center center/cover no-repeat local;
   width: 100%;
   height: 330px;
   position: relative;
@@ -679,7 +680,7 @@ img {
 .page-title6 {
   background: url("../images/page-title6.png.webp") center center/cover no-repeat local;
   width: 100%;
-  height: 330px;
+  height: 360px;
   position: relative;
   text-align: center;
 }
@@ -715,6 +716,68 @@ img {
   color: #ffffff;
 }
 
+.page-title-cargo-platform1 {
+  background: url("../images/project/agNetCargoPlatform/top2.png") center center/cover no-repeat local;
+  width: 100%;
+  height: 330px;
+  position: relative;
+  text-align: center;
+  /* background-color: #ffffff00 !important; */
+  margin-top: 80px !important;  /* Adjusted for new 80px header height */
+}
+
+.page-title-cargo-platform1::before {
+  content: "";
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  /* background-color: rgba(0, 0, 0, 0.5); */
+  z-index: 1;
+}
+
+.page-title-cargo-platform1 .container {
+  position: relative;
+  z-index: 2;
+}
+
+.page-title-cargo-platform1 h2,
+.page-title-cargo-platform1 p {
+  color: #ffffff;
+}
+
+.page-title-cargo-platform2 {
+  background: url("../images/project/agNetCargoPlatform/top3.png") center center/cover no-repeat local;
+  width: 100%;
+  height: 330px;
+  position: relative;
+  text-align: center;
+  /* background-color: #ffffff00 !important; */
+  margin-top: 80px !important;  /* Adjusted for new 80px header height */
+}
+
+.page-title-cargo-platform2::before {
+  content: "";
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  /* background-color: rgba(0, 0, 0, 0.5); */
+  z-index: 1;
+}
+
+.page-title-cargo-platform2 .container {
+  position: relative;
+  z-index: 2;
+}
+
+.page-title-cargo-platform2 h2,
+.page-title-cargo-platform2 p {
+  color: #ffffff;
+}
+
 @media (max-width: 991px) {
   .page-title {
     height: 300px;
@@ -739,16 +802,17 @@ img {
 
 .page-title h2 {
   font-size: 55px;
+  margin-bottom: 20px;
+  color:#ffffff;
   font-size: 2.4375rem;
   font-weight: 900;
-  color: #fff;
+
   margin: 0em 0 0.30em;
 }
 .page-title p {
   font-size: 16px;
-  font-size: 1.3rem;
   /*font-weight: 900;*/
-  color: #fff;
+color:#ffffff;
   margin: 0.5em 0 0.30em;
 }
 
@@ -2724,7 +2788,7 @@ img {
 --------------------------------------------------------------*/
 .hero-slider {
   width: 100%;
-  height: 700px;
+  height: 500px;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
@@ -2746,6 +2810,7 @@ img {
 
 .hero-slider .swiper-slide {
   overflow: hidden;
+  background-size: cover;
   color: #fff;
 }
 
@@ -2940,7 +3005,7 @@ img {
 
 .hero-style-1 .slide-title h2, .hero-style-2 .slide-title h2, .hero-style-3 .slide-title h2 {
   font-size: 55px;
-  font-size: 3.4375rem;
+  font-size: 3rem;
   font-weight: 800;
   color: #031c5c;
   margin: 0 0 0.45em;
@@ -3626,7 +3691,7 @@ img {
 --------------------------------------------------------------*/
 .services-section {
   background-color:#f5f8f9;
-  padding-bottom: 105px;
+  padding-bottom: 80px;
 }
 
 .services-section1 {
@@ -3688,7 +3753,7 @@ img {
   margin: 0 15px 30px;
   float: left;
   text-align: center;
-  padding: 35px 35px;
+  padding: 20px 35px;
   -webkit-box-shadow: 0px 0px 32px 0px rgba(16, 37, 65, 0.1);
   box-shadow: 0px 0px 32px 0px rgba(16, 37, 65, 0.1);
   border-radius: 10px;
@@ -4335,7 +4400,7 @@ img {
 .fun-fact-section h2 {
   font-size: 36px;
   font-size: 2.25rem;
-  margin: 0 0 1.8em;
+  margin: 0 0 1em;
 }
 
 @media (max-width: 991px) {
@@ -4366,8 +4431,9 @@ img {
 
 .fun-fact-section .grid h3 {
   font-size: 48px;
-  font-size: 3rem;
-  font-weight: 300;
+  font-size: 4rem;
+  font-weight: 700;
+  color: #0453fc;
   margin: 0 0 0.2em;
 }
 
@@ -4406,6 +4472,33 @@ img {
   padding-top: 0;
 }
 
+.portfolio-section.section-padding {
+  padding-top: 64px;
+  padding-bottom: 72px;
+}
+
+.portfolio-section .section-title-s4 {
+  max-width: 560px;
+  margin: 0 auto 38px;
+}
+
+.portfolio-section .section-title-s4 > span {
+  margin-bottom: 12px;
+  font-size: 1rem;
+  letter-spacing: 0.08em;
+}
+
+.portfolio-section .section-title-s4 h2 {
+  margin: 0;
+  line-height: 1.25;
+}
+
+.portfolio-section .portfolio-container {
+  max-width: 1488px;
+  margin: 0 auto;
+  padding: 0 24px 6px;
+}
+
 .portfolio-section:before {
   content: "";
   width: 100%;
@@ -4418,7 +4511,10 @@ img {
 
 .portfolio-section .portfolio-grids .grid {
   position: relative;
-  /*overflow: hidden;*/
+  overflow: hidden;
+  background: #0c2037;
+  -webkit-transition: -webkit-transform 0.35s ease, box-shadow 0.35s ease;
+  transition: transform 0.35s ease, box-shadow 0.35s ease;
 }
 
 .portfolio-section .portfolio-grids a.grid {
@@ -4427,25 +4523,48 @@ img {
   text-decoration: none;
 }
 
+.portfolio-section .portfolio-grids .grid .img-holder {
+  position: relative;
+}
+
+.portfolio-section .portfolio-grids .grid .img-holder img {
+  width: 100%;
+  aspect-ratio: 4 / 5;
+  object-fit: cover;
+  display: block;
+  filter: saturate(0.88) contrast(0.9) brightness(0.82);
+  -webkit-transition: -webkit-transform 0.45s ease, -webkit-filter 0.35s ease;
+  transition: transform 0.45s ease, filter 0.35s ease;
+}
+
 .portfolio-section .portfolio-grids .grid:hover {
-  cursor: -webkit-grab;
-  cursor: grab;
+  cursor: pointer;
+  -webkit-transform: translateY(-6px);
+  transform: translateY(-6px);
+  box-shadow: 0 22px 48px rgba(8, 24, 44, 0.18);
 }
 
 .portfolio-section .portfolio-grids .grid .details {
-  background-color: rgba(16, 37, 65, 0.9);
+  background: linear-gradient(180deg, rgba(7, 24, 43, 0.08) 0%, rgba(9, 29, 52, 0.22) 38%, rgba(9, 29, 52, 0.82) 100%);
   width: 100%;
   height: 100%;
   position: absolute;
   left: 0;
-  top: 30%;
-  opacity: 0;
-  visibility: hidden;
-  -webkit-transition: all 0.5s;
-  -moz-transition: all 0.5s;
-  -o-transition: all 0.5s;
-  -ms-transition: all 0.5s;
-  transition: all 0.5s;
+  top: 0;
+  padding: 40px 26px;
+  display: flex;
+  flex-direction: column;
+  justify-content: flex-end;
+  gap: 10px;
+  opacity: 1;
+  visibility: visible;
+  overflow: hidden;
+  pointer-events: none;
+  -webkit-transition: background 0.35s ease;
+  -moz-transition: background 0.35s ease;
+  -o-transition: background 0.35s ease;
+  -ms-transition: background 0.35s ease;
+  transition: background 0.35s ease;
 }
 
 .portfolio-section .portfolio-grids .grid .details:before {
@@ -4455,56 +4574,204 @@ img {
   position: absolute;
   left: 0;
   top: 0;
-  opacity: 0.85;
+  background: linear-gradient(180deg, rgba(12, 32, 54, 0.02) 0%, rgba(12, 32, 54, 0.08) 28%, rgba(12, 32, 54, 0.24) 100%);
+  opacity: 0.72;
 }
 
-.portfolio-section .portfolio-grids .grid .inner {
-  width: 100%;
-  padding: 25px;
+.portfolio-section .portfolio-grids .grid h3 {
+  margin: 0 0 6px;
+  color: rgb(255, 255, 255);
+  font-size: 1.5rem;
+  line-height: 1.3;
+  font-weight: 600;
+  max-width: 11em;
+  min-height: 2.6em;
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 2;
+  overflow: hidden;
+}
+
+@media (max-width: 991px) {
+  .portfolio-section .portfolio-grids .grid h3 {
+    font-size: 1.28rem;
+    min-height: 2.7em;
+  }
+}
+
+.portfolio-section .portfolio-grids .grid .portfolio-meta,
+.portfolio-section .portfolio-grids .grid .portfolio-desc,
+.portfolio-section .portfolio-grids .grid .portfolio-link {
+  position: relative;
+  z-index: 2;
+}
+
+.portfolio-section .portfolio-grids .grid .portfolio-meta {
+  margin: 0 0 6px;
+  color: #ffffff;
+  font-size: 0.82rem;
+  line-height: 1.4;
+  letter-spacing: 0.05em;
+  font-weight: 500;
+  text-transform: uppercase;
+  display: inline-flex;
+  align-items: center;
+  width: fit-content;
+  min-height: 34px;
+  padding: 5px 20px;
+  box-shadow: -1px 3px 6px rgb(5 99 241 / 67%);
+  border-radius: 30px;
+  background: rgba(16, 119, 255, 0.918);
+  backdrop-filter: blur(6px);
+  transform: translateY(-4px);
+}
+
+.portfolio-section .portfolio-grids .grid .portfolio-desc {
+  margin: 0;
+  min-height: 3.5em;
+  max-width: 15em;
+  color: rgba(232, 241, 250, 0.84);
+  font-size: 0.98rem;
+  line-height: 1.75;
+  font-weight: 400;
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 4;
+  overflow: hidden;
+}
+
+.portfolio-section .portfolio-grids .grid .portfolio-link {
+  display: inline-flex;
+  align-items: center;
+  position: relative;
+  width: fit-content;
+  margin-top: auto;
+  padding-left: 20px;
+  color: rgba(255, 255, 255, 0.88);
+  font-size: 0.95rem;
+  font-weight: 500;
+  letter-spacing: 0.02em;
+  -webkit-transition: color 0.35s ease, padding-left 0.35s ease;
+  transition: color 0.35s ease, padding-left 0.35s ease;
+}
+
+.portfolio-section .portfolio-grids .grid .portfolio-link:before,
+.portfolio-section .portfolio-grids .grid .portfolio-link:after {
+  content: "";
   position: absolute;
   left: 0;
-  bottom: 25px;
+  top: 50%;
+  background: #0084ff;
+  -webkit-transition: background 0.35s ease, width 0.35s ease, -webkit-transform 0.35s ease;
+  transition: background 0.35s ease, width 0.35s ease, transform 0.35s ease;
 }
 
-.portfolio-section .portfolio-grids .grid h3 {
-  font-size: 17px;
-  font-size: 1.0625rem;
-  margin: 0 0 0.3em;
-  text-transform: capitalize;
+.portfolio-section .portfolio-grids .grid .portfolio-link:before {
+  width: 12px;
+  height: 2px;
+  transform: translateY(-50%);
 }
 
-@media (max-width: 991px) {
-  .portfolio-section .portfolio-grids .grid h3 {
-    font-size: 15px;
-    font-size: 0.9375rem;
-  }
+.portfolio-section .portfolio-grids .grid .portfolio-link:after {
+  width: 7px;
+  height: 7px;
+  border-top: 2px solid #5ab0ff;
+  border-right: 2px solid #5ab0ff;
+  background: transparent;
+  left: 6px;
+  transform: translateY(-50%) rotate(45deg);
 }
 
-.portfolio-section .portfolio-grids .grid h3,
-.portfolio-section .portfolio-grids .grid h3 a {
-  color: #fff;
-  font-size: 1.75rem;
-}
-
-.portfolio-section .portfolio-grids .grid p {
-  font-size: 14px;
-  font-size: 1.25rem;
-  font-weight: 600;
-  color: #1481ff;
-  margin: 0;
-}
-
-@media (max-width: 991px) {
-  .portfolio-section .portfolio-grids .grid p {
-    font-size: 12px;
-    font-size: 0.75rem;
-  }
+.portfolio-section .portfolio-grids .grid:hover .img-holder img {
+  -webkit-transform: scale(1.03);
+  transform: scale(1.03);
+  filter: saturate(0.92) contrast(0.93) brightness(0.86);
 }
 
 .portfolio-section .portfolio-grids .grid:hover .details {
-  opacity: 1;
-  top: 0;
-  visibility: visible;
+  background: linear-gradient(180deg, rgba(7, 24, 43, 0.14) 0%, rgba(86, 165, 255, 0.28) 40%, rgba(28, 134, 255, 0.86) 100%);
+}
+
+.portfolio-section .portfolio-grids .grid:hover .portfolio-link {
+  color: #ffffff;
+  padding-left: 24px;
+}
+
+@media (max-width: 1199px) {
+  .portfolio-section.section-padding {
+    padding-top: 58px;
+    padding-bottom: 64px;
+  }
+
+  .portfolio-section .section-title-s4 {
+    max-width: 520px;
+    margin-bottom: 32px;
+  }
+
+  .portfolio-section .portfolio-container {
+    padding: 0 18px 4px;
+  }
+
+  .portfolio-section .portfolio-grids .grid .details {
+    padding: 24px 22px 24px;
+  }
+
+  .portfolio-section .portfolio-grids .grid h3 {
+    font-size: 1.42rem;
+    max-width: 8.5em;
+  }
+
+  .portfolio-section .portfolio-grids .grid .portfolio-meta {
+    margin-left: -22px;
+  }
+}
+
+@media (max-width: 767px) {
+  .portfolio-section.section-padding {
+    padding-top: 48px;
+    padding-bottom: 52px;
+  }
+
+  .portfolio-section .section-title-s4 {
+    margin-bottom: 24px;
+  }
+
+  .portfolio-section .section-title-s4 > span {
+    margin-bottom: 10px;
+  }
+
+  .portfolio-section .portfolio-container {
+    padding: 0 12px 4px;
+  }
+
+  .portfolio-section .portfolio-grids .grid .details {
+    padding: 22px 20px 20px;
+    gap: 12px;
+  }
+
+  .portfolio-section .portfolio-grids .grid h3 {
+    font-size: 1.12rem;
+    max-width: none;
+    min-height: auto;
+  }
+
+  .portfolio-section .portfolio-grids .grid .portfolio-meta {
+    font-size: 0.74rem;
+    min-height: 30px;
+    padding: 5px 20px 5px 12px;
+    margin-left: -20px;
+  }
+
+  .portfolio-section .portfolio-grids .grid .portfolio-desc {
+    font-size: 0.9rem;
+    line-height: 1.7;
+    min-height: auto;
+    max-width: none;
+  }
+
+  .portfolio-section .portfolio-grids .grid .portfolio-link {
+    font-size: 0.88rem;
+  }
 }
 
 .portfolio-section .all-portfolio {
@@ -4545,14 +4812,138 @@ img {
   bottom: 0;
 }
 
+.partners-section .partners-marquee-wrap {
+  position: relative;
+  width: 100%;
+  padding: 15px clamp(8px, 2vw, 24px) 30px;
+}
+
+.partners-section .partners-marquee-wrap .row {
+  margin-left: 0;
+  margin-right: 0;
+}
+
+.partners-section .partners-marquee-wrap .col-xs-12 {
+  padding-left: 0;
+  padding-right: 0;
+}
+
+.partners-section .partners-marquee-wrap .separator {
+  width: auto;
+  left: clamp(8px, 2vw, 24px);
+  right: clamp(8px, 2vw, 24px);
+}
+
+.partners-section .partner-marquee {
+  overflow: hidden;
+  width: 100%;
+}
+
+.partners-section .partner-track {
+  display: flex;
+  width: max-content;
+  -webkit-animation: partners-marquee 24s linear infinite;
+  animation: partners-marquee 24s linear infinite;
+  will-change: transform;
+}
+
+.partners-section .partner-track-set {
+  display: flex;
+  align-items: center;
+  flex-shrink: 0;
+}
+
 .partners-section .grid {
   text-align: center;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex: 0 0 auto;
+  min-width: clamp(120px, 12vw, 220px);
+  padding: 8px 15px;
 }
 
 .partners-section .grid img {
   height: 80px;
+  max-width: 100%;
+  width: auto;
   margin: auto 0;
   display: inline-block;
+  -o-object-fit: contain;
+  object-fit: contain;
+}
+
+@-webkit-keyframes partners-marquee {
+  from {
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+  }
+  to {
+    -webkit-transform: translate3d(-50%, 0, 0);
+    transform: translate3d(-50%, 0, 0);
+  }
+}
+
+@keyframes partners-marquee {
+  from {
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+  }
+  to {
+    -webkit-transform: translate3d(-50%, 0, 0);
+    transform: translate3d(-50%, 0, 0);
+  }
+}
+
+@media (max-width: 991px) {
+  .partners-section .partners-marquee-wrap {
+    padding-left: 12px;
+    padding-right: 12px;
+  }
+
+  .partners-section .partners-marquee-wrap .separator {
+    left: 12px;
+    right: 12px;
+  }
+
+  .partners-section .grid {
+    min-width: 160px;
+    padding: 8px 12px;
+  }
+
+  .partners-section .grid img {
+    height: 68px;
+  }
+}
+
+@media (max-width: 767px) {
+  .partners-section .partners-marquee-wrap {
+    padding-left: 10px;
+    padding-right: 10px;
+  }
+
+  .partners-section .partners-marquee-wrap .separator {
+    left: 10px;
+    right: 10px;
+  }
+
+  .partners-section .partner-track {
+    -webkit-animation-duration: 20s;
+    animation-duration: 20s;
+  }
+
+  .partners-section .partner-track-set {
+    flex-shrink: 0;
+  }
+
+  .partners-section .grid {
+    min-width: 128px;
+    padding: 6px 10px;
+  }
+
+  .partners-section .grid img {
+    height: 56px;
+  }
 }
 
 /*--------------------------------------------------------------
@@ -5340,6 +5731,7 @@ img {
   font-size: 16px;
   font-size: 1rem;
   margin: 1em 0 0;
+  color:#011946;
   line-height: 2em;
 }