diff --git a/index.html b/index.html
index 5fef200..9696954 100644
--- a/index.html
+++ b/index.html
@@ -2,18 +2,17 @@
 <html lang="en-US">
     <head>
         <meta charset="utf-8" />
-        <meta http-equiv="X-UA-Compatible" content="IE=edge" />
         <meta name="viewport" content="width=device-width, initial-scale=1" />
         <meta
             name="description"
-            content="Explore reliable Odoo hosting and expert AI consulting. We provide secure, scalable solutions and intelligent automation to enhance business efficiency and growth."
+            content="Explore reliable Odoo hosting and expert AI consulting."
         />
         <title>ODOO4projects | Hosting for the AI generation</title>
-        <link rel="icon" type="image/x-icon" href="images/favicon.ico" />
+        <link rel="icon" href="images/favicon.ico" />
         <link rel="preconnect" href="https://fonts.googleapis.com" />
         <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
         <link
-            href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Inter+Tight:wght@300;400;500;600;700&display=swap"
+            href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Inter+Tight:wght@500;600;700;800&display=swap"
             rel="stylesheet"
         />
         <link
@@ -21,51 +20,36 @@
             href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css"
         />
         <style>
-            /* === CSS Reset & Base === */
-            *,
-            *::before,
-            *::after {
+            * {
                 box-sizing: border-box;
             }
-            html {
-                scroll-behavior: smooth;
-            }
             body {
                 margin: 0;
-                font-family: "Inter", sans-serif;
-                font-size: 1rem;
-                font-weight: 400;
-                line-height: 1.5;
+                font-family: Inter, sans-serif;
+                font-size: 0.8rem;
+                line-height: 1.6;
                 color: #212529;
-                background-color: #ffffff;
-                -webkit-font-smoothing: antialiased;
+                background: #fff;
             }
             h1,
             h2,
-            h3,
-            h4,
-            h5,
-            h6 {
-                font-family: "Inter Tight", sans-serif;
-                font-weight: 500;
-                line-height: 1.2;
+            h3 {
+                font-family:
+                    Inter Tight,
+                    sans-serif;
+                font-weight: 600;
+                line-height: 1.25;
                 margin-top: 0;
                 margin-bottom: 0.5rem;
             }
             h1 {
-                font-size: clamp(2rem, 5vw, 3rem);
+                font-size: clamp(1.44rem, 3.2vw, 2.24rem);
             }
             h2 {
-                font-size: clamp(1.6rem, 4vw, 2.5rem);
+                font-size: clamp(1.2rem, 2.56vw, 1.76rem);
             }
             h3 {
-                font-size: clamp(1.3rem, 3vw, 2rem);
-            }
-            h4 {
-                font-size: 1.5rem;
-            }
-            h5 {
-                font-size: 1.25rem;
+                font-size: clamp(0.96rem, 2vw, 1.28rem);
             }
             p {
                 margin-top: 0;
@@ -75,108 +59,65 @@
                 color: #65435c;
                 text-decoration: none;
             }
-            a:hover {
-                color: #372432;
-                text-decoration: underline;
-            }
             img {
                 max-width: 100%;
                 height: auto;
                 vertical-align: middle;
             }
-            ul {
-                padding-left: 2rem;
-                margin-top: 0;
-                margin-bottom: 1rem;
+            :root {
+                --primary: #714b67;
+                --secondary: #f0cda8;
+                --dark: #1b1319;
+                --light: #f6f5f4;
+                --border: #e5e3e0;
+                --radius: 0.6rem;
+                --radius-lg: 1rem;
             }
             .container {
-                width: 100%;
-                padding-right: 15px;
-                padding-left: 15px;
-                margin-right: auto;
-                margin-left: auto;
+                width: 80%;
+                padding: 0 20px;
+                margin: 0 auto;
+                max-width: 1300px;
             }
-            @media (min-width: 576px) {
+            @media (max-width: 768px) {
                 .container {
-                    max-width: 540px;
-                }
-            }
-            @media (min-width: 768px) {
-                .container {
-                    max-width: 720px;
-                }
-            }
-            @media (min-width: 992px) {
-                .container {
-                    max-width: 960px;
-                }
-            }
-            @media (min-width: 1200px) {
-                .container {
-                    max-width: 1140px;
-                }
-            }
-            @media (min-width: 1400px) {
-                .container {
-                    max-width: 1320px;
+                    max-width: 100%;
                 }
             }
             .row {
                 display: flex;
                 flex-wrap: wrap;
-                margin-right: -15px;
-                margin-left: -15px;
-            }
-            .col {
-                flex: 1 0 0%;
-            }
-            .col-12 {
-                flex: 0 0 auto;
-                width: 100%;
-            }
-            .col-lg-2 {
-                flex: 0 0 auto;
-                width: 16.66666667%;
-            }
-            .col-lg-3 {
-                flex: 0 0 auto;
-                width: 25%;
-            }
-            .col-lg-4 {
-                flex: 0 0 auto;
-                width: 33.33333333%;
+                margin: 0 -15px;
             }
             .col-lg-5 {
-                flex: 0 0 auto;
-                width: 41.66666667%;
+                flex: 0 0 41.666%;
+                max-width: 41.666%;
+                padding: 0 15px;
             }
             .col-lg-6 {
-                flex: 0 0 auto;
-                width: 50%;
-            }
-            .col-lg-7 {
-                flex: 0 0 auto;
-                width: 58.33333333%;
-            }
-            .col-lg-8 {
-                flex: 0 0 auto;
-                width: 66.66666667%;
+                flex: 0 0 50%;
+                max-width: 50%;
+                padding: 0 15px;
             }
             .col-lg-10 {
-                flex: 0 0 auto;
-                width: 83.33333333%;
+                flex: 0 0 83.333%;
+                max-width: 83.333%;
+                padding: 0 15px;
             }
-            .col-lg-12 {
-                flex: 0 0 auto;
-                width: 100%;
+            .offset-lg-1 {
+                margin-left: 8.333%;
             }
             .offset-lg-6 {
                 margin-left: 50%;
             }
-            @media (max-width: 991.98px) {
-                [class*="col-lg-"] {
-                    width: 100%;
+            @media (max-width: 992px) {
+                .col-lg-5,
+                .col-lg-6,
+                .col-lg-10 {
+                    flex: 0 0 100%;
+                    max-width: 100%;
                 }
+                .offset-lg-1,
                 .offset-lg-6 {
                     margin-left: 0;
                 }
@@ -184,49 +125,41 @@
             .text-center {
                 text-align: center;
             }
-            .text-start {
-                text-align: left;
+            .d-none {
+                display: none !important;
             }
-            .text-end {
-                text-align: right;
+            .d-flex {
+                display: flex;
             }
-
-            /* === Colors / Theme === */
-            :root {
-                --primary: #714b67;
-                --primary-dark: #5a3c52;
-                --secondary: #f0cda8;
-                --dark: #1b1319;
-                --light: #f6f5f4;
-                --white: #ffffff;
-                --body-color: #212529;
-                --border-color: #dee2e6;
+            .align-items-center {
+                align-items: center;
+            }
+            .mb-4 {
+                margin-bottom: 1.5rem;
+            }
+            .mt-3 {
+                margin-top: 1rem;
             }
-
-            /* === Buttons === */
             .btn {
                 display: inline-block;
-                padding: 0.375rem 1rem;
-                font-size: 1rem;
-                font-weight: 400;
-                line-height: 1.5;
-                text-align: center;
-                vertical-align: middle;
-                cursor: pointer;
+                padding: 0.5rem 1.3rem;
+                font-size: 0.72rem;
+                font-weight: 500;
                 border: 1px solid transparent;
-                border-radius: 0.4rem;
-                transition: all 0.15s ease-in-out;
+                border-radius: 0.5rem;
+                cursor: pointer;
                 text-decoration: none;
+                transition: all 0.2s;
             }
             .btn-primary {
-                color: #ffffff;
-                background-color: var(--primary);
+                color: #fff;
+                background: var(--primary);
                 border-color: var(--primary);
             }
             .btn-primary:hover {
-                color: #ffffff;
-                background-color: #604058;
-                border-color: #5a3c52;
+                background: #5e3f55;
+                border-color: #5e3f55;
+                transform: translateY(-1px);
             }
             .btn-outline-primary {
                 color: #65435c;
@@ -234,160 +167,29 @@
                 background: transparent;
             }
             .btn-outline-primary:hover {
-                color: #ffffff;
-                background-color: #65435c;
+                color: #fff;
+                background: #65435c;
                 border-color: #65435c;
             }
             .btn-lg {
-                padding: 1rem 2.5rem;
-                font-size: 1.25rem;
+                padding: 0.75rem 2rem;
+                font-size: 0.84rem;
                 border-radius: 2rem;
             }
-            .btn-sm {
-                padding: 0.0625rem 0.5rem;
-                font-size: 0.875rem;
+            .hr {
+                width: 3.5rem;
+                height: 3px;
+                background: linear-gradient(
+                    90deg,
+                    var(--primary),
+                    var(--secondary)
+                );
+                border-radius: 2px;
+                margin: 0 auto 1rem;
             }
-            .w-100 {
-                width: 100%;
-            }
-            .mb-2 {
-                margin-bottom: 0.5rem;
-            }
-            .mb-3 {
-                margin-bottom: 1rem;
-            }
-            .mb-4 {
-                margin-bottom: 1.5rem;
-            }
-            .mt-2 {
-                margin-top: 0.5rem;
-            }
-            .mt-3 {
-                margin-top: 1rem;
-            }
-            .mt-4 {
-                margin-top: 1.5rem;
-            }
-            .my-2 {
-                margin-top: 0.5rem;
-                margin-bottom: 0.5rem;
-            }
-            .py-3 {
-                padding-top: 1rem;
-                padding-bottom: 1rem;
-            }
-            .pt-4 {
-                padding-top: 1.5rem;
-            }
-            .pb-4 {
-                padding-bottom: 1.5rem;
-            }
-            .pt-5 {
-                padding-top: 3rem;
-            }
-            .pb-5 {
-                padding-bottom: 3rem;
-            }
-            .pt-0 {
-                padding-top: 0;
-            }
-            .pb-0 {
-                padding-bottom: 0;
-            }
-            .gap-2 {
-                gap: 0.5rem;
-            }
-            .gap-3 {
-                gap: 1rem;
-            }
-            .gap-4 {
-                gap: 1.5rem;
-            }
-            .d-flex {
-                display: flex;
-            }
-            .flex-column {
-                flex-direction: column;
-            }
-            .flex-wrap {
-                flex-wrap: wrap;
-            }
-            .align-items-center {
-                align-items: center;
-            }
-            .justify-content-center {
-                justify-content: center;
-            }
-            .justify-content-between {
-                justify-content: space-between;
-            }
-            .h-100 {
-                height: 100%;
-            }
-            .small {
-                font-size: 0.875em;
-            }
-            .text-muted {
-                color: rgba(33, 37, 41, 0.7);
-            }
-            .text-white {
-                color: #ffffff;
-            }
-            .bg-light {
-                background-color: var(--light);
-            }
-            .bg-dark {
-                background-color: var(--dark);
-                color: #ffffff;
-            }
-            .bg-primary {
-                background-color: var(--primary);
-                color: #ffffff;
-            }
-            .list-unstyled {
-                padding-left: 0;
-                list-style: none;
-            }
-            .list-group {
-                display: flex;
-                flex-direction: column;
-                padding-left: 0;
-                margin-bottom: 0;
-            }
-            .list-group-item {
-                position: relative;
-                display: block;
-                padding: 0.5rem 0;
-                background: transparent;
-                border: 0;
-                color: inherit;
-            }
-            .list-group-flush .list-group-item {
-                border-width: 0;
-            }
-            .fa,
-            .fas,
-            .far {
-                display: inline-block;
-            }
-            .fa-check {
-                color: #28a745;
-            }
-            .fa-times {
-                color: #dc3545;
-            }
-            hr {
-                margin: 1rem 0;
-                border: 0;
-                border-top: 1px solid var(--border-color);
-                opacity: 1;
-            }
-
-            /* ========== TOP SPINNER / HERO CAROUSEL ========== */
             .hero-carousel {
                 position: relative;
                 overflow: hidden;
-                min-height: 400px;
             }
             .hero-slide {
                 position: relative;
@@ -396,180 +198,158 @@
                 align-items: center;
                 background-size: cover;
                 background-position: center;
-                background-repeat: no-repeat;
+                transition: opacity 0.5s ease;
             }
             .hero-slide::before {
                 content: "";
                 position: absolute;
                 inset: 0;
-                background: rgba(0, 0, 0, 0.45);
+                background: linear-gradient(
+                    110deg,
+                    rgba(27, 19, 25, 0.7) 0%,
+                    rgba(27, 19, 25, 0.15) 100%
+                );
             }
-            .hero-content {
+            .hero-box {
                 position: relative;
                 z-index: 2;
                 padding: 1.5rem;
-                border-radius: 0.4rem;
+                border-radius: var(--radius);
+                background: rgba(27, 19, 25, 0.75);
+                color: #fff;
+                border: 1px solid rgba(255, 255, 255, 0.08);
             }
-            .hero-content.dark-box {
-                background-color: rgba(27, 19, 25, 0.82);
-                color: #ffffff;
+            .hero-box h2 {
+                color: #fff;
+                font-size: clamp(1rem, 2.2vw, 1.4rem);
+                margin-bottom: 0.3rem;
             }
-            .hero-content h2 {
-                color: #ffffff;
-                font-size: clamp(1.2rem, 2.5vw, 1.6rem);
-                margin-bottom: 0.35rem;
-            }
-            .hero-content p {
-                font-size: 0.95rem;
+            .hero-box p {
+                color: rgba(255, 255, 255, 0.9);
+                font-size: 0.75rem;
                 margin-bottom: 0.5rem;
             }
-            .hero-content .lead {
-                font-size: 1rem;
-                font-weight: 300;
-            }
-            .btn-custom {
-                color: #ffffff;
-                background-color: #604058;
-                border: 1px solid #5a3c52;
-            }
-            .btn-custom:hover {
-                color: #ffffff;
-                background-color: #4f3350;
-            }
-
-            /* Carousel controls */
-            .carousel-controls {
+            .carousel-dots {
                 position: absolute;
                 bottom: 1rem;
                 left: 0;
                 right: 0;
                 display: flex;
                 justify-content: center;
-                align-items: center;
                 gap: 0.5rem;
                 z-index: 3;
-                pointer-events: none;
             }
             .carousel-dot {
-                width: 12px;
-                height: 12px;
+                width: 10px;
+                height: 10px;
                 border-radius: 50%;
-                border: 2px solid #ffffff;
+                border: 2px solid rgba(255, 255, 255, 0.7);
                 background: transparent;
                 cursor: pointer;
-                pointer-events: auto;
                 transition: all 0.3s;
             }
             .carousel-dot.active {
-                background: #ffffff;
-                transform: scale(1.2);
+                background: #fff;
+                transform: scale(1.3);
+                border-color: #fff;
             }
-            .carousel-arrow {
+            .arrow {
                 position: absolute;
                 top: 50%;
                 transform: translateY(-50%);
                 z-index: 3;
-                background: rgba(0, 0, 0, 0.3);
-                color: #ffffff;
+                background: rgba(27, 19, 25, 0.5);
+                color: #fff;
                 border: none;
-                width: 3rem;
-                height: 3rem;
+                width: 2.5rem;
+                height: 2.5rem;
                 border-radius: 50%;
                 cursor: pointer;
-                font-size: 1.2rem;
                 display: flex;
                 align-items: center;
                 justify-content: center;
-                transition: background 0.3s;
+                transition: all 0.2s;
             }
-            .carousel-arrow:hover {
-                background: rgba(0, 0, 0, 0.6);
+            .arrow:hover {
+                background: rgba(27, 19, 25, 0.8);
+                transform: translateY(-50%) scale(1.05);
             }
-            .carousel-arrow.prev {
+            .arrow.left {
                 left: 1rem;
             }
-            .carousel-arrow.next {
+            .arrow.right {
                 right: 1rem;
             }
-            @media (max-width: 767.98px) {
-                .carousel-arrow {
+            @media (max-width: 768px) {
+                .arrow {
                     display: none;
                 }
             }
-
-            /* ========== SECTION TITLE ========== */
-            .section-title {
+            .stitle {
                 text-align: center;
                 padding: 2rem 0;
             }
-            .section-title h1 {
-                font-size: clamp(1.3rem, 2.8vw, 1.8rem);
+            .stitle h1 {
+                font-size: clamp(1.12rem, 2.4vw, 1.6rem);
                 max-width: 720px;
                 margin: 0 auto;
+                color: var(--dark);
             }
-
-            /* ========== TABS / PROCESS SECTION ========== */
             .tabs-section {
                 padding: 2rem 0;
-                background: var(--white);
             }
-            .tabs-section .container,
-            .pricing-section .container,
-            .trial-banner .container,
-            .affiliate-banner .container,
-            .footer .container {
-                max-width: 1140px;
-            }
-            .section-title .container {
-                max-width: 960px;
-            }
-            .tabs-wrapper {
+            .tabs-wrap {
                 display: flex;
                 gap: 2rem;
             }
             .tabs-nav {
-                flex: 0 0 25%;
-                max-width: 25%;
+                flex: 0 0 220px;
+                max-width: 220px;
                 display: flex;
                 flex-direction: column;
-                gap: 0.5rem;
+                gap: 0.25rem;
             }
             .tabs-content {
-                flex: 0 0 75%;
-                max-width: 75%;
-                min-height: 300px;
+                flex: 1;
+                min-height: 200px;
+                font-size: 0.84rem;
+                line-height: 1.7;
             }
-            .tab-link {
+            .tab-btn {
                 display: block;
-                padding: 0.75rem 1rem;
-                color: var(--body-color);
-                text-decoration: none;
-                border-radius: 0.4rem;
-                transition: all 0.15s;
+                padding: 0.6rem 1rem;
+                color: #212529;
+                border-radius: var(--radius);
                 border: none;
                 background: none;
                 width: 100%;
                 text-align: left;
-                font-size: 1rem;
+                font-size: 0.76rem;
+                font-weight: 500;
                 cursor: pointer;
+                transition: all 0.2s;
             }
-            .tab-link:hover {
-                background: rgba(0, 0, 0, 0.03);
-                text-decoration: none;
+            .tab-btn:hover {
+                background: var(--light);
             }
-            .tab-link.active {
-                background: transparent;
+            .tab-btn.active {
+                background: linear-gradient(
+                    135deg,
+                    rgba(113, 75, 103, 0.08),
+                    rgba(113, 75, 103, 0.03)
+                );
                 color: var(--primary);
                 font-weight: 600;
+                border-left: 3px solid var(--primary);
             }
-            .tab-link small {
+            .tab-btn small {
                 display: block;
-                color: rgba(33, 37, 41, 0.6);
-                font-weight: 400;
-                font-size: 0.8rem;
+                color: rgba(33, 37, 41, 0.55);
+                font-size: 0.64rem;
+                margin-top: 0.1rem;
             }
-            .tab-link.active small {
-                color: rgba(113, 75, 103, 0.7);
+            .tab-btn.active small {
+                color: rgba(113, 75, 103, 0.6);
             }
             .tab-pane {
                 display: none;
@@ -577,232 +357,248 @@
             .tab-pane.active {
                 display: block;
             }
-            .tab-pane h3 {
-                margin-bottom: 1.5rem;
-            }
-            @media (max-width: 991.98px) {
-                .tabs-wrapper {
+            @media (max-width: 992px) {
+                .tabs-wrap {
                     flex-direction: column;
                 }
-                .tabs-nav,
+                .tabs-nav {
+                    flex: 0 0 100%;
+                    max-width: 100%;
+                    flex-direction: row;
+                    overflow-x: auto;
+                    padding-bottom: 0.5rem;
+                    border-bottom: 1px solid var(--border);
+                }
+                .tab-btn {
+                    white-space: nowrap;
+                    width: auto;
+                    border-left: none;
+                }
+                .tab-btn.active {
+                    border-left: none;
+                    border-bottom: 3px solid var(--primary);
+                }
+                .tab-btn small {
+                    display: none;
+                }
                 .tabs-content {
                     flex: 0 0 100%;
                     max-width: 100%;
                 }
-                .tabs-nav {
-                    flex-direction: row;
-                    overflow-x: auto;
-                    padding-bottom: 0.5rem;
-                    border-bottom: 1px solid var(--border-color);
-                }
-                .tab-link {
-                    white-space: nowrap;
-                    width: auto;
-                }
-                .tab-link small {
-                    display: none;
-                }
             }
-
-            /* ========== PRICING / PLANS ========== */
-            .pricing-section {
+            .psection {
                 padding: 2rem 0;
-                background: var(--white);
+                background: var(--light);
             }
-            .pricing-grid {
+            .pgrid {
                 display: grid;
                 grid-template-columns: repeat(4, 1fr);
-                gap: 1.5rem;
+                gap: 1rem;
             }
-            .pricing-card {
-                background: var(--white);
-                border: 1px solid var(--border-color);
-                border-radius: 0.4rem;
+            .pcard {
+                background: #fff;
+                border: 1px solid var(--border);
+                border-radius: var(--radius-lg);
                 overflow: hidden;
                 display: flex;
                 flex-direction: column;
-                height: 100%;
+                transition: all 0.3s;
+                box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
             }
-            .pricing-card.featured {
-                border-width: 5px;
-                border-style: dashed;
-                border-color: var(--border-color);
+            .pcard:hover {
+                box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
+                transform: translateY(-3px);
             }
-            .pricing-card-body {
-                padding: 1rem;
+            .pcard.featured {
+                border: 2px solid var(--primary);
+                position: relative;
+            }
+            .pcard.featured::before {
+                content: "Most Popular";
+                position: absolute;
+                top: 0.75rem;
+                right: 0.75rem;
+                background: var(--primary);
+                color: #fff;
+                padding: 0.2rem 0.6rem;
+                border-radius: 2rem;
+                font-size: 0.6rem;
+                font-weight: 600;
+            }
+            .pcard-body {
+                padding: 1.25rem;
                 flex: 1;
             }
-            .pricing-card-body h3 {
-                font-size: 1.25rem;
+            .pcard-body h3 {
+                font-size: 0.92rem;
+                font-weight: 700;
             }
-            .pricing-card .price {
+            .pcard .price {
                 margin: 0.5rem 0;
             }
-            .pricing-card .price strong {
-                font-size: clamp(1.5rem, 2.5vw, 2.5rem);
+            .pcard .price strong {
+                font-size: clamp(1.28rem, 2vw, 1.92rem);
+                color: var(--dark);
             }
-            .pricing-card .price small {
-                color: rgba(33, 37, 41, 0.7);
+            .pcard .price small {
+                color: rgba(33, 37, 41, 0.55);
+                font-size: 0.68rem;
             }
-            .pricing-card .card-text {
-                font-size: 0.875rem;
-                min-height: 3rem;
+            .pcard .desc {
+                font-size: 0.68rem;
+                color: rgba(33, 37, 41, 0.6);
+                min-height: 2rem;
+                font-style: italic;
             }
-            .pricing-card .btn {
-                margin-bottom: 1rem;
+            .pcard .btn {
+                margin-bottom: 0.75rem;
+                width: 100%;
             }
-            .pricing-card ul {
+            .pcard ul {
                 list-style: none;
                 padding: 0;
                 margin: 0;
             }
-            .pricing-card ul li {
-                padding: 0.5rem 0;
-                border-bottom: 1px solid var(--border-color);
-                font-size: 0.9rem;
+            .pcard li {
+                padding: 0.4rem 0;
+                font-size: 0.68rem;
+                border-bottom: 1px solid rgba(0, 0, 0, 0.05);
+                display: flex;
+                align-items: center;
+                gap: 0.4rem;
             }
-            .pricing-card ul li:last-child {
+            .pcard li:last-child {
                 border-bottom: 0;
             }
-            .pricing-card ul li i {
-                width: 1.2rem;
-            }
-            .pricing-card-footer {
-                padding: 0.75rem 1rem;
+            .pcard-foot {
+                padding: 0.6rem 1.25rem;
                 text-align: center;
-                border-top: 1px solid var(--border-color);
-                font-size: 0.875rem;
+                border-top: 1px solid var(--border);
+                font-size: 0.64rem;
+                color: rgba(33, 37, 41, 0.55);
             }
-            @media (max-width: 991.98px) {
-                .pricing-grid {
+            @media (max-width: 992px) {
+                .pgrid {
                     grid-template-columns: repeat(2, 1fr);
                 }
             }
-            @media (max-width: 575.98px) {
-                .pricing-grid {
+            @media (max-width: 576px) {
+                .pgrid {
                     grid-template-columns: 1fr;
                 }
             }
-
-            /* ========== TRIAL BANNER ========== */
-            .trial-banner {
+            .trial {
                 padding: 3rem 0;
-                background-color: var(--dark);
-                color: #ffffff;
-                position: relative;
-                overflow: hidden;
+                background: linear-gradient(135deg, #1b1319, #2a1d27);
+                color: #fff;
             }
-            .trial-banner::before {
-                content: "";
-                position: absolute;
-                bottom: 0;
-                left: 0;
-                right: 0;
-                height: 150px;
-                background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 150' preserveAspectRatio='none'%3E%3Cpath d='M0,150 C300,0 600,150 1200,0 L1200,150 Z' fill='%23F6F5F4'/%3E%3C/svg%3E")
-                    no-repeat bottom;
-                background-size: cover;
-                pointer-events: none;
+            .trial h2 {
+                color: #fff;
             }
-            .trial-banner .container {
-                position: relative;
-                z-index: 2;
+            .trial p {
+                color: rgba(255, 255, 255, 0.8);
+            }
+            .abanner {
+                padding: 2rem 0;
+                text-align: center;
+                background: #fff;
+            }
+            .abanner h2 {
+                font-size: clamp(1.12rem, 2.4vw, 1.6rem) !important;
+                max-width: 700px;
+                margin: 0 auto 0.5rem;
             }
-
-            /* ========== FOOTER ========== */
             .footer {
-                background-color: var(--light);
-                color: var(--body-color);
+                background: var(--dark);
+                color: rgba(255, 255, 255, 0.85);
                 padding-top: 3rem;
             }
-            .footer-grid {
+            .fgrid {
                 display: grid;
-                grid-template-columns: 2fr 4fr 5fr;
+                grid-template-columns: 1.5fr 3fr 3.5fr;
                 gap: 2rem;
-                padding-bottom: 3rem;
-                border-bottom: 1px solid var(--border-color);
+                padding-bottom: 2rem;
+                border-bottom: 1px solid rgba(255, 255, 255, 0.08);
             }
             .footer h5 {
-                color: var(--dark);
-                margin-bottom: 1rem;
+                color: #fff;
+                margin-bottom: 0.8rem;
+                font-weight: 600;
             }
-            .footer ul li {
-                margin-bottom: 0.25rem;
+            .footer ul {
+                list-style: none;
+                padding: 0;
             }
-            .footer ul li a {
-                color: #583b51;
+            .footer li {
+                margin-bottom: 0.3rem;
             }
-            .footer ul li a:hover {
-                color: #432c3d;
+            .footer a {
+                color: rgba(255, 255, 255, 0.65);
+                transition: color 0.2s;
             }
-            .footer .social-links a {
+            .footer a:hover {
+                color: #fff;
+                text-decoration: none;
+            }
+            .footer p {
+                color: rgba(255, 255, 255, 0.7);
+                font-size: 0.72rem;
+                line-height: 1.7;
+            }
+            .footer strong {
+                color: #fff;
+            }
+            .footer .social a {
                 display: inline-flex;
                 align-items: center;
                 justify-content: center;
                 width: 2.5rem;
                 height: 2.5rem;
                 border-radius: 50%;
-                background: rgba(0, 0, 0, 0.05);
-                color: #583b51;
-                margin-right: 0.25rem;
-                transition: background 0.15s;
+                background: rgba(255, 255, 255, 0.08);
+                color: rgba(255, 255, 255, 0.7);
+                margin-right: 0.3rem;
+                transition: all 0.2s;
             }
-            .footer .social-links a:hover {
-                background: rgba(0, 0, 0, 0.1);
-                text-decoration: none;
+            .footer .social a:hover {
+                background: var(--primary);
+                color: #fff;
             }
-            .footer-form input {
-                display: block;
-                width: 100%;
-                padding: 0.375rem 0.75rem;
-                font-size: 1rem;
-                border: 1px solid var(--border-color);
-                border-radius: 0.4rem;
-                margin-bottom: 0.75rem;
-            }
-            .footer-form label {
+            .fform label {
                 font-weight: 500;
                 margin-bottom: 0.25rem;
                 display: block;
+                color: #fff;
             }
-            .footer-copyright {
+            .fform input {
+                display: block;
+                width: 100%;
+                padding: 0.5rem 0.8rem;
+                font-size: 0.72rem;
+                background: rgba(255, 255, 255, 0.08);
+                border: 1px solid rgba(255, 255, 255, 0.12);
+                border-radius: 0.5rem;
+                color: #fff;
+                margin-bottom: 0.75rem;
+            }
+            .fform input:focus {
+                outline: none;
+                border-color: var(--primary);
+            }
+            .fform input::placeholder {
+                color: rgba(255, 255, 255, 0.35);
+            }
+            .fcopy {
                 padding: 1rem 0;
-                display: flex;
-                justify-content: space-between;
-                align-items: center;
-                flex-wrap: wrap;
-                gap: 0.5rem;
-                font-size: 0.875rem;
+                text-align: center;
+                font-size: 0.68rem;
+                color: rgba(255, 255, 255, 0.5);
             }
-            @media (max-width: 991.98px) {
-                .footer-grid {
+            @media (max-width: 992px) {
+                .fgrid {
                     grid-template-columns: 1fr;
                 }
             }
-
-            /* ========== AFFILIATE BANNER ========== */
-            .affiliate-banner {
-                padding: 2rem 0;
-                text-align: center;
-            }
-            .affiliate-banner h2 {
-                font-size: clamp(1.3rem, 2.8vw, 1.8rem) !important;
-            }
-
-            /* ========== UTILITIES ========== */
-            .d-none {
-                display: none;
-            }
-            .d-block {
-                display: block;
-            }
-            @media (max-width: 767.98px) {
-                .d-sm-none {
-                    display: none;
-                }
-            }
-
-            /* Simple spinner overlay for carousel images */
             .spinner-overlay {
                 position: absolute;
                 inset: 0;
@@ -810,7 +606,6 @@
                 align-items: center;
                 justify-content: center;
                 background: var(--dark);
-                color: #ffffff;
                 z-index: 5;
                 transition: opacity 0.5s;
             }
@@ -821,8 +616,8 @@
             .spinner {
                 width: 2rem;
                 height: 2rem;
-                border: 3px solid rgba(255, 255, 255, 0.3);
-                border-top-color: #ffffff;
+                border: 3px solid rgba(255, 255, 255, 0.15);
+                border-top-color: #fff;
                 border-radius: 50%;
                 animation: spin 0.8s linear infinite;
             }
@@ -834,35 +629,39 @@
         </style>
     </head>
     <body>
-        <!-- ============ HERO / CAROUSEL ============ -->
-        <section class="hero-carousel" id="heroCarousel">
-            <!-- Spinner overlay while images load -->
-            <div class="spinner-overlay" id="spinnerOverlay">
+        <div class="hero-carousel" id="hc">
+            <div class="spinner-overlay" id="spinner">
                 <div style="text-align: center">
                     <div class="spinner" style="margin: 0 auto 1rem"></div>
-                    <p style="margin: 0">Loading&hellip;</p>
+                    <p
+                        style="
+                            margin: 0;
+                            font-size: 0.7rem;
+                            color: rgba(255, 255, 255, 0.6);
+                        "
+                    >
+                        Loading&hellip;
+                    </p>
                 </div>
             </div>
 
             <div
                 class="hero-slide"
                 style="background-image: url(&quot;images/holland.webp&quot;)"
-                data-slide="0"
+                data-idx="0"
             >
                 <div class="container">
                     <div class="row">
                         <div class="col-lg-6 offset-lg-6">
-                            <div class="hero-content dark-box">
-                                <h2>Try ODOO&nbsp;4 weeks for free</h2>
+                            <div class="hero-box">
+                                <h2>Try ODOO 4 weeks for free</h2>
                                 <p>
                                     Curious about Odoo 19 or testing our
                                     service? Explore everything with a 4-week
-                                    free trial&mdash;no credit card required!
+                                    free trial &mdash; no credit card required!
                                 </p>
                                 <p>
-                                    <a
-                                        class="btn btn-primary mb-2"
-                                        href="/contactus"
+                                    <a class="btn btn-primary" href="/contactus"
                                         >Try Now</a
                                     >
                                 </p>
@@ -878,19 +677,12 @@
                     background-image: url(&quot;images/brazil.webp&quot;);
                     background-position: 50% 100%;
                 "
-                data-slide="1"
+                data-idx="1"
             >
                 <div class="container">
                     <div class="row">
                         <div class="col-lg-10">
-                            <div
-                                class="hero-content"
-                                style="
-                                    background-color: rgba(27, 19, 25, 0.75);
-                                    padding: 1.5rem;
-                                    border-radius: 0.4rem;
-                                "
-                            >
+                            <div class="hero-box">
                                 <h2>
                                     Startup challenge!<br />From Zero to ERP in
                                     3 Month
@@ -898,13 +690,13 @@
                                 <p>
                                     With our consulting and training partners
                                     over at OD8N we offer a compelling hands on
-                                    workshop<br />for startups. Our ODOO 19 and
-                                    N8N hosting
+                                    workshop for startups. Our ODOO 19 and N8N
+                                    hosting
                                     <strong>included for a year</strong>.
                                 </p>
                                 <p>
                                     <a
-                                        class="btn btn-custom"
+                                        class="btn btn-primary"
                                         href="/odoo-erp-automation-bootcamp"
                                         >More Info</a
                                     >
@@ -918,27 +710,21 @@
             <div
                 class="hero-slide d-none"
                 style="background-image: url(&quot;images/india.webp&quot;)"
-                data-slide="2"
+                data-idx="2"
             >
                 <div class="container">
                     <div class="row">
                         <div class="col-lg-6 offset-lg-6">
-                            <div
-                                class="hero-content"
-                                style="
-                                    background-color: rgba(0, 0, 0, 0.56);
-                                    text-align: center;
-                                "
-                            >
+                            <div class="hero-box" style="text-align: center">
                                 <h2>Turn Your Network into Income</h2>
                                 <hr
                                     style="
-                                        width: 25%;
+                                        width: 3rem;
                                         margin: 0.5rem auto;
-                                        border-color: rgba(255, 255, 255, 0.5);
+                                        border-color: rgba(255, 255, 255, 0.2);
                                     "
                                 />
-                                <p class="lead">
+                                <p>
                                     Promote AI-powered tools and hosting
                                     solutions your audience already loves
                                     &mdash; earn up to 25% commissions with
@@ -964,22 +750,18 @@
                     background-image: url(&quot;images/england.webp&quot;);
                     background-position: 50% 15.6182%;
                 "
-                data-slide="3"
+                data-idx="3"
             >
                 <div class="container">
                     <div class="row">
                         <div class="col-lg-6">
-                            <div
-                                class="hero-content"
-                                style="background-color: rgba(27, 19, 25, 0.78)"
-                            >
+                            <div class="hero-box">
                                 <h2>Supercharge ODOO with N8N Automations</h2>
                                 <p>
-                                    Copy our automated invoice
-                                    workflow&mdash;generate invoices with
-                                    payment links in ODOO instantly. Just set up
-                                    a server and our modules, and you&rsquo;re
-                                    ready to go.
+                                    Copy our automated invoice workflow &mdash;
+                                    generate invoices with payment links in ODOO
+                                    instantly. Just set up a server and our
+                                    modules, and you&rsquo;re ready to go.
                                 </p>
                                 <p>
                                     Want to see how it works? Just buy a hosting
@@ -991,88 +773,79 @@
                 </div>
             </div>
 
-            <!-- Carousel Controls -->
             <button
-                class="carousel-arrow prev"
+                class="arrow left"
                 onclick="prevSlide()"
                 aria-label="Previous"
             >
                 <i class="fas fa-chevron-left"></i>
             </button>
-            <button
-                class="carousel-arrow next"
-                onclick="nextSlide()"
-                aria-label="Next"
-            >
+            <button class="arrow right" onclick="nextSlide()" aria-label="Next">
                 <i class="fas fa-chevron-right"></i>
             </button>
 
-            <div class="carousel-controls" id="carouselDots">
+            <div class="carousel-dots">
                 <button
                     class="carousel-dot active"
-                    data-slide="0"
-                    onclick="goToSlide(0)"
-                    aria-label="Slide 1"
+                    onclick="goSlide(0)"
+                    aria-label="1"
                 ></button>
                 <button
                     class="carousel-dot"
-                    data-slide="1"
-                    onclick="goToSlide(1)"
-                    aria-label="Slide 2"
+                    onclick="goSlide(1)"
+                    aria-label="2"
                 ></button>
                 <button
                     class="carousel-dot"
-                    data-slide="2"
-                    onclick="goToSlide(2)"
-                    aria-label="Slide 3"
+                    onclick="goSlide(2)"
+                    aria-label="3"
                 ></button>
                 <button
                     class="carousel-dot"
-                    data-slide="3"
-                    onclick="goToSlide(3)"
-                    aria-label="Slide 4"
+                    onclick="goSlide(3)"
+                    aria-label="4"
                 ></button>
             </div>
-        </section>
+        </div>
 
-        <!-- ============ POPUP (hidden by default) ============ -->
         <div
-            id="trialPopup"
+            id="pop"
             style="
                 display: none;
                 position: fixed;
                 inset: 0;
                 z-index: 999;
-                background: rgba(0, 0, 0, 0.5);
+                background: rgba(0, 0, 0, 0.6);
                 align-items: center;
                 justify-content: center;
             "
         >
             <div
                 style="
-                    background: #ffffff;
-                    border-radius: 0.4rem;
-                    max-width: 500px;
+                    background: #fff;
+                    border-radius: 1rem;
+                    max-width: 460px;
                     width: 90%;
                     overflow: hidden;
                 "
             >
                 <div style="position: relative">
                     <button
-                        onclick="closePopup()"
+                        onclick="closepop()"
                         style="
                             position: absolute;
-                            top: 0.5rem;
-                            right: 0.5rem;
+                            top: 0.75rem;
+                            right: 0.75rem;
                             z-index: 10;
                             background: #fff;
                             border: none;
-                            width: 2.5rem;
-                            height: 2.5rem;
+                            width: 2.4rem;
+                            height: 2.4rem;
                             border-radius: 50%;
                             cursor: pointer;
-                            font-size: 1.25rem;
-                            box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
+                            font-size: 1.3rem;
+                            box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+                            color: #555;
                         "
                     >
                         &times;
@@ -1087,24 +860,30 @@
                     >
                         <div
                             style="
-                                background: rgba(255, 255, 255, 0.9);
+                                background: rgba(255, 255, 255, 0.95);
                                 padding: 2rem;
                                 text-align: center;
-                                border-radius: 0.4rem;
+                                border-radius: 0.8rem;
                             "
                         >
                             <h2
                                 style="
-                                    font-size: clamp(1.5rem, 3vw, 2rem);
+                                    font-size: clamp(1rem, 2vw, 1.24rem);
                                     margin-bottom: 0.5rem;
+                                    color: #1b1319;
                                 "
                             >
                                 Start your 4 weeks free ODOO 19 trial
                             </h2>
-                            <p class="lead" style="font-size: 1.125rem">
+                            <p
+                                style="
+                                    font-size: 0.8rem;
+                                    color: rgba(33, 37, 41, 0.7);
+                                "
+                            >
                                 No credit card required
                             </p>
-                            <a class="btn btn-primary" href="/contactus"
+                            <a class="btn btn-primary btn-lg" href="/contactus"
                                 >Try Now</a
                             >
                         </div>
@@ -1113,63 +892,36 @@
             </div>
         </div>
 
-        <!-- ============ MAIN TITLE ============ -->
-        <section class="section-title">
+        <section class="stitle">
             <div class="container">
+                <div class="hr"></div>
                 <h1>
-                    Effortless Odoo Hosting with AI-Powered Automation<br />&mdash;
-                    Scale Your Business Seamlessly &mdash;
+                    Effortless Odoo Hosting with AI-Powered Automation &mdash;
+                    Scale Your Business Seamlessly
                 </h1>
             </div>
         </section>
 
-        <!-- ============ OUR PROCESS / TABS ============ -->
         <section class="tabs-section">
             <div class="container">
-                <div class="tabs-wrapper">
-                    <nav class="tabs-nav" role="tablist">
-                        <button
-                            class="tab-link active"
-                            data-tab="tab1"
-                            role="tab"
-                            aria-selected="true"
-                        >
+                <div class="tabs-wrap">
+                    <nav class="tabs-nav">
+                        <button class="tab-btn active" data-t="tab1">
                             Our process innovation
                             <small>We practice what we preach</small>
                         </button>
-                        <button
-                            class="tab-link"
-                            data-tab="tab2"
-                            role="tab"
-                            aria-selected="false"
-                        >
+                        <button class="tab-btn" data-t="tab2">
                             Our competitive advantages
                             <small>Why are we here to stay</small>
                         </button>
-                        <button
-                            class="tab-link"
-                            data-tab="tab3"
-                            role="tab"
-                            aria-selected="false"
-                        >
+                        <button class="tab-btn" data-t="tab3">
                             Grow with us
                             <small>Our technology lets us grow with you</small>
                         </button>
-                        <button
-                            class="tab-link"
-                            data-tab="tab4"
-                            role="tab"
-                            aria-selected="false"
-                        >
-                            Affiliates
-                            <small>Earn while you sleep</small>
+                        <button class="tab-btn" data-t="tab4">
+                            Affiliates <small>Earn while you sleep</small>
                         </button>
-                        <button
-                            class="tab-link"
-                            data-tab="tab5"
-                            role="tab"
-                            aria-selected="false"
-                        >
+                        <button class="tab-btn" data-t="tab5">
                             FAQ
                             <small
                                 >Here you find answers to your questions</small
@@ -1177,8 +929,7 @@
                         </button>
                     </nav>
                     <div class="tabs-content">
-                        <!-- Tab 1 -->
-                        <div class="tab-pane active" id="tab1" role="tabpanel">
+                        <div class="tab-pane active" id="tab1">
                             <p>
                                 We believe in ODOO as a stable,
                                 <strong>battle-proven</strong> ERP platform with
@@ -1200,8 +951,7 @@
                                 work together.
                             </p>
                         </div>
-                        <!-- Tab 2 -->
-                        <div class="tab-pane" id="tab2" role="tabpanel">
+                        <div class="tab-pane" id="tab2">
                             <h3><em>Our Competitive Advantages</em></h3>
                             <p>
                                 &#127758; <strong>Promotion of ODOO CE</strong
@@ -1221,8 +971,7 @@
                                 globally without friction.
                             </p>
                         </div>
-                        <!-- Tab 3 -->
-                        <div class="tab-pane" id="tab3" role="tabpanel">
+                        <div class="tab-pane" id="tab3">
                             <p>
                                 We are not the best hardware data center
                                 managers &mdash; and we don&rsquo;t try to be.
@@ -1241,8 +990,7 @@
                                 our sales.
                             </p>
                         </div>
-                        <!-- Tab 4 -->
-                        <div class="tab-pane" id="tab4" role="tabpanel">
+                        <div class="tab-pane" id="tab4">
                             <p>
                                 <strong
                                     >Earn Up to 25% Commission &#128176;</strong
@@ -1264,8 +1012,7 @@
                                 >
                             </p>
                         </div>
-                        <!-- Tab 5 -->
-                        <div class="tab-pane" id="tab5" role="tabpanel">
+                        <div class="tab-pane" id="tab5">
                             <p>
                                 Our chatbot answers all the FAQs and snacks on
                                 tokens along the way.
@@ -1281,184 +1028,210 @@
             </div>
         </section>
 
-        <!-- ============ PRICING / YOUR PLAN YOUR TIMING ============ -->
-        <section class="pricing-section">
+        <section class="psection">
             <div class="container">
-                <div class="mb-4">
+                <div class="text-center mb-4">
+                    <div class="hr"></div>
                     <h2>Your Plan, Your Timing: Upgrade Anytime</h2>
                 </div>
-                <div class="pricing-grid">
-                    <!-- Side Hustle -->
-                    <div class="pricing-card">
-                        <div class="pricing-card-body">
+                <div class="pgrid">
+                    <div class="pcard">
+                        <div class="pcard-body">
                             <h3>Side Hustle</h3>
                             <div class="price">
                                 <strong>$ 214.00</strong>
                                 <small class="text-muted">/ year</small>
                             </div>
-                            <p class="card-text text-muted">
+                            <p class="desc">
                                 &ldquo;ODOO Standard .. that is all my business
                                 needs&rdquo;
                             </p>
                             <a
                                 href="/3/214.00/4/Side%20Hustle"
-                                class="btn btn-primary w-100 mb-3"
+                                class="btn btn-primary"
                                 >Buy Now</a
                             >
                             <ul>
                                 <li>
-                                    <i class="fas fa-check"></i>&nbsp; ODOO CE
-                                    hosting
+                                    <i
+                                        class="fas fa-check"
+                                        style="color: #28a745"
+                                    ></i>
+                                    ODOO CE hosting
                                 </li>
                                 <li>
-                                    <i class="fas fa-check"></i>&nbsp; 1 Backup
-                                    Slots
+                                    <i
+                                        class="fas fa-check"
+                                        style="color: #28a745"
+                                    ></i>
+                                    1 Backup Slots
                                 </li>
                                 <li>
-                                    <i class="fas fa-check"></i>&nbsp; 1 Domain
-                                    Mapping, SSL Cert
+                                    <i
+                                        class="fas fa-check"
+                                        style="color: #28a745"
+                                    ></i>
+                                    1 Domain Mapping, SSL Cert
                                 </li>
                                 <li>
-                                    <i class="fas fa-times"></i>&nbsp; No module
-                                    installation
+                                    <i
+                                        class="fas fa-times"
+                                        style="color: #dc3545"
+                                    ></i>
+                                    No module installation
                                 </li>
                             </ul>
                         </div>
-                        <div class="pricing-card-footer">
-                            <small
-                                >Instant setup, satisfied or reimbursed.</small
-                            >
+                        <div class="pcard-foot">
+                            Instant setup, satisfied or reimbursed.
                         </div>
                     </div>
-
-                    <!-- On the Rise (featured) -->
-                    <div class="pricing-card featured">
-                        <div class="pricing-card-body">
+                    <div class="pcard featured">
+                        <div class="pcard-body">
                             <h3>On the Rise</h3>
                             <div class="price">
                                 <strong>$ 395.00</strong>
                                 <small class="text-muted">/ year</small>
                             </div>
-                            <p class="card-text text-muted">
+                            <p class="desc">
                                 &ldquo;I need some modules and professional
                                 reports&rdquo;
                             </p>
                             <a
                                 href="/4/395.00/4/On%20the%20Rise"
-                                class="btn btn-primary w-100 mb-3"
+                                class="btn btn-primary"
                                 >Buy Now</a
                             >
                             <ul>
                                 <li>
-                                    <i class="fas fa-check"></i>&nbsp; ODOO CE
-                                    hosting
+                                    <i
+                                        class="fas fa-check"
+                                        style="color: #28a745"
+                                    ></i>
+                                    ODOO CE hosting
                                 </li>
                                 <li>
-                                    <i class="fas fa-check"></i>&nbsp; 4 Backup
-                                    Slots
+                                    <i
+                                        class="fas fa-check"
+                                        style="color: #28a745"
+                                    ></i>
+                                    4 Backup Slots
                                 </li>
                                 <li>
-                                    <i class="fas fa-check"></i>&nbsp; 3 Domain
-                                    Mappings, SSL Cert
+                                    <i
+                                        class="fas fa-check"
+                                        style="color: #28a745"
+                                    ></i>
+                                    3 Domain Mappings, SSL Cert
                                 </li>
                                 <li>
-                                    <i class="fas fa-check"></i>&nbsp; Module
-                                    installation via git
+                                    <i
+                                        class="fas fa-check"
+                                        style="color: #28a745"
+                                    ></i>
+                                    Module installation via git
                                 </li>
                             </ul>
                         </div>
-                        <div class="pricing-card-footer">
-                            <small
-                                >Instant setup, satisfied or reimbursed.</small
-                            >
+                        <div class="pcard-foot">
+                            Instant setup, satisfied or reimbursed.
                         </div>
                     </div>
-
-                    <!-- Powerhouse -->
-                    <div class="pricing-card">
-                        <div class="pricing-card-body">
+                    <div class="pcard">
+                        <div class="pcard-body">
                             <h3>Powerhouse</h3>
                             <div class="price">
                                 <strong>$ 595.00</strong>
                                 <small class="text-muted">/ year</small>
                             </div>
-                            <p class="card-text text-muted">
+                            <p class="desc">
                                 &ldquo;ODOO Enterprise is a must have!&rdquo;
                             </p>
                             <a
                                 href="/5/595.00/4/Powerhouse"
-                                class="btn btn-primary w-100 mb-3"
+                                class="btn btn-primary"
                                 >Buy Now</a
                             >
                             <ul>
                                 <li>
-                                    <i class="fas fa-check"></i>&nbsp; All of On
-                                    the Rise
+                                    <i
+                                        class="fas fa-check"
+                                        style="color: #28a745"
+                                    ></i>
+                                    All of On the Rise
                                 </li>
                                 <li>
-                                    <i class="fas fa-check"></i>&nbsp; ODOO
-                                    Enterprise Ready
+                                    <i
+                                        class="fas fa-check"
+                                        style="color: #28a745"
+                                    ></i>
+                                    ODOO Enterprise Ready
                                 </li>
                                 <li>
-                                    <i class="fas fa-check"></i>&nbsp; 2 Workers
+                                    <i
+                                        class="fas fa-check"
+                                        style="color: #28a745"
+                                    ></i>
+                                    2 Workers
                                 </li>
                                 <li><br /></li>
                             </ul>
                         </div>
-                        <div class="pricing-card-footer">
-                            <small
-                                >Instant setup, satisfied or reimbursed.</small
-                            >
+                        <div class="pcard-foot">
+                            Instant setup, satisfied or reimbursed.
                         </div>
                     </div>
-
-                    <!-- Empire -->
-                    <div class="pricing-card">
-                        <div class="pricing-card-body">
+                    <div class="pcard">
+                        <div class="pcard-body">
                             <h3>Empire</h3>
                             <div class="price">
                                 <strong>&gt;$ 950.00</strong>
                                 <small class="text-muted">/ year</small>
                             </div>
-                            <p class="card-text text-muted">
+                            <p class="desc">
                                 &ldquo;My house! My Horse! My Server!&rdquo;
                             </p>
-                            <a
-                                href="/contactus"
-                                class="btn btn-outline-primary w-100 mb-3"
+                            <a href="/contactus" class="btn btn-outline-primary"
                                 >Contact Us</a
                             >
                             <ul>
                                 <li>
-                                    <i class="fas fa-check"></i>&nbsp; Our
-                                    service on your server
+                                    <i
+                                        class="fas fa-check"
+                                        style="color: #28a745"
+                                    ></i>
+                                    Our service on your server
                                 </li>
                                 <li>
-                                    <i class="fas fa-check"></i>&nbsp; All
-                                    modules &amp; features
+                                    <i
+                                        class="fas fa-check"
+                                        style="color: #28a745"
+                                    ></i>
+                                    All modules &amp; features
                                 </li>
                                 <li>
-                                    <i class="fas fa-check"></i>&nbsp; Unlimited
-                                    customization
+                                    <i
+                                        class="fas fa-check"
+                                        style="color: #28a745"
+                                    ></i>
+                                    Unlimited customization
                                 </li>
                                 <li><br /></li>
                             </ul>
                         </div>
-                        <div class="pricing-card-footer">
-                            <small
-                                >Instant setup, satisfied or reimbursed.</small
-                            >
+                        <div class="pcard-foot">
+                            Instant setup, satisfied or reimbursed.
                         </div>
                     </div>
                 </div>
             </div>
         </section>
 
-        <!-- ============ TRIAL BANNER ============ -->
-        <section class="trial-banner">
+        <section class="trial">
             <div class="container">
                 <div class="row align-items-center">
-                    <div class="col-lg-4">
+                    <div class="col-lg-5">
+                        <div class="hr" style="margin: 0 0 1rem 0"></div>
                         <h2>Not convinced? Start your free trial now</h2>
                         <p>
                             Test drive our systems running ODOO 19 for 4 weeks.
@@ -1470,40 +1243,23 @@
                             >
                         </p>
                     </div>
-                    <div class="col-lg-6 offset-lg-2 text-center">
+                    <div class="col-lg-6 offset-lg-1 text-center">
                         <img
                             src="images/settings_chat.svg"
-                            alt="Settings illustration"
-                            class="img-fluid"
-                            style="max-height: 250px"
+                            alt="Settings"
+                            style="max-height: 200px; opacity: 0.9"
                         />
                     </div>
                 </div>
             </div>
         </section>
 
-        <!-- ============ AFFILIATE BANNER ============ -->
-        <section class="affiliate-banner">
-            <div class="container">
-                <h2 style="font-size: clamp(1.8rem, 4vw, 4rem)">
-                    &#128176; Earn 25% by sharing Odoo Hosting &amp; Workshops!
-                </h2>
-                <div class="mt-3">
-                    <a class="btn btn-primary btn-lg" href="/affiliates"
-                        >More Info</a
-                    >
-                </div>
-            </div>
-        </section>
-
-        <!-- ============ FOOTER ============ -->
         <footer class="footer">
             <div class="container">
-                <div class="footer-grid">
-                    <!-- Useful Links -->
+                <div class="fgrid">
                     <div>
                         <h5>Useful Links</h5>
-                        <ul class="list-unstyled">
+                        <ul>
                             <li><a href="/">Home</a></li>
                             <li><a href="/support">Support</a></li>
                             <li><a href="/legal">Legal</a></li>
@@ -1511,12 +1267,10 @@
                             <li><a href="/workshops">Workshops</a></li>
                             <li><a href="/affiliates">Affiliates</a></li>
                             <li>
-                                Our service Partner:
-                                <a href="https://OD8N.com">OD8N</a>
+                                Partner: <a href="https://OD8N.com">OD8N</a>
                             </li>
                         </ul>
                     </div>
-                    <!-- About us -->
                     <div>
                         <h5>About us</h5>
                         <p>
@@ -1532,25 +1286,29 @@
                             without limits.
                         </p>
                     </div>
-                    <!-- Contact us + Form -->
                     <div>
                         <h5>Contact us</h5>
                         <p>
-                            <a class="btn btn-primary" href="/contactus"
+                            <a
+                                class="btn btn-primary"
+                                href="/contactus"
+                                style="
+                                    background: rgba(255, 255, 255, 0.1);
+                                    border-color: rgba(255, 255, 255, 0.2);
+                                    color: #fff;
+                                "
                                 >Contact Form</a
                             >
                         </p>
-                        <div class="social-links mb-3">
+                        <div class="social">
                             <a
                                 href="/website/social/linkedin"
                                 target="_blank"
                                 aria-label="LinkedIn"
-                                ><i class="fab fa-linkedin-in"></i
-                            ></a>
-                            <a href="/" target="_blank" aria-label="Home"
-                                ><i class="fas fa-home"></i
-                            ></a>
-                            <a
+                                ><i class="fab fa-linkedin-in"></i></a
+                            ><a href="/" target="_blank" aria-label="Home"
+                                ><i class="fas fa-home"></i></a
+                            ><a
                                 href="/website/social/youtube"
                                 target="_blank"
                                 aria-label="YouTube"
@@ -1558,142 +1316,140 @@
                             ></a>
                         </div>
                         <form
-                            class="footer-form"
+                            class="fform"
                             action="/website/form/"
                             method="post"
                         >
-                            <label for="footerName">Your Name *</label>
-                            <input
+                            <label for="n1">Your Name *</label
+                            ><input
                                 type="text"
                                 name="name"
-                                id="footerName"
+                                id="n1"
                                 required
                                 placeholder="Your Name"
-                            />
-                            <label for="footerEmail">Your Email *</label>
-                            <input
+                            /><label for="e1">Your Email *</label
+                            ><input
                                 type="email"
                                 name="email"
-                                id="footerEmail"
+                                id="e1"
                                 required
                                 placeholder="Your Email"
                             />
-                            <div class="d-flex align-items-center gap-2">
+                            <div
+                                class="d-flex align-items-center gap-2"
+                                style="margin-bottom: 0.75rem"
+                            >
                                 <input
                                     type="checkbox"
-                                    id="newsletterCheck"
+                                    id="c1"
                                     checked
-                                />
-                                <label for="newsletterCheck" style="margin: 0"
+                                    style="width: auto"
+                                /><label
+                                    for="c1"
+                                    style="
+                                        margin: 0;
+                                        color: rgba(255, 255, 255, 0.7);
+                                        font-weight: 400;
+                                    "
                                     >Subscribe to Newsletter</label
                                 >
                             </div>
-                            <button type="submit" class="btn btn-primary w-100">
+                            <button
+                                type="submit"
+                                class="btn btn-primary"
+                                style="
+                                    background: var(--primary);
+                                    border-color: var(--primary);
+                                "
+                            >
                                 Submit
                             </button>
                         </form>
                     </div>
                 </div>
-                <!-- Copyright -->
-                <div class="footer-copyright">
-                    <span>Copyright &copy; ODOO4projects LLC</span>
-                </div>
+                <div class="fcopy">Copyright &copy; ODOO4projects LLC</div>
             </div>
         </footer>
 
-        <!-- ============ CAROUSEL JS ============ -->
         <script>
-            let currentSlide = 0;
-            const slides = document.querySelectorAll(".hero-slide");
-            const dots = document.querySelectorAll(".carousel-dot");
-            let autoPlayInterval;
+            var si = 0,
+                slides = document.querySelectorAll(".hero-slide"),
+                dots = document.querySelectorAll(".carousel-dot"),
+                t;
 
-            function showSlide(index) {
-                slides.forEach((s, i) => {
-                    s.classList.toggle("d-none", i !== index);
-                });
-                dots.forEach((d, i) => {
-                    d.classList.toggle("active", i === index);
-                });
-                currentSlide = index;
+            function show(i) {
+                for (var j = 0; j < slides.length; j++) {
+                    if (j === i) {
+                        slides[j].classList.remove("d-none");
+                    } else {
+                        slides[j].classList.add("d-none");
+                    }
+                    if (j === i) {
+                        dots[j].classList.add("active");
+                    } else {
+                        dots[j].classList.remove("active");
+                    }
+                }
+                si = i;
             }
-
             function nextSlide() {
-                showSlide((currentSlide + 1) % slides.length);
-                resetAutoPlay();
+                show((si + 1) % slides.length);
+                resetTimer();
             }
-
             function prevSlide() {
-                showSlide((currentSlide - 1 + slides.length) % slides.length);
-                resetAutoPlay();
+                show((si - 1 + slides.length) % slides.length);
+                resetTimer();
+            }
+            function goSlide(i) {
+                show(i);
+                resetTimer();
+            }
+            function resetTimer() {
+                clearInterval(t);
+                t = setInterval(nextSlide, 5000);
             }
 
-            function goToSlide(index) {
-                showSlide(index);
-                resetAutoPlay();
-            }
-
-            function resetAutoPlay() {
-                clearInterval(autoPlayInterval);
-                autoPlayInterval = setInterval(nextSlide, 5000);
-            }
-
-            // Hide spinner after all images are loaded
             window.addEventListener("load", function () {
-                document
-                    .getElementById("spinnerOverlay")
-                    .classList.add("hidden");
+                var o = document.getElementById("spinner");
+                o.classList.add("hidden");
                 setTimeout(function () {
-                    document.getElementById("spinnerOverlay").style.display =
-                        "none";
+                    o.style.display = "none";
                 }, 500);
             });
-
-            // Fallback: hide spinner after 3 seconds anyway
             setTimeout(function () {
-                const overlay = document.getElementById("spinnerOverlay");
-                overlay.classList.add("hidden");
+                var o = document.getElementById("spinner");
+                o.classList.add("hidden");
                 setTimeout(function () {
-                    overlay.style.display = "none";
+                    o.style.display = "none";
                 }, 500);
             }, 3000);
+            t = setInterval(nextSlide, 5000);
 
-            // Auto-play
-            autoPlayInterval = setInterval(nextSlide, 5000);
-
-            // Show popup after 5 seconds
             setTimeout(function () {
-                document.getElementById("trialPopup").style.display = "flex";
+                document.getElementById("pop").style.display = "flex";
             }, 5000);
-
-            function closePopup() {
-                document.getElementById("trialPopup").style.display = "none";
+            function closepop() {
+                document.getElementById("pop").style.display = "none";
             }
             document
-                .getElementById("trialPopup")
+                .getElementById("pop")
                 .addEventListener("click", function (e) {
-                    if (e.target === this) closePopup();
+                    if (e.target === this) closepop();
                 });
 
-            // Tabs
-            document.querySelectorAll(".tab-link").forEach(function (btn) {
-                btn.addEventListener("click", function (e) {
-                    e.preventDefault();
-                    document
-                        .querySelectorAll(".tab-link")
-                        .forEach(function (b) {
-                            b.classList.remove("active");
-                            b.setAttribute("aria-selected", "false");
-                        });
+            document.querySelectorAll(".tab-btn").forEach(function (b) {
+                b.addEventListener("click", function () {
+                    document.querySelectorAll(".tab-btn").forEach(function (x) {
+                        x.classList.remove("active");
+                    });
                     document
                         .querySelectorAll(".tab-pane")
                         .forEach(function (p) {
                             p.classList.remove("active");
                         });
                     this.classList.add("active");
-                    this.setAttribute("aria-selected", "true");
                     document
-                        .getElementById(this.getAttribute("data-tab"))
+                        .getElementById(this.getAttribute("data-t"))
                         .classList.add("active");
                 });
             });
