diff --git a/Dockerfile b/Dockerfile
new file mode 100644
index 0000000..86f818f
--- /dev/null
+++ b/Dockerfile
@@ -0,0 +1,14 @@
+FROM node:22-alpine AS build
+WORKDIR /app
+COPY package*.json ./
+RUN npm ci
+COPY . .
+RUN npm run build
+
+FROM node:22-alpine
+WORKDIR /app
+COPY --from=build /app/dist ./dist
+RUN npm i -g serve
+EXPOSE 3000
+ENV NODE_ENV=production
+CMD ["serve", "-s", "dist", "-l", "3000"]
diff --git a/deploy.yml b/deploy.yml
index ca5497a..01399a5 100644
--- a/deploy.yml
+++ b/deploy.yml
@@ -1,4 +1,9 @@
-name: profen
-type: node
-start: npm run build && npx --yes -- serve -s dist -l $PORT
-dev: ./node_modules/.bin/vite --port $PORT --host
+app: profen
+stack: dockerfile
+build:
+    context: .
+ports:
+    - container: 3000
+      host: 0
+health:
+    path: /
diff --git a/public/wp-content/themes/rakar/assets/js/main.js b/public/wp-content/themes/rakar/assets/js/main.js
index 7a60826..a507bcf 100644
--- a/public/wp-content/themes/rakar/assets/js/main.js
+++ b/public/wp-content/themes/rakar/assets/js/main.js
@@ -471,6 +471,8 @@ function rakar_content_load_scripts() {
 
     // Window Load
     $(window).on('load', function () {
+        if (window.__rakarInit) return;
+        window.__rakarInit = true;
         rakar_content_load_scripts();
     });
 
diff --git a/src/components/home/HomeHero.jsx b/src/components/home/HomeHero.jsx
index e99be63..321d963 100644
--- a/src/components/home/HomeHero.jsx
+++ b/src/components/home/HomeHero.jsx
@@ -5,7 +5,7 @@ export default function HomeHero() {
       <div className="swiper th-slider" id="heroSlide5" data-slider-options={JSON.stringify({effect: "fade", autoHeight: true})}>
         <div className="swiper-wrapper">
           <div className="swiper-slide">
-            <div className="hero-inner" data-bg-src="/assets/images/img-14filt.jpg">
+            <div className="hero-inner hero-promist" data-bg-src="/assets/images/img-14filt.jpg">
               <div className="container">
                 <div className="hero-style5">
                   <span className="sub-title2 sub"><span className="line"></span>Welcome To Profen</span>
@@ -22,7 +22,7 @@ export default function HomeHero() {
             </div>
           </div>
           <div className="swiper-slide">
-            <div className="hero-inner" data-bg-src="/assets/images/adiabatic-cool.jpg">
+            <div className="hero-inner hero-heating" data-bg-src="/assets/images/adiabatic-cool.jpg">
               <div className="container">
                 <div className="hero-style5">
                   <span className="sub-title2 sub"><span className="line"></span>Welcome To Profen</span>
@@ -39,7 +39,7 @@ export default function HomeHero() {
             </div>
           </div>
           <div className="swiper-slide">
-            <div className="hero-inner" data-bg-src="/assets/images/img-13filter.jpg">
+            <div className="hero-inner hero-ac" data-bg-src="/assets/images/img-13filter.jpg">
               <div className="container">
                 <div className="hero-style5">
                   <span className="sub-title2 sub"><span className="line"></span>Welcome To Profen</span>
diff --git a/src/components/home/HomeServicesSection.jsx b/src/components/home/HomeServicesSection.jsx
index 5126dac..515aed4 100644
--- a/src/components/home/HomeServicesSection.jsx
+++ b/src/components/home/HomeServicesSection.jsx
@@ -14,19 +14,24 @@ const SERVICES = [
 export default function HomeServicesSection() {
   return (
     <div
+      id="services"
       className="elementor-element elementor-element-fb76345 e-flex e-con-boxed e-con e-parent"
       data-id="fb76345"
       data-element_type="container"
       data-e-type="container"
       data-settings={JSON.stringify({ background_background: "classic" })}
+      style={{ scrollMarginTop: 96 }}
     >
       <div className="e-con-inner">
-        <div
-          className="elementor-element elementor-element-7f99e6d e-con-full e-flex e-con e-child"
-          data-id="7f99e6d"
-          data-element_type="container"
-          data-e-type="container"
-        >
+    <div
+      id="services"
+      className="elementor-element elementor-element-fb76345 e-flex e-con-boxed e-con e-parent"
+      data-id="fb76345"
+      data-element_type="container"
+      data-e-type="container"
+      data-settings={JSON.stringify({ background_background: "classic" })}
+      style={{ scrollMarginTop: 96 }}
+    >
           <div
             className="elementor-element elementor-element-5ab397b elementor-widget__width-initial elementor-widget elementor-widget-rakarsectiontitle"
             data-id="5ab397b"
@@ -44,19 +49,6 @@ export default function HomeServicesSection() {
               </div>
             </div>
           </div>
-          <div
-            className="elementor-element elementor-element-521e1f7 elementor-widget elementor-widget-rakarbutton"
-            data-id="521e1f7"
-            data-element_type="widget"
-            data-e-type="widget"
-            data-widget_type="rakarbutton.default"
-          >
-            <div className="elementor-widget-container">
-              <div className="btn-wrapper">
-                <Link className="th-btn th_btn style2 rounded-12" to="/contact">View the service<i className="far fa-arrow-right"></i></Link>
-              </div>
-            </div>
-          </div>
         </div>
         <div
           className="elementor-element elementor-element-148606f elementor-widget elementor-widget-rakarservice"
@@ -68,10 +60,11 @@ export default function HomeServicesSection() {
           <div className="elementor-widget-container">
             <div className="row gy-4">
               {SERVICES.map((s) => (
-                <div key={s.slug} className="col-4 col-xxl-3 col-lg-4 col-md-6">
+                <div key={s.slug} className="col-6 col-xxl-3 col-lg-4 col-md-6">
                   <div className="service-block-new">
-                    <img className="service-bg" decoding="async" src={s.img} alt={s.title} />
-                    <div className="service-overlay"></div>
+                    <div className="service-media">
+                      <img className="service-bg" decoding="async" src={s.img} alt={s.title} />
+                    </div>
                     <div className="service-content">
                       <h3 className="service-title">
                         {s.external ? (
diff --git a/src/components/sections/Footer.jsx b/src/components/sections/Footer.jsx
index decf381..1f54007 100644
--- a/src/components/sections/Footer.jsx
+++ b/src/components/sections/Footer.jsx
@@ -97,6 +97,9 @@ export default function Footer() {
           max-width:none !important;
           width:100% !important;
         }
+        .pf-footer .th-widget-about{
+          max-width:none !important;
+        }
         /* ── FOOTER MOBILE RESPONSIVE ── */
         @media (max-width: 991px){
           .pf-footer .pf-contact-divider{ display:none !important; }
@@ -173,6 +176,7 @@ export default function Footer() {
       <div className="pf-copyright-line">
         <div className="pf-copyright-inner">
           <p className="copyright-text">Copyright <i className="fas fa-copyright"></i> 2026 <a href="/">Profen Engineering LLC</a>. All Rights Reserved.</p>
+          <p className="copyright-text" style={{ color: 'rgba(255,255,255,0.7)' }}>Maintained and built by OpenXpert Solutions LLC.</p>
         </div>
       </div>
     </footer>
diff --git a/src/components/sections/Header.jsx b/src/components/sections/Header.jsx
index 035b4d4..3f5bd6f 100644
--- a/src/components/sections/Header.jsx
+++ b/src/components/sections/Header.jsx
@@ -55,7 +55,7 @@ export default function Header() {
                         if (item.label === 'SERVICES') {
                           return (
                             <li key={item.path} className={`menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children${mobileServicesOpen ? ' th-active' : ''}${pathname.startsWith('/service') ? ' current-menu-item' : ''}`}>
-                              <a href="/service" onClick={(e) => { e.preventDefault(); setMobileServicesOpen(o => !o) }}>
+                               <a href="#" onClick={(e) => { e.preventDefault(); setMobileServicesOpen(o => !o) }}>
                                 SERVICES
                                 <span className="th-mean-expand"></span>
                               </a>
@@ -125,13 +125,14 @@ export default function Header() {
                       <div className="row align-items-start justify-content-between">
                         <div className="col-auto d-none d-lg-block">
                           <div className="header-logo">
-                            <a href="/"><img alt="logo_pe Rd Wh 70" src="/assets/images/logo_pe-Rd-Wh-70.png" /></a>
+                            <a href="/"><img alt="logo Pe Rd Wh 70" src="/assets/images/logo_pe-Rd-Wh-70.png" className="logo-top" /></a>
+                            <a href="/"><img alt="logo_pe new bk 70" src="/assets/images/logo_pe-new-bk-70.png" className="logo-sticky" /></a>
                           </div>
                         </div>
                         <div className="col">
                           <div className="menu-wrap">
                             <div className="header-logo d-block d-lg-none">
-                              <a href="/"><img alt="logo_pe new wh 70" src="/assets/images/logo_pe-new-wh-70.png" /></a>
+                              <a href="/"><img alt="logo_pe new bk 70" src="/assets/images/logo_pe-new-bk-70.png" /></a>
                             </div>
                             <nav className="main-menu d-none d-lg-inline-block">
                               <ul className="rakar-menu">
@@ -139,8 +140,8 @@ export default function Header() {
                                   if (item.label === 'SERVICES') {
                                     const isServiceActive = pathname.startsWith('/service')
                                     return (
-                                      <li key={item.path} className={`menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children${isServiceActive ? ' current-menu-item' : ''}`}>
-                                        <a href="/service" onClick={e => e.preventDefault()}>SERVICES</a>
+                                  <li key={item.path} className={`menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children${isServiceActive ? ' current-menu-item' : ''}`}>
+                                            <a href="#services" onClick={(e) => { e.preventDefault(); if (window.location.pathname !== '/' && !window.location.pathname.endsWith('/')) { window.location.href = '/#services'; } else { document.getElementById('services')?.scrollIntoView({ behavior: 'smooth' }); } }}>SERVICES</a>
                                         <ul className="sub-menu">
                                           {SERVICE_SUBITEMS.map(s => (
                                             <li key={s.slug} className={`menu-item${pathname === `/service/${s.slug}` ? ' current-menu-item' : ''}`}>
@@ -168,8 +169,11 @@ export default function Header() {
                         </div>
                         <div className="col-auto d-none d-xl-block">
                           <div className="header-button">
-                            <a href="http://promist.profen.openexplorer.xyz" target="_blank" rel="noopener noreferrer">
-                              <img src="/assets/images/Promist-Logo-1.png" alt="Promist" style={{ height: '40px' }} />
+                            <a href="https://promist.openexplorer.xyz" target="_blank" rel="noopener noreferrer" className="promist-btn">
+                              <span className="promist-logo">
+                                <img src="/assets/images/Promist-Logo-1.png" alt="Promist" />
+                              </span>
+                              <i className="far fa-arrow-right"></i>
                             </a>
                           </div>
                         </div>
diff --git a/src/css/dynamic.css b/src/css/dynamic.css
index d601535..37c91fd 100644
--- a/src/css/dynamic.css
+++ b/src/css/dynamic.css
@@ -22,7 +22,10 @@ img { max-width: 100%; height: auto; }
 .breadcumb-wrapper{background-repeat:no-repeat;background-position:center center;background-image:url('/assets/images/breadcumb-bg.jpg');background-size:cover;}
 .hero-inner{position:relative;background-color:var(--brand-dark, #101840);min-height:640px;}
 .hero-5 .hero-inner{min-height:720px;}
-.hero-inner::before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,0.7) 0%,rgba(0,0,0,0.3) 100%);z-index:1;pointer-events:none;}
+.hero-inner::before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,0.35) 0%,rgba(0,0,0,0.15) 100%);z-index:1;pointer-events:none;}
+.hero-promist::before{background:linear-gradient(90deg,rgba(0,0,0,0.2) 0%,rgba(0,0,0,0.08) 100%)!important;}
+.hero-heating::before{background:linear-gradient(90deg,rgba(0,0,0,0.2) 0%,rgba(0,0,0,0.08) 100%)!important;}
+.hero-ac::before{background:linear-gradient(90deg,rgba(0,0,0,0.5) 0%,rgba(0,0,0,0.25) 100%)!important;}
 .hero-inner .container{position:relative;z-index:2;}
 .hero-style5 .sub-title2.sub{color:#fff !important;}
 .hero-style5 .hero-title,.hero-style5 .hero-text{color:#fff !important;}
@@ -64,12 +67,51 @@ img { max-width: 100%; height: auto; }
   color: #fff;
 }
 
-.promist-btn { justify-content: center; }
-.promist-btn .promist-logo { transition: margin 0.3s; }
-.promist-btn .fa-arrow-right { opacity: 0; transition: opacity 0.3s; }
-.promist-btn:hover { background-color: #101840 !important; border-color: #101840 !important; }
-.promist-btn:hover .promist-logo { margin-right: 8px; }
-.promist-btn:hover .fa-arrow-right { opacity: 1; }
+/* ── NAVY CTA BUTTON (header) ── */
+.promist-btn {
+  justify-content: center;
+  display: inline-flex;
+  align-items: center;
+  gap: 0; /* override base gap so logo is perfectly centered at rest */
+  background-color: #ffffff;
+  color: #101840;
+  border: 2px solid transparent;
+  border-radius: 30px;
+  padding: 15px 15px;
+  position: relative;
+  font-family: var(--title-font);
+  font-size: 17px;
+  font-weight: 600;
+  line-height: 1.2;
+  text-decoration: none;
+  white-space: nowrap;
+  transition: transform 0.3s ease, background-color 0.3s ease, box-shadow 0.3s ease;
+}
+.promist-btn .promist-logo {
+  display: inline-flex;
+  align-items: center;
+  transition: margin 0.3s;
+}
+.promist-btn .promist-logo img {
+  height: 52px;
+  width: auto;
+  display: block;
+}
+.promist-btn .fa-arrow-right {
+  max-width: 0;
+  margin-left: 0;
+  opacity: 0;
+  overflow: hidden;
+  transform: translateX(-6px);
+  transition: max-width 0.35s ease, margin-left 0.35s ease, opacity 0.3s ease, transform 0.3s ease;
+}
+.promist-btn:hover .fa-arrow-right {
+  max-width: 22px;
+  margin-left: 10px;
+  opacity: 1;
+  transform: translateX(0);
+}
+.promist-btn:hover { border-color: #d1d5db; transform: translateY(-3px); box-shadow: 0 8px 20px rgba(16, 24, 64, 0.28); }
 
 /* Tab menu spacing */
 .tab-menu2 {
@@ -249,8 +291,8 @@ img { max-width: 100%; height: auto; }
 
 /* ── HERO: bigger Promist inline logo ── */
 .hero-style5 .hero-title img {
-  height: 48px !important;
-  width: auto !important;
+  height: 64px !important;
+  width: auto;
   vertical-align: middle;
 }
 
@@ -258,11 +300,9 @@ img { max-width: 100%; height: auto; }
 /* Left column is now always visible (d-none d-lg-block removed from JSX) */
 
 @media (max-width: 991px) {
-  .header-layout5 .header-top .row {
-    flex-direction: column;
-    align-items: center;
-    gap: 2px;
-  }
+.header-layout5 .header-top .row {
+  justify-content: center;
+}
   .header-top {
     padding: 8px 0 !important;
   }
@@ -342,11 +382,15 @@ img { max-width: 100%; height: auto; }
 /* ── NAV/TOP-BAR SPACING: tighten on mobile ── */
 @media (max-width: 767px) {
   .header-layout5 .header-top {
+    background: rgba(16, 25, 64, 0.95);
+    backdrop-filter: blur(10px);
     padding: 6px 0 !important;
   }
 }
 @media (max-width: 575px) {
   .header-top {
+    background: rgba(16, 25, 64, 0.95);
+    backdrop-filter: blur(10px);
     padding: 4px 0 !important;
   }
   .header-layout5 .header-logo {
@@ -399,7 +443,7 @@ img { max-width: 100%; height: auto; }
     font-size: 32px;
   }
   .hero-style5 .hero-title img {
-    height: 32px;
+    height: 32px !important;
     width: auto;
     vertical-align: middle;
   }
@@ -431,7 +475,7 @@ img { max-width: 100%; height: auto; }
     line-height: 1.3;
   }
   .hero-style5 .hero-title img {
-    height: 24px;
+    height: 30px !important;
   }
   .hero-style5 .hero-text {
     font-size: 13px;
@@ -590,11 +634,11 @@ img { max-width: 100%; height: auto; }
   }
 
   /* 3. Ensure menu-wrap flex guarantees hamburger on the right */
-  .header-layout5 .menu-wrap {
-    display: flex !important;
-    align-items: center !important;
-    justify-content: space-between !important;
-  }
+.header-layout5 .menu-wrap {
+  margin-left: 0;
+  width: 100%;
+  margin: 0 auto;
+}
 
   /* 4. Sidebar flyout: frosted glass effect */
   .th-menu-wrapper.th-body-visible .th-menu-area {
@@ -671,7 +715,7 @@ img { max-width: 100%; height: auto; }
 
   .service-block .box-icon img {
     max-width: 24px !important;
-    max-height: 24px !important;
+    max-height: 30px !important;
     width: auto !important;
     height: auto !important;
     display: inline-block !important;
@@ -829,15 +873,24 @@ img { max-width: 100%; height: auto; }
 }
 
 /* ══════════════════════════════════════════════════════════════
-   NEW SERVICE CARDS: image background with gradient overlay
+   NEW SERVICE CARDS: image on top, white text panel below
    — PC + mobile (global, not inside media query)
    ══════════════════════════════════════════════════════════════ */
 .service-block-new {
   position: relative;
   border-radius: 20px;
   overflow: hidden;
-  height: 280px;
+  background: #ffffff;
   cursor: pointer;
+  display: flex;
+  flex-direction: column;
+  height: 100%;
+}
+
+.service-block-new .service-media {
+  position: relative;
+  height: 220px;
+  overflow: hidden;
 }
 
 .service-block-new .service-bg {
@@ -845,58 +898,56 @@ img { max-width: 100%; height: auto; }
   height: 100%;
   object-fit: cover;
   display: block;
-  transition: transform 0.4s ease;
+  transition: transform 0.45s ease;
 }
 
+/* Image "pops": rises slightly on hover */
 .service-block-new:hover .service-bg {
-  transform: scale(1.05);
-}
-
-.service-block-new .service-overlay {
-  position: absolute;
-  inset: 0;
-  background: linear-gradient(
-    to top,
-    rgba(0, 0, 0, 0.9) 0%,
-    rgba(0, 0, 0, 0.5) 40%,
-    rgba(0, 0, 0, 0.1) 100%
-  );
-  pointer-events: none;
+  transform: scale(1.06) translateY(-4px);
 }
 
 .service-block-new .service-content {
-  position: absolute;
-  bottom: 0;
-  left: 0;
-  right: 0;
-  padding: 24px;
-  z-index: 2;
+  flex: 1;
+  padding: 24px 20px 26px;
+  background: #ffffff;
+  text-align: center;
+  display: flex;
+  align-items: center;
+  justify-content: center;
 }
 
 .service-block-new .service-title {
-  color: #ffffff;
+  color: #101840;
   font-size: 20px;
   font-weight: 700;
   margin: 0;
   line-height: 1.3;
+  /* reserve 2 lines so all cards (and rows) stay equal height */
+  min-height: 2.6em;
 }
 
 .service-block-new .service-title a {
-  color: #ffffff;
+  color: #101840;
   text-decoration: none;
+  display: block;
 }
 
 .service-block-new .service-title a:hover {
   color: #ED1C24;
 }
 
-/* ── Mobile overrides for new service cards ── */
+
+/* ── Mobile overrides for new service cards (2×4 grid) ── */
 @media (max-width: 767px) {
   .service-block-new {
-    height: 180px !important;
+    height: 100% !important;
     overflow: hidden !important;
     border-radius: 12px !important;
   }
+  .service-block-new .service-media {
+    height: 130px !important;
+    overflow: hidden !important;
+  }
   .service-block-new .service-bg {
     width: 100% !important;
     height: 100% !important;
@@ -904,33 +955,30 @@ img { max-width: 100%; height: auto; }
     object-position: center !important;
     display: block !important;
   }
-  .service-block-new .service-overlay {
-    background: linear-gradient(
-      to top,
-      rgba(0, 0, 0, 0.85) 0%,
-      rgba(0, 0, 0, 0.4) 40%,
-      rgba(0, 0, 0, 0) 70%
-    ) !important;
-  }
   .service-block-new .service-content {
-    padding: 12px !important;
-    z-index: 2 !important;
+    padding: 12px 10px !important;
+    background: #fff !important;
+    text-align: center !important;
+    display: flex !important;
+    align-items: center !important;
+    justify-content: center !important;
   }
   .service-block-new .service-title {
-    font-size: 11px !important;
+    font-size: 12px !important;
     line-height: 1.3 !important;
-    font-weight: 600 !important;
-    color: #fff !important;
-    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.6) !important;
+    font-weight: 700 !important;
+    color: #101840 !important;
+    text-shadow: none !important;
     display: -webkit-box !important;
     -webkit-line-clamp: 2 !important;
     -webkit-box-orient: vertical !important;
     overflow: hidden !important;
     text-overflow: ellipsis !important;
     margin: 0 !important;
+    min-height: 2.6em !important;
   }
   .service-block-new .service-title a {
-    color: #fff !important;
+    color: #101840 !important;
     text-decoration: none !important;
   }
   [data-id="148606f"] .row {
@@ -938,24 +986,13 @@ img { max-width: 100%; height: auto; }
   }
 }
 
-/* ── Service card text center ── */
-.service-block-new .service-content {
-  text-align: center !important;
-}
-
-.service-block-new .service-title a {
-  display: block !important;
-}
-
 /* ══════════════════════════════════════════════════════════════
-   STICKY NAVBAR: white frosted glass
+   STICKY NAVBAR: solid white
    - Overrides theme.css solid #0c0d0e bg
-   - White frosted + subtle shadow for PC view
+   - Solid white + subtle shadow for PC view
    ══════════════════════════════════════════════════════════════ */
 .sticky-wrapper.sticky {
-  background: rgba(255, 255, 255, 0.85) !important;
-  backdrop-filter: blur(20px) !important;
-  -webkit-backdrop-filter: blur(20px) !important;
+  background: #ffffff !important;
   box-shadow: 0 4px 30px rgba(0, 0, 0, 0.08) !important;
   border-bottom: 1px solid rgba(0, 0, 0, 0.05) !important;
 }
@@ -964,10 +1001,19 @@ img { max-width: 100%; height: auto; }
 .header-layout5 .sticky-wrapper.sticky .header-logo {
   background-color: transparent !important;
 }
+/* Logo swap: top logo = red/white, sticky logo = black */
+.logo-sticky { display: none; }
+.sticky-wrapper.sticky .logo-top { display: none; }
+.sticky-wrapper.sticky .logo-sticky { display: block; }
+
+/* Lighter border on the nav CTA when navbar is scrolled/sticky */
+.header-layout5 .sticky-wrapper.sticky .promist-btn {
+  border-color: #d1d5db;
+}
 
 /* ── HEADER BUTTON: bigger Promist logo in navbar ── */
-.header-layout5 .header-button img {
-  height: 40px !important;
+.header-layout5 .header-button .promist-btn .promist-logo img {
+  height: 30px !important;
   width: auto !important;
   display: block !important;
   margin: 0 auto !important;
@@ -1032,12 +1078,10 @@ img { max-width: 100%; height: auto; }
   background: transparent !important;
 }
 
-/* Make nav and menu elements transparent so frosted glass shows through */
-.sticky-wrapper.sticky .main-menu,
-.sticky-wrapper.sticky .main-menu ul,
-.sticky-wrapper.sticky .rakar-menu,
-.sticky-wrapper.sticky .rakar-menu li {
-  background: transparent !important;
+/* Keep Services dropdown solid when header is sticky
+   (prevents the transparent cascade from wiping the dropdown background) */
+.sticky-wrapper.sticky .header-layout5 .main-menu ul.sub-menu {
+  background: #101940 !important;
 }
 
 /* ══════════════════════════════════════════════════════════════