body {
            width: 100%;
            margin: 0 auto;
            padding: 0;
            font-family: manrope;
            list-style-type: none;
            word-spacing: 4px;
            overflow-x: hidden;
         }

         @font-face {
            font-family: manrope;
            src: url(../fonts/Manrope-VariableFont_wght.ttf);
         }

         @font-face {
            font-family: Figtree;
            src: url(../fonts/Figtree-VariableFont_wght.ttf);
         }

         @font-face {
            font-family: Quicksand;
            src: url(../fonts//Quicksand-VariableFont_wght.ttf);
         }

         a {
            text-decoration: none !important;
         }
         p {
            word-spacing: 2px !important;
         }
         .fiiter{
            word-spacing: 2px;
         }

         .our-brands-heading {
            color: var(--Text, #1C3A3C) !important;
            font-size: 55px !important;
         }


         .navbar-nav {
            text-align: center;
            border-radius: 10px;
         }

         .navbar-collapse {

            justify-content: center !important;
         }


         /* Sidebar */
         .product-home-sidebar-section {
            height: 100vh;
            display: flex;
         }

         .product-home-sidebar-section-left {
            position: relative;
            right: 13px;
            background-color: #f8f8f8;
            width: 23%;
            height: 100%;
            padding: 0px 20px;
         }

         .product-home-sidebar {
            width: 100%;
            max-width: 300px;
            padding: 0px 20px;
            font-family: Arial, sans-serif;
            border-radius: 5px;
            height: 100%;
         }


         .product-home-section-title {
            font-size: 18px;
            font-weight: bold;
            color: #333;
            padding: 24px 0;
            margin: 0;
            border-bottom: 1px solid #ddd;
         }

         .product-home-item-list {
            list-style: none;
            padding: 10px 0 0 15px;
            margin: 0;
         }

         .product-home-item a {
            font-weight: 600;
            color: #4C5A65;
            text-decoration: none !important;
         }

         .product-home-item {
            color: black;
            /* Sets the text color to black */
            text-decoration: none;
            /* Removes underline */
         }


         .product-home-item {
            padding: 6px 0;
            color: #555;
            cursor: pointer;
            position: relative;
            padding-left: 15px;
         }

         .product-home-item:before {
            content: "-";
            position: absolute;
            left: 0;
         }

         .product-home-item:hover {
            color: #0066cc;
         }

         .product-home-sidebar-section-right {
            width: 79%;
            display: flex;
            gap: 14px;
            padding-top: 14px;
         }

         .product-home-sidebar-section-right-main-img {
            width: 70%;
            height: 100%;
            flex-shrink: 0;
            border-radius: 10px;
            overflow: hidden;
            object-fit: fill;
         }

         .product-home-sidebar-section-right-right {
            width: 30%;
            height: 100%;
            gap: 14px;
         }

         .product-home-sidebar-section-right-main-img img {
            width: 100%;
            height: 100%;
         }

         .product-home-sidebar-section-right-top-right-img {
            width: 100%;
            height: calc(50% - 7px);
            flex-shrink: 0;
            border-radius: 10px;
            overflow: hidden;
            object-fit: fill;
         }

         .product-home-sidebar-section-right-top-right-img img {
            width: 100%;
            height: 100%;
         }

         .product-home-sidebar-section-right-bottom-right-img {
            width: 100%;
            height: calc(50% - 7px);
            flex-shrink: 0;
            border-radius: 10px;
            overflow: hidden;
            object-fit: fill;
         }

         .product-home-sidebar-section-right-bottom-right-img img {
            width: 100%;
            height: 100%;
         }


         .below-sidebar-left {
            margin-top: 20px;
            width: 22.5%;
            height: 824px;
            padding: 20px;
            margin-bottom: 30px;
            border-radius: 10px;
            overflow: hidden;

         }

         .below-sidebar-left img {
            width: 100%;
            height: 100%;
            object-fit: cover;

         }

         .below-sidebar-right {
            width: 77.5%;
         }

         .section-brand-page {
            margin: 0px 0px;
            width: 100%;
            height: auto;
            object-fit: fill;
         }

         .section-brand-page img {
            border-radius: 10px;
            width: 100%;
            height: 100%;
         }


         .hygiene-strong {
            color: #0577AE;
         }

         /* Dropdown menu background fix */
         .dropdown-menu {
            background-color: #fff;
            /* white background */
            border: none;
            box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
            border-radius: 10px;
            padding: 10px 0;
            min-width: 200px;
         }

         .dropdown-item {
            padding: 8px 20px;
            color: #000 !important;
         }

         .dropdown-item:hover {
            background: linear-gradient(135deg, #f6f8ff, #f0e9ff);
            color: #0577AE !important;
         }

         .nav-container {
            padding-top: 10px;
            position: relative;
            background: #ffffff;
            height: 109px;
            width: 100%;
            margin: 20px auto;
            border-radius: 10px;
            box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
         }

         .box_logo {
            width: 229px;
            height: 78px;
            margin-left: 30px;
         }

         .logo {
            width: 229px;
            height: 78px;
         }

         .navbar {
            align-items: flex-end;
            padding: 0 27px;
         }

         .navbar-collapse {
            height: 24px;

            width: 100%;
            border-radius: 20px;
            z-index: 999;
            background-color: #FFF;
            justify-content: flex-end !important;
         }

         .navbar-nav {
            gap: 20px;
            align-items: center;
         }

         .nav-link {
            color: #000000af !important;
            font-weight: 700;
            font-size: 18px;
            transition: all 0.2s ease;
            position: relative;
            display: inline-block;
         }

         /* Prevent layout shift on hover */
         .nav-link::after {
            content: attr(data-text);
            display: block;
            font-weight: 500;
            font-size: 16px;
            height: 0;
            overflow: hidden;
            visibility: hidden;
         }

         .nav-link:hover {
            font-weight: 700;

         }

         .nav-link.active {
            color: #0577AE !important;
            /* highlight active link */
            font-weight: bold;
         }

         .contact-btn {
            background: var(--CBlue-darak, rgba(5, 119, 174, 1));
            color: white !important;
            border: none;
            width: 217px;
            height: 68px;
            border-radius: 5px;
            font-size: 20px;
            font-weight: 700 !important;
            box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
            transition: all 0.3s ease;
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 10px;
            position: relative;
            padding-right: 30px;
            margin-left: 20px;
         }

         .contact-btn::after {
            content: "→";
            font-size: 20px;
            position: absolute;
            right: 20px;
            transition: all 0.3s ease;
         }

         .contact-btn:hover {
            transform: translateY(-2px);
            box-shadow: 0 6px 20px rgba(0, 0, 0, 0.15);
         }

         .contact-btn:hover::after {
            transform: translateX(5px);
         }

         .dropdown-menu {
            border: none;
            box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
            border-radius: 10px;
            padding: 10px 0;
         }

         .dropdown-item {
            padding: 8px 20px;
         }

         .dropdown-item:hover {
            background: linear-gradient(135deg, #f6f8ff, #f0e9ff);
            color: #6e8efb !important;
         }

         /* Video section styles */
         .video-section {
            padding: 0 15px;
            border-radius: 10px;
            position: relative;
            width: 100%;
            height: 98vh;
            margin-top: 10px;
            overflow: hidden;
         }

         .special-setting {
            width: 96% !important;
         }

         .video-background {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            object-fit: cover;
            z-index: 1;
         }

         .video-bottom {
            position: absolute;
            bottom: 20px;
            right: 20px;
            width: 28%;
            height: 163px;
            background: var(--CBlue-darak, rgba(5, 119, 174, 1));
            color: white;
            border: none;
            border-radius: 10px;
            font-weight: 700;
            font-size: 18px;
            display: flex;
            align-items: center;
            justify-content: center;
            box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
            transition: all 0.3s ease;
            z-index: 10;
         }

         .video-overlay {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, 0.3);
            z-index: 2;
         }

         .hero-content {
            position: absolute;
            top: 50%;
            left: 50px;
            transform: translateY(-50%);
            z-index: 5;
            color: white;
         }

         .hero-text {
            font-weight: 800;
            font-size: 28px;
            line-height: 100%;
            letter-spacing: 0%;
            margin-bottom: 20px;
         }

         .hero-heading {

            font-weight: 800;
            font-size: 74px;
            line-height: 100%;
            margin: 0;
         }

         .bottom_button_heading {
            padding: 0;
            position: absolute;
            top: 23px;
            width: 301px;
            height: 38px;
         }

         .bottom_button_heading p {
            font-size: 21px;
            font-weight: 500;
            line-height: 100%;
            letter-spacing: 0;
         }

         .pic_and_text {
            position: absolute;
            padding-top: 50px;
            padding-left: 20px;

         }

         .actual_pics {
            width: 143px;
            height: 101px;
            object-fit: fill;
         }

         .pics_text {
            margin-top: 14px;
            padding-top: 3px;
            padding-left: 10px;
         }

         .pics_text span {
            font-size: 16px;
            font-weight: 600;
         }

         .pics_text p {
            font-size: 12px;
            font-weight: 400;
            color: rgba(255, 255, 255, 0.6);

         }

         .sec_one {
            background: rgba(5, 119, 174, 1);
            /* --CBlue-darak */
            padding: 50px;
            min-height: 80vh;
            display: flex;
            flex-direction: column;
            justify-content: center;
            color: #fff;
         }

         .thora-oper {
            margin-top: 20px !important;
         }


         @media (max-width: 767px) {
            .video-section {
               height: auto;
               border-radius: 10px;
            }

            .video-background {
               height: 100%;
               object-position: center;
            }

            .hero-content {
               top: 50%;
               left: 20px;
               transform: translateY(-50%);
               padding-right: 20px;
            }


            .hero-buttons {
               display: flex;
               gap: 10px;
               margin-top: 15px;
            }

            .hero-btn {
               font-size: 14px;
               padding: 8px 14px;
               width: fit-content;
            }

            .hero-btn-hoverrr {
               background-color: #eee;
               color: #333;
               padding: 15px 25px;
               border-radius: 10px;
               font-size: 16px;
               font-weight: bold;
               font-size: 14px;
               padding: 8px 14px;
               width: fit-content;
               display: flex;
               width: 217.079px;
               justify-content: center;
               align-items: center;
               gap: 13.077px;
            }

            .hero-btn-hoverrr:hover {
               background: var(--CBlue-darak, rgba(5, 119, 174, 1)) !important;
               color: white !important;

            }

            .video-bottom {
               position: static;
               width: 100%;
               height: auto;
               margin-top: 20px;
               border-radius: 10px;
               flex-direction: column;
               padding: 20px;
            }

            .bottom_button_heading {
               position: static;
               width: 100%;
               height: auto;
               margin-bottom: 10px;
               text-align: center;
            }

            .bottom_button_heading p {
               font-size: 20px;
            }

            .pic_and_text {
               position: static;
               flex-direction: column;
               align-items: center;
               text-align: center;
               padding: 0;
            }

            .actual_pics {
               width: 120px;
               height: auto;
            }

            .pics_text {
               padding: 10px 0 0 0;
            }

            .pics_text span {
               font-size: 16px;
            }

            .pics_text p {
               font-size: 14px;
            }
         }

         .hero-buttons {
            display: flex;
            gap: 20px;
            margin-top: 40px;
         }

         .hero-btn {
            padding: 15px 30px;
            font-size: 20px;
            font-weight: 700;
            border-radius: 5px;
            border: none;
            cursor: pointer;
            transition: all 0.3s ease;
         }

         .btn-primary {
            background: var(--CBlue-darak, rgba(5, 119, 174, 1));
            width: 200px;
            color: white;
            box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
         }

         .btn-primary:hover {
            transform: translateY(-2px);
            box-shadow: 0 6px 20px rgba(0, 0, 0, 0.15);
         }

         .btn-secondary {
            display: flex;
            width: 217.079px;
            padding: 20.923px 34px;
            justify-content: center;
            align-items: center;
            gap: 13.077px;
         }

         .btn-secondary:hover {
            background: var(--CBlue-darak, rgba(5, 119, 174, 1));
            transform: translateY(-2px);
            color: white;
         }


         .second_section {
            background-color: #ffffff;
            margin: 50px 0;
            display: flex;
            flex-wrap: wrap;
            min-height: 80vh;
         }

         .heading_one {
            color: white;
            font-family: manrope;
            font-weight: 800;
            font-size: 48px;
            line-height: 120%;
            letter-spacing: 0%;
         }

         .second_section .gap-adjusted {
            width: calc(50% - 5px);
         }

         .second_section .right-col {
            margin-left: 10px;
         }

         .heading_two {
            color: white;
            font-family: manrope;
            font-weight: 800;
            font-size: 3rem;
            line-height: 100%;
            letter-spacing: 0%;
         }

         .paragraph_one p {
            font-family: manrope;
            font-weight: lighter;
            font-size: 24px;
            line-height: 120%;
            word-spacing: 4px;
            letter-spacing: 0%;
            color: #ffffff;
            max-width: 80%;
         }

         .awain {
            margin-top: 30px;
            WIDTH: 80%;
            font-size: 32px;
            font-family: manrope;
            font-weight: bold;
            color: white !important;

         }

         .text_ninetynine {
            display: flex;
            gap: 40px;
            /* Added gap between the two percentage items */
            margin-top: 45px;
         }

         .text_ninetynine span {
            font-family: Manrope;
            font-weight: 600;
            font-size: 4rem;
            line-height: 120%;
            letter-spacing: -2%;
            color: white;
         }

         .text_ninetynine p {
            font-family: Manrope;
            font-weight: 400;
            font-size: 16.91px;
            line-height: 150%;
            letter-spacing: -2%;
            color: white;
         }

         .blue_sec {
            background-color: #f0e9ff !important;
         }

         /* Right section specific CSS */
         .sneezing_div {
            position: relative;
            overflow: hidden;
            display: flex;
            flex-direction: column;
            justify-content: center;
         }

         .slideshow-container {
            position: relative;
            width: 100%;
            height: 100%;
         }

         .slide {
            position: absolute;
            width: 100%;
            height: 100%;
            opacity: 0;
            transition: opacity 1s ease;
         }

         .slide.fade {
            opacity: 1;
         }

         .sneezing_pic {
            width: 100%;
            height: 100%;
            object-fit: cover;
            object-position: top;
         }

         .right-section-end {
            padding: 0;
            height: 650px;
            background: #f9f9f9;
            width: 50%;
         }

         .right-section-end img {
            width: 100%;
            height: 100%;
         }

         .step {
            cursor: pointer;
            transition: all 0.3s ease;
            padding: 15px;
            border-radius: 8px;
            margin-bottom: 10px;
         }

         .step.active {
            background-color: #f5f9fc;
         }

         .step-header {
            display: flex;
            align-items: center;
         }

         .step-number {
            color: white;
            width: 24px;
            height: 24px;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            margin-right: 15px;
            font-weight: bold;
         }

         .step-title {
            margin: 0;
            color: #0577AE;
         }

         .step-description {
            max-height: 0;
            overflow: hidden;
            transition: max-height 0.3s ease;
            padding-left: 39px;
            /* Align with step number */
         }

         .step.active .step-description {
            max-height: 100px;
            /* Adjust based on your content */
            margin-top: 10px;
         }

         .carousel-image {
            display: none;
            transition: opacity 0.5s ease;
         }

         .carousel-image img {
            border-radius: 10px;
            object-fit: contain;
         }

         .carousel-image.active {
            display: contents;
            animation: fadeIn 0.5s ease;
         }

         @keyframes fadeIn {
            from {
               opacity: 0;
            }

            to {
               opacity: 1;
            }
         }

         .button-container {
            display: flex;
            width: 399.158px;
            height: 112.421px;
            padding: 32.211px 30.947px;
            flex-direction: column;
            align-items: flex-start;
            gap: 6.316px;
            flex-shrink: 0;
            border: 1px solid #ccc;
            /* Optional: for visualization */
         }
     
         /* New styles for buttons */
         .custom-buttons-container {
            position: absolute;
            bottom: 120px;
            /* 30px above progress bars (60px + 30px gap) */
            left: 50px;
            width: calc(100% - 100px);
            /* Match progress container width */
            display: flex;
            flex-direction: column;
            gap: 15px;
            /* Space between buttons */
         }

         .custom-button {
            display: flex;
            justify-content: space-between;
            align-items: center;
            width: 60%;
            height: 85px;
            padding: 0px 25px;
            border-radius: 8.842px;
            background: rgba(255, 255, 255, 0.364);
            color: rgb(0, 0, 0);
            cursor: pointer;
            transition: all 0.3s ease;
         }

         .custom-button:hover {
            background: #0577AE;
            transform: translateY(-2px);
         }

         .custom-button:hover h3,
         .custom-button:hover p {
            color: white;
         }

         .button-content h3 {
            word-spacing: 2px;
            font-size: 16px;
            font-weight: 600;
            margin: 0 0 4px 0;
         }

         .button-content p {
            font-size: 12px;
            opacity: 0.8;
            margin: 0;
         }

         .button-arrow {
            transition: transform 0.3s ease;
         }

         .custom-button:hover .button-arrow {
            transform: translateX(5px);
            color: #FFF;
         }

         /* Existing progress container - adjust bottom position */
         .progress-container {
            position: absolute;
            bottom: 60px;
         }

         /* Progress bars styling */
         .progress-container {
            position: absolute;
            bottom: 60px;
            left: 50px;
         }

         .progress-bars {
            display: flex;
            gap: 10px;
         }

         .progress-track {
            position: relative;
            width: 100px;
            height: 4px;
         }

         .progress-bg {
            position: absolute;
            width: 100%;
            height: 100%;
            background-color: rgba(255, 255, 255, 0.3);
            border-radius: 2px;
         }

         .progress-fill {
            position: absolute;
            left: 0;
            top: 0;
            width: 0;
            height: 100%;
            background-color: white;
            border-radius: 2px;
            z-index: 2;
            transition: width linear;
         }

         @media (max-width: 767px) {
            .second_section {
               flex-direction: column !important;
               height: auto !important;
            }

            .hero-btn {
               text-decoration: none;
               width: 150px !important;
               padding: 10px 0px;
               font-size: 20px;
               font-weight: 700;
               border-radius: 10px;
               border: none;
               cursor: pointer;
               transition: all 0.3s ease;
            }

            .btn-primary {
               background: var(--CBlue-darak, rgba(5, 119, 174, 1));
               width: 150px !important;
               padding: 10px 0px !important;
               color: white;
               box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
            }

            .second_section .col-6 {
               width: 100% !important;
               max-width: 100%;
            }

            .gap-adjusted,
            .right-col {
               margin-left: 0 !important;
               margin-top: 20px;
            }

            .slideshow-container {
               height: auto;
            }

            .sneezing_pic {
               height: auto;
               max-height: 300px;
            }

            /* ↓↓↓ Reduce Button Size ↓↓↓ */
            .custom-buttons-container {
               width: 100%;
               left: 0;
               padding: 0 15px;
               gap: 10px;
            }

            .custom-button {
               width: 100%;
               height: 80px;
               padding: 12px 16px;
               border-radius: 6px;
            }

            .button-content h3 {
               font-size: 0.9rem;
               margin-bottom: 2px;
            }

            .button-content p {
               font-size: 0.7rem;
            }

            .button-arrow svg {
               width: 20px;
               height: 20px;
            }
         }

         /* css of products*/
         .container-fluid {
            width: 100%;
            margin-right: auto;
            margin-left: auto;
         }

         .products-container {
            padding: 20px;
            position: relative;
         }

         .products-heading {
            text-align: left;
            margin-bottom: 20px;
            margin-left: 20px;
         }

         .products-heading h2 {
            margin-bottom: 0px;
            font-weight: 800;
            color: #4C5A65;
            font-family: Manrope;
            font-size: 74.299px;
            font-style: normal;
            font-weight: 800;
            line-height: normal;
         }

         .Products_blue_line {
            margin-left: 100px;
            margin-bottom: 10px;
         }

         .More_blue_line {
            margin-left: 264px;
            margin-bottom: 10px;
         }

         .products-heading p {
            max-width: 800px;
            margin: 0 auto 40px;
            line-height: 1.6;
            color: rgba(76, 90, 101, 0.70);
            font-family: Manrope;
            font-size: 24px;
            font-style: normal;
            font-weight: 400;
            line-height: normal;
         }

         /* Product section */
         .product-section-container {
            position: relative;
            width: 100%;
            overflow: hidden;
         }

         .product-section {
            display: flex;
            gap: 25px;
            padding: 20px;
            transition: transform 0.5s ease;
            width: max-content;
         }

         /* Product card */
         .product-card {
            width: 451px;
            height: 566px;
            background-color: #f8f9fa;
            border-radius: 15px;
            padding: 30px;
            position: relative;
            overflow: hidden;
            transition: all 0.3s ease;
            flex-shrink: 0;
         }

         /* Image container */
         .image-container {
            width: 231px;
            height: 277px;
            margin: 0 auto 30px;
            transition: all 0.3s ease;
         }

         .product-card:hover .image-container {
            transform: translateY(50px);
         }

         .image-container img {
            width: 100%;
            height: 100%;
            object-fit: contain;
            border-radius: 15px;
         }

         /* Product info - left aligned */
         .product-info {
            position: absolute;
            bottom: 25px;
            left: 30px;
            right: 30px;
            text-align: left;
            transition: all 0.3s ease;
            opacity: 1;
            transform: translateY(0);
         }

         .product-card:hover .product-info {
            opacity: 0;
            transform: translateY(20px);
         }

         .product-info h2 {
            margin: 0 0 15px 0;
            font-size: 24px;
            font-family: manrope;
            font-weight: 700;
            line-height: 130%;
         }

         .product-info p {
            color: #555;
            font-family: Manrope;
            font-weight: 400;
            font-size: 16px;
            line-height: 130%;
            margin-bottom: 20px;
         }

         .view-all-btn {
            background: var(--CBlue-darak, rgba(5, 119, 174, 1));
            color: white;
            height: 75px;
            width: 250px;
            border: none;
            padding: 10px 20px;
            border-radius: 5px;
            font-weight: 600;
            cursor: pointer;
            margin: 45px 40px;
            box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
         }

         .view-all-btn:hover {
            transform: translateY(-2px);
         }

         /* Footer */
         .product-footer {
            background-color: #f8f9fa;
            position: absolute;
            bottom: -80px;
            left: 0;
            right: 0;
            height: 70px;
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 0 30px;
            transition: all 0.3s ease;
         }

         .product-card:hover .product-footer {
            bottom: 0;
         }

         .footer-info {
            color: white;
            text-align: left;
         }

         .footer-info h3 {
            color: #1C3A3C;
            font-family: Manrope;
            font-size: 32px;
            font-style: normal;
            font-weight: 700;
            line-height: 130%;
            letter-spacing: -0.64px;
         }

         .footer-info p {
            color: #1C3A3C;
            font-size: 16px;
            margin-bottom: 30px;
         }

         .footer-button {
            width: 61px;
            height: 61px;
            border-radius: 50%;
            background: var(--CBlue-darak, #0577AE);
            border: none;
            cursor: pointer;
            display: flex;
            justify-content: center;
            align-items: center;
            transition: all 0.3s ease;
            margin-bottom: 25px;
         }

         /* new products */
         /* Product Showcase Section */
         .product-showcase-section {
            padding: 60px 0;

         }

         .product-showcase-container {
            max-width: 1720px;
            margin: 0 auto;
            padding: 0 20px;
         }

         .product-showcase-header {
            display: flex;
            justify-content: space-between;
            align-items: flex-start;
            margin-bottom: 40px;
         }

         .product-showcase-heading {
            max-width: 60%;
         }

         .product-showcase-title {
            color: #4C5A65;
            font-family: Manrope;
            font-size: 74.299px;
            font-style: normal;
            font-weight: 800;
            line-height: normal;
         }

         .more_blue_line {
            position: relative;
            margin-left: 266px;
         }

         .product-showcase-divider {
            margin-bottom: 15px;
         }

         .product-showcase-description {
            color: rgba(76, 90, 101, 0.70);
            font-family: Manrope;
            font-size: 22px;
            font-style: normal;
            word-spacing: 1px;
            font-weight: 400;
            line-height: normal;
         }

         .product-showcase-view-all {
            background: var(--CBlue-darak, rgba(5, 119, 174, 1));
            color: white;
            height: 75px;
            width: 250px;
            border: none;
            border-radius: 5px;
            font-weight: 600;
            cursor: pointer;
            margin: 45px 40px;
            box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
            transition: transform 0.3s ease;
         }

         .product-showcase-view-all:hover {
            transform: translateY(-2px);
         }

         /* Product Cards */
         .product-showcase-gallery {
            overflow: hidden;
            margin-bottom: 30px;
         }

         .product-showcase-slider {
            display: flex;
            gap: 25px;
            padding: 0;
            transition: transform 0.5s ease;
            width: 100%;
         }

         .product-showcase-card {
            width: 400.056px;
            height: 500.595px;
            background-color: #f8f9fa;
            border-radius: 15px;
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
            padding: 10px;
            position: relative;
            overflow: hidden;
            transition: all 0.3s ease;
            flex-shrink: 0;
         }

         .product-showcase-image {
            width: 250 .574px;
            height: auto;
            margin: 0 auto 30px;
            transition: all 0.3s ease;
         }

         .product-showcase-card:hover .product-showcase-image {
            transform: translateY(50px);
         }

         .product-showcase-image img {
            width: 100%;
            height: 100%;
            object-fit: contain;
            border-radius: 15px;
            aspect-ratio: 211.57/254.39;
         }

         .product-showcase-info {
            position: absolute;
            bottom: 25px;
            left: 30px;
            right: 30px;
            text-align: left;
            transition: all 0.3s ease;
            opacity: 1;
            transform: translateY(0);
         }

         .product-showcase-card:hover .product-showcase-info {
            opacity: 0;
            transform: translateY(20px);
         }

         .product-showcase-info h3 {
            margin: 0 0 15px 0;
            font-size: 24px;
            font-family: 'Manrope', sans-serif;
            font-weight: 700;
            line-height: 130%;
         }

         .product-showcase-info p {
            color: #555;
            font-family: 'Manrope', sans-serif;
            font-weight: 400;
            font-size: 16px;
            line-height: 130%;
            margin-bottom: 20px;
         }

         .product-showcase-footer {
            position: absolute;
            bottom: -100px;
            left: 0;
            right: 0;
            height: 100px;
            background-color: #f8f9fa;
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 0 30px;
            transition: all 0.3s ease;
         }

         .product-showcase-card:hover .product-showcase-footer {
            bottom: 0;
         }

         .product-showcase-footer-info {
            color: white;
            text-align: left;
         }

         .product-showcase-price {
            color: #1C3A3C;
            font-family: 'Manrope';
            font-size: 32px;
            font-weight: 700;
            line-height: 130%;
            letter-spacing: -0.64px;
            display: block;
         }

         .product-showcase-unit {
            color: #1C3A3C;
            font-size: 16px;
            display: block;
         }

         .product-showcase-action {
            width: 61px;
            height: 61px;
            border-radius: 50%;
            background: #0577AE;
            border: none;
            cursor: pointer;
            display: flex;
            justify-content: center;
            align-items: center;
            transition: all 0.3s ease;
            margin-bottom: 25px;
         }

         /* Navigation */
         .product-showcase-navigation {
            display: flex;
            justify-content: center;
            gap: 20px;
         }

         .product-showcase-nav-prev,
         .product-showcase-nav-next {
            background: none;
            border: none;
            cursor: pointer;
            padding: 5px;
         }

         .product-showcase-nav-prev:disabled {
            opacity: 0.5;
            cursor: not-allowed;
         }

         /* Navigation buttons - Updated Square Style */
         .nav-buttons {
            display: flex;
            justify-content: center;
            gap: 20px;
            margin-top: 30px;
         }

         .nav-button {
            padding: 23px 23px;
            width: 89px;
            height: 89px;
            background-color: white;
            color: rgba(28, 58, 60, 1);
            border-radius: 6px;
            border: 1px solid var(--Text, rgba(28, 58, 60, 1));
            font-size: 20px;
            cursor: pointer;
            display: flex;
            align-items: center;
            justify-content: center;
            transition: all 0.3s ease;
            position: relative;
         }

         .nav-button img {
            background: white;
            z-index: 2;
            width: 89px;
            height: 89px;
         }

         .nav-button:hover {
            background-color: #f0f0f0;
         }

         .nav-button:disabled {
            background-color: #f0f0f0;
            color: #999;
            border-color: #999;
            cursor: not-allowed;
         }

         /* Arrow styling */
         .nav-button::before {
            content: "";
            position: absolute;
            width: 10px;
            height: 10px;
            border-top: 2px solid black;
            border-left: 2px solid black;
         }

         #prevBtn::before {
            transform: rotate(-45deg);
            margin-right: 2px;
         }

         #nextBtn::before {
            transform: rotate(135deg);
            margin-left: 2px;
         }

         /* suatainability top */
         .asa-sustainability {

            background-image: url('../assets/sustain.jpg');
            background-size: cover;
            background-position: center;
            background-repeat: no-repeat;
            height: 618px;
            margin: 10px auto;

            display: flex;
            justify-content: center;
            align-items: flex-end;
         }

         .asa-sus-text {
            position: relative;
            top: -45px;
            display: flex;
            border-radius: 10px;
            padding: 10px 27px;
            flex-direction: column;
            justify-content: center;
            align-items: flex-start;
            background-color: #0577AE;
         }

         .asa-sus-text p {
            color: #FFF;
            text-align: center;
            font-family: Manrope;
            font-size: 20px;
            font-style: normal;
            font-weight: 600;
            line-height: normal;
            margin-bottom: 0;
         }

         /* asa section pic change in clcik */
    .asa-section {
      height: 90vh;
    }
    .asa-left {
      flex: 1;
      padding: 1rem;
      width: 100%; /* Ensure full width of the parent container */
    }
  .asa-list.fill-section {
   list-style: none;
   padding: 0;
   margin: 0;
   display: flex;
   flex-direction: column;
   justify-content: space-around;
   height: 90vh;
   width: 100%;
}

.asa-box {
   padding: 10px;
   border-top: 1px solid rgba(0, 0, 0, 0.2);
   display: flex;
   justify-content: space-between;
   align-items: center;
   cursor: pointer;
   transition: background-color 0.3s ease;
   width: 100%;
}

.asa-item {
   color: #4C5A65;
   font-family: Manrope;
   font-size: 25px;
   font-weight: 600;
   line-height: normal;
   transition: color 0.3s ease;
}

.asa-bg {
   display: flex;
   align-items: center;
   justify-content: center;
   background-color: #D9D9D9;
   height: 40px;
   width: 40px;
   border-radius: 50%;
   transition: background-color 0.3s ease;
}

.asa-box.active {
   border-top: 2px solid #1C3A3C;
}

.asa-box.active .asa-item {
   color:#1C3A3C;
}

.asa-box.active .asa-bg {
   background-color: #0577AE;
}

    .asa-right {
      margin: 0 auto;
      padding: 0;
      width: 50%;
    }
    .asa-right img {
      width: 100%;
      height: 100%;
      object-fit: contain;
    }
         /* Video Hero Section */
         /* Add these new styles to your existing CSS */
         .am-video-headings {
            position: absolute;
            top: 40px;
            width: 100%;
            display: flex;
            justify-content: space-between;
            z-index: 2;
            padding: 0 65px;
            box-sizing: border-box;
         }

         .am-heading-right {
            color: rgba(255, 255, 255, 0.7);
            font-family: Manrope;
            font-weight: 500;
            font-size: 32px;
            line-height: 100%;
            letter-spacing: 0%;
         }

         .am-heading-left {
            color: rgba(255, 255, 255, 1) !important;
            font-family: Manrope;
            font-weight: 800;
            font-size: 48px;
            line-height: 100%;
            letter-spacing: 0%;

         }

         .am-heading-left {
            margin-left: 40px;
         }

         .am-heading-right {
            margin-right: 40px;
         }

         /* Keep all your existing styles below */
         /* Video Hero Section */
         .am-video-hero {
            position: relative;
            width: 100%;
            height: 525px;
            overflow: hidden;
         }

         .am-video-bg {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            object-fit: cover;
            z-index: 0;
         }

         /* Headings */
         .am-video-headings {
            position: absolute;
            top: 40px;
            width: 100%;
            display: flex;
            justify-content: space-between;
            z-index: 2;
            padding: 65px 55px;
            box-sizing: border-box;
         }

         .am-heading-right {
            font-family: Manrope;
            font-weight: 500;
            font-size: 32px;
            line-height: 100%;
            letter-spacing: 0%;
         }

         .am-heading-left {
            font-family: Manrope;
            font-weight: 800;
            font-size: 48px;
            line-height: 100%;
            letter-spacing: 0%;
         }

         /* Cards Container */
         .am-feature-cards-container {
            position: relative;
            width: 100%;
            margin-top: -200px;
            z-index: 3;
            padding-bottom: 50px;
         }

         .am-feature-cards {
            width: 90%;
            max-width: 1600px;
            margin: 0 auto;
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
            gap: 25px;
         }

         /* Cards */
         .am-feature-card {
            background: rgb(255, 255, 255);
            backdrop-filter: blur(5px);
            border-radius: 12px;
            padding: 30px 25px;
            text-align: center;
            transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.1);
            box-shadow: 0 5px 15px rgba(0, 0, 0, 0.08);
         }

         .am-feature-card:hover {
            transform: translateY(-8px);
            box-shadow: 0 12px 24px rgba(0, 0, 0, 0.15);
            background: rgba(5, 119, 174, 1);
         }

         .am-card-title {
            padding: 10px;
            margin-bottom: 15px;
            color: #2a4365;
            font-family: Manrope;
            font-weight: 800;
            font-size: 36.35px;
            line-height: 100%;
         }

         .am-card-desc {
            padding: 20px;
            color: #4a5568;
            font-family: Manrope;
            font-weight: 300;
            font-size: 21.81px;
            line-height: 130%;
         }

         /* Hover state text color change */
         .am-feature-card:hover .am-card-title,
         .am-feature-card:hover .am-card-desc {
            color: white;
         }

         /* Updated CSS */
         .brand-card {

            width: 100%;
            /* Changed from fixed width */
            height: 275px;
            position: relative;
            overflow: hidden;
            border-radius: 20.39px;
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
            transition: all 0.3s ease;
            background: white;
            padding: 38.22px 26.76px;
         }

         .brand-img-container {
            margin-top: 25px;
            mix-blend-mode: multiply;
            height: calc(100% - 70px);
            display: flex;
            align-items: center;
            justify-content: center;
            transition: all 0.3s ease;
         }

         .brand-card img {
            max-height: 80%;
            max-width: 80%;
            object-fit: contain;
            transition: all 0.3s ease;
         }

         .brand-footer {
            position: absolute;
            bottom: -80px;
            left: 0;
            right: 0;
            height: 80px;
            background: var(--CBlue-darak, rgba(5, 119, 174, 1));
            display: flex;
            align-items: center;
            justify-content: space-between;
            padding: 0 26.76px;
            border-top: 1px solid #eee;
            transition: all 0.3s ease;
         }

         .brand-title {
            color: #FFF;
            font-family: Manrope;
            font-weight: 500;
            font-size: 20px;
            line-height: 100%;
            letter-spacing: 0%;
            text-align: center;

         }

         /* Updated button styles */
         .brand-button {
            background: #ffffff;
            color: white;
            border: none;

            width: 40px;
            height: 40px;
            border-radius: 50%;
            padding: 4px 4px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            transition: all 0.2s ease;
            font-size: 1rem;

         }

         .arrow {
            width: 35%;
            height: auto;
         }

         .brand-button i {
            font-size: 1rem;
            transition: transform 0.2s ease;
         }

         .brand-button:hover i {
            transform: translateX(2px);
            /* Slight arrow movement on hover */
         }

         .brand-card:hover .brand-footer {
            bottom: 0;
         }

         .brand-card:hover img {
            transform: scale(0.95);
         }

         /* map image section */
         .proven {
            color: #4C5A65;
            font-family: Manrope;
            font-size: 38px;
            font-style: normal;
            font-weight: 800;
            line-height: normal;
         }

         .Measureable_blue_line {
            margin-left: 240px;
            margin-bottom: 10px;
         }

         .text-start h2 {
            color: #4C5A65;
            font-family: Manrope;
            font-size: 20px;
            font-style: normal;
            font-weight: 800;
            line-height: normal;
         }

         .Brands_blue_line {
            margin-left: 75px;
            margin-bottom: 10px;
         }

         .hmm {
            width: 100%;
            color: #1B1B1B;
            font-family: Manrope;
            font-size: 20px;
            font-style: normal;
            font-weight: 400;
            line-height: normal;
         }

         /* Fixed Size Cards */
         .fixed-card {
            background: #fff;
            padding: 20px;
            border-radius: 10px;
            box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
            height: 100%;
         }

         .fixed-card:hover h3,
         .fixed-card:hover p {
            color: white;
         }

         .fixed-card:hover {
            transform: translateY(-10px);
            background: rgba(5, 119, 174, 1);
            box-shadow: 0 15px 30px rgba(0, 0, 0, 0.12);
         }

         .fixed-card h3 {
            color: #0577AE;
            font-family: Manrope;
            font-weight: 600;
            font-size: 18px;
            line-height: 1;
            margin-bottom: 20px;
         }

         .fixed-card p {
            color: #555;
            font-family: Manrope;
            font-weight: 400;
            font-size: 14px;
            line-height: 1.25;
         }

         .object-fit-cover {
            height: 100%;
            width: 100%;
            object-fit: cover;
            border-radius: 10px;
         }

         .video_card {
            height: 464px;
            display: block !important;
         }

         .card_video:hover {
            transform: translateY(-10px);

         }

         /* Responsive Design */
         @media (max-width: 992px) {
            .fixed-card {
               width: 90%;
               height: auto;
               padding: 20px;
               margin-bottom: 20px;
            }

            .fixed-card h3 {
               font-size: 4rem;
            }

            .fixed-card p {
               font-size: 0.95rem;
            }

            .card_video {
               width: 90%;
               height: auto;
               margin-bottom: 20px;
            }

            .map-img {
               width: 100%;
               height: auto;
               object-fit: cover;
            }

            .map-container {
               padding: 0px;
            }

            .col-md-6 {
               flex: 0 0 100%;
               max-width: 100%;
            }
         }

         @media (max-width: 576px) {
            .fixed-card h3 {
               font-size: 1rem;
            }

            .card_video {
               border-radius: 12px;
            }

         }

         /* circle section */

         .insights-section {
            background: #f8f8f8;
            padding: 60px 100px;
            font-family: 'Manrope', sans-serif;
         }

         .insights-container {
            display: flex;
            justify-content: space-between;
            align-items: center;
            max-width: 1200px;
            margin: auto;
            gap: 60px;
         }

         .insights-left h2 {
            font-size: 24px;
            font-weight: 700;
            color: #1a2c2b;
            margin-bottom: 30px;
            line-height: 1.5;
         }

         .cta-button {
            background: var(--CBlue-darak, rgba(5, 119, 174, 1));
            color: white;
            text-decoration: none;
            padding: 14px 28px;
            font-weight: 600;
            font-size: 16px;
            border-radius: 6px;
            display: inline-flex;
            align-items: center;
            gap: 6px;
         }

         .cta-button .arrow {
            font-size: 14px;
         }

         .insights-right {
            flex: 1;
            display: flex;
            justify-content: center;
         }

         .tag-cloud {
            display: flex;
            flex-wrap: wrap;
            gap: 12px;
            max-width: 500px;
            justify-content: center;
         }

         .tag {
            background: transparent;
            border: 2px solid #d0d0d0;
            border-radius: 10px;
            padding: 12px 20px;
            color: #1a2c2b;
            font-weight: 600;
            font-size: 16px;
            min-width: 100px;
            text-align: center;
         }

         .tag.active {
            background: #0577AE;
            color: white;
            border: none;
         }

         .tag.small {
            width: 60px;
            height: 30px;
         }

         .tag.wide {
            width: 180px;
         }

         .tag.tiny {
            width: 40px;
            height: 30px;
         }

         .tag.medium {
            width: 120px;
         }

         /* Map Section */
         .map-container {
            position: absolute;
            left: -100px;
            width: calc(100% + 100px);
            height: 100%;
            overflow: hidden;
         }

         .map-img {
            width: 100%;
            height: 100%;
            object-fit: cover;
         }

         /* Responsive Adjustments */
         @media (max-width: 992px) {
            .fixed-card {
               width: 100%;
               max-width: 280px;
            }
         }

         @media (max-width: 768px) {


            .lead {
               font-size: 18px;
            }

            .map-container {
               position: relative;
               left: 0;
               width: 100%;
               height: 400px;
            }

         }

         @keyframes scroll {
            0% {
               transform: translateX(0);
            }

            100% {
               transform: translateX(-50%);
            }
         }



         /* difficult section */
         .two-panel-layout {
            width: 100%;
            height: auto;
         }

         .left-section {
            width: 50%;
            height: auto;
            /* Set fixed height */
            padding: 24px 40px;
            background: #f9f9f9;
            font-family: 'Segoe UI', sans-serif;
            display: flex;
            flex-direction: column;
            /* Distribute space evenly */
         }


         .section-title {
            color: #1C3A3C;
            font-family: Manrope;
            font-size: 60px;
            font-style: normal;
            font-weight: 800;
            line-height: normal;
            margin-bottom: 0;
         }



         .works_blue-line {
            position: relative;
            left: 133px;
            width: 180px;
            height: 13.389px;
            flex-shrink: 0;
            stroke-width: 8px;
            stroke: var(--CBlue-darak, #0577AE);
            margin-bottom: 30px;
         }



         .step-header {
            display: flex;
            align-items: center;
            gap: 12px;
            cursor: pointer;
         }

         .step-number {
            color: #1C3A3C;
            font-family: Manrope;
            font-size: 32px;
            font-style: normal;
            font-weight: 800;
            line-height: normal;
         }

         .step-title {
            color: #1C3A3C;
            font-family: Manrope;
            margin-top: 0.5rem;
            font-size: 25px;
            font-style: normal;
            font-weight: 800;
            line-height: normal;
         }

         .step-description {
            max-width: 723px;
            color: #31300E;
            font-family: Manrope;
            font-size: 20px;
            font-style: normal;
            font-weight: 500;
            margin: -5px 0px;
            line-height: normal;
            margin-bottom: .5rem;

         }

         .step.active .step-description {
            display: block;
         }

         .divider {
            height: 2px;
            width: 100%;
            background: #ccc;
            margin: 10px 0 0 30px;
            transition: background 0.3s ease, width 0.3s ease;
         }

         .divider.active {
            background: #5ab4e198;
            width: 50%;
         }

         .action-buttons {
            margin-top: 30px;
         }

         .ahoo {
            color: #FFF;
            font-family: Manrope;
            font-size: 20px;
            font-style: normal;
            font-weight: 700;
            line-height: 130%;
            letter-spacing: -0.48px;
            display: flex;
            width: 210px;
            height: 66px;
            justify-content: center;
            align-items: center;
            align-self: stretch;
            display: inline-block;
            background: var(--CBlue-darak, rgba(5, 119, 174, 1));
            color: #fff;
            padding: 20px 32px;
            border-radius: 6px;
            text-decoration: none;
            font-weight: 600;
            margin-bottom: 12px;
         }



         .learn-link {
            margin-top: 20px;
            color: #1C3A3C;
            font-family: Manrope;
            font-size: 24px;
            font-style: normal;
            font-weight: 700;
            line-height: 130%;
            letter-spacing: -0.48px;
            text-decoration-line: underline;
            text-decoration-style: solid;
            text-decoration-skip-ink: none;
            text-decoration-thickness: auto;
            text-underline-offset: auto;
            text-underline-position: from-font;
         }




         /* === RIGHT SECTION: Carousel Animation === */

         .right-section {
            position: relative;
            overflow: hidden;
            padding: 0;
            width: 50%;
            display: flex;
            justify-content: center;
            align-items: center;
         }

         .carousel-container {
            background: url('../assets/blue rectangle.png') no-repeat center center;
            position: relative;
            width: 100%;
            height: 100%;
         }

         .carousel-wrapper {
            position: absolute;
            width: 100%;
            overflow: hidden;
         }

         .upper-carousel {
            top: 40px;
         }

         .lower-carousel {
            bottom: 40px;
         }

         .carousel-track {
            display: flex;
            width: max-content;
            animation: scrollRightToLeft 30s linear infinite;
         }

         .lower-carousel .carousel-track {
            animation: scrollLeftToRight 30s linear infinite;
         }

         .carousel-card {
            width: 270px;
            height: 245px;
            margin: 0px 20px;
            background: white;
            border-radius: 10px;
            box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            flex-shrink: 0;
         }

         .card-content {
            display: flex;
            border-radius: 14px;
            flex-direction: column;
            width: 100%;
            height: 100%;
            align-items: left;
            object-fit: fill;

            background: #F4F5F0;
            box-shadow: 0px 0px 15.184px 0px rgba(0, 0, 0, 0.15);
         }

         .card-content img {
            border-radius: 10px;
            width: 100%;
            height: 100%;
            align-self: stretch;
         }

         @keyframes scrollRightToLeft {
            0% {
               transform: translateX(0);
            }

            100% {
               transform: translateX(-50%);
            }
         }

         @keyframes scrollLeftToRight {
            0% {
               transform: translateX(-50%);
            }

            100% {
               transform: translateX(0);
            }
         }

         @media (max-width: 768px) {
            .two-panel-layout .row {
               flex-direction: column;
            }

            .divider {
               margin-left: 40px;
            }

            .ahoo {
               width: 190px;
               height: 60px;
               margin: auto;
               padding: 16px 23px;
            }

            .carousel-container {
               margin-top: 30px;
            }

            .carousel-wrapper {
               height: 180px;
            }

            .carousel-card {
               width: 140px;
               padding: 12px;
            }
         }

         .form-section {
            display: flex;
            height: 800px;
            gap: 40px;
            font-family: 'Segoe UI', sans-serif;
            padding: 90px 60px;
            box-sizing: border-box;
            align-items: center;
         }

         .form-left,
         .form-right {
            height: 621px;
            border-radius: 10px;
         }

         .form-left {
            flex: 1;
            background-color: #004870;
            color: white;
            padding: 40px;
            display: flex;
            flex-direction: column;
            justify-content: center;
         }

         .form-left h2 {
            align-self: stretch;
            color: #FFF;
            font-family: Manrope;
            font-size: 48px;
            font-style: normal;
            font-weight: 800;
            line-height: normal;
         }

         .form-left p {
            width: 463px;
            color: rgba(255, 255, 255, 0.70);
            ;
            font-family: Manrope;
            font-size: 24px;
            font-style: normal;
            font-weight: 500;
            line-height: normal;
         }

         .form-right {
            flex: 2;
            background: #fff;
            border: 1px solid #ddd;
            padding: 40px;
            display: flex;
            flex-direction: column;
            justify-content: space-between;
            box-sizing: border-box;
         }

         .step-tabs {
            display: flex;
            align-items: center;
            margin-bottom: 20px;
         }

         .step-tabs {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 20px;
            /* space between items */
         }

         .step-tab {
            position: relative;
            color: #1C3A3C;
            font-family: Manrope;
            font-size: 24px;
            font-style: normal;
            font-weight: 800;
            line-height: normal;
            cursor: pointer;
         }

         .step-tab.active {
            color: #0577AE;
         }

         .step-tab::after {
            content: "";
            position: absolute;
            bottom: -6px;
            left: 0;
            width: 100%;
            height: 2px;
            background-color: #0577AE;
            display: none;
         }

         .step-tab.active::after {
            display: block;
         }

         .step-divider {
            width: 30px;
            height: 3px;
            background-color: #0577AE;
            border: none;
            margin: 0 10px;
            border-radius: 1.5px;
         }

         .form-content {
            flex-grow: 1;
         }

         .form-fields {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 20px;
            margin-bottom: 20px;
         }

         .form-group {
            display: flex;
            flex-direction: column;
         }

         .form-group label {
            align-self: stretch;
            color: #1C3A3C;
            font-family: Manrope;
            font-size: 24px;
            font-style: normal;
            font-weight: 800;
            line-height: normal;
         }

         .form-group input {
            height: 60px;
            align-self: stretch;
            border-radius: 8px;
            border: 1px solid #D9D9D9;
            background: #FFF;
         }

         .disclaimer {
            color: #1C3A3C;
            font-family: Manrope;
            font-size: 16px;
            font-style: normal;
            font-weight: 500;
            line-height: normal;
         }

         .continue-btn {
            cursor: pointer;
            width: 30%;
            display: inline-flex;
            height: 62px;
            padding: 15px 30px;
            justify-content: center;
            align-items: center;
            gap: 10px;
            flex-shrink: 0;
            border-radius: 8px;
            background: #D0D0D0;
         }

         .hidden {
            display: none;
         }

         /* footer */
         .custom-footer {
            background-color: #00486c;
            color: white;
            width: 100%;
            height: 497px;
            font-family: 'Segoe UI', sans-serif;
            box-sizing: border-box;
         }

         .footer-content {
            padding: 0px 100px;
            display: flex;
            flex-wrap: wrap;
            justify-content: space-between;
            gap: 40px;
            height: calc(100% - 70px);
            align-items: center;
         }

         .footer-column {
            flex: 1;
            display: flex;
            min-width: 200px;
            flex-direction: column;
            flex-wrap: nowrap;
            align-content: stretch;
            align-items: center;
         }

         .footer-column p {
            color: #FFF;
            ;
            font-family: Manrope;
            font-size: 20px;
            font-style: normal;
            font-weight: 400;
            line-height: normal;
         }

         .footer-column h4 {
            color: #FFF;
            font-family: Manrope;
            font-size: 20px;
            font-style: normal;
            font-weight: 600;
            line-height: normal;
            text-transform: uppercase;
            margin-bottom: 15px
         }

         .footer-column ul li {
            color: #FFF;
            font-family: Manrope;
            font-size: 16px;
            font-style: normal;
            font-weight: 600;
            line-height: 34px;
         }

         .footer-column ul {
            list-style: none;
            padding: 0;
         }

         .footer-column ul li a {
            color: #e0e0e0;
            text-decoration: none;
         }

         .footer-column ul li a:hover {
            text-decoration: underline;
         }

         .footer-logo {
            align-self: flex-start;
            width: 286.821px;
            height: 97.755px;
            flex-shrink: 0;
            aspect-ratio: 286.82/97.76;
            margin-bottom: 20px;
         }

         .social-icons {
            display: flex;
            gap: 18px;
            margin-top: 10px;
         }

         .social-icons i {
            font-size: 25px;
            color: #e0e0e0;
            cursor: pointer;
            transition: color 0.3s;
         }

         .social-icons i:hover {
            color: #6dcef5;
         }

         .footer-bottom {
            display: flex;
            justify-content: center;
            align-items: center;
            width: 100%;
            height: 100px;
            background-color: #013C59;
            border-top: 1px solid rgba(255, 255, 255, 0.1);
            text-align: center;
            font-size: 13px;
            color: #cccccc;
         }

         .footer-bottom a {
            color: #DDD;
            font-family: Roboto;
            font-size: 16px;
            font-style: normal;
            font-weight: 600;
            line-height: normal;
            text-decoration: none;
         }

         .footer-bottom a:hover {
            text-decoration: underline;
         }

         /* about us animations */
         .purpose-accordion-content {
            color: #000;
            font-family: Quicksand;
            font-size: 32px;
            font-style: normal;
            font-weight: 400;
            line-height: 44px;
            /* 137.5% */
            max-height: 0;
            overflow: hidden;
            transition: max-height 0.3s ease;
         }

         .purpose-accordion-item.open .purpose-accordion-content {
            max-height: 200px;
            /* Adjust based on content */
         }

         .purpose-accordion-title {

            color: var(--MAin-text, #1C3A3C);
            font-family: Quicksand;
            font-size: 36px;
            font-style: normal;
            font-weight: 600;
            line-height: 34px;
         }

         .purpose-accordion-title span {
            float: right;
            transition: transform 0.3s ease;
         }

         .purpose-accordion-item.open .purpose-accordion-title span {
            transform: rotate(45deg);
         }

         .about-section {
            border-radius: 20px;
            background: var(--bg-off, #F7F7F7);
            padding: 30px;
            margin-bottom: 50px;
            width: 100%;
         }

         .about-content {
            display: flex;
            flex-direction: column;
            flex-wrap: wrap;

            margin-bottom: 30px;
            align-items: center;
            justify-content: space-between;
         }

         .about-text {
            width: 100%;
            flex: 1 1 50%;
            min-width: 300px;
         }

         .section-length {
            width: 100%;
            margin-bottom: 20px;
         }

         .section-label {
            color: #4C5A65;
            font-family: Manrope;
            font-size: 40px;
            font-weight: 600;
         }

         .How-it-works-title {
            color: #4C5A65;
            font-family: Manrope;
            font-size: 50px;
            font-weight: 800;
            line-height: 1.2;
         }

         .description {
            word-spacing: -1px;
            max-width: 1000px;
            color: #4C5A65;
            font-family: Manrope;
            font-size: 24px;
            font-weight: 400;
            margin-bottom: 20px;
         }

         .buttons {
            display: flex;
            flex-wrap: wrap;
            gap: 10px;
         }

         .btn {
            padding: 10px 18px;
            border-radius: 5px;
            text-decoration: none;
            font-weight: bold;
            font-size: 14px;
         }

         .btn-primary {
            color: var(--CBlue-darak, #0577AE);
            background: #fff;
            display: flex;
            padding: 15px 25px;
            justify-content: center;
            align-items: center;
            border-radius: 10px;
            font-size: 16px;
            font-weight: bold;
         }

         .btn-secondary {
            background-color: #eee;
            color: #333;
            padding: 15px 25px;
            border-radius: 10px;
            font-size: 16px;
            font-weight: bold;
         }

         .about-image {
            width: 100%;
            flex: 1 1 45%;
            min-width: 300px;
         }

         .about-image img {
            width: 100%;
            border-radius: 10px;
            object-fit: cover;
         }

         .stats {
            background: var(--CBlue-darak, #0577AE);
            border-radius: 30px;
            display: flex;
            flex-wrap: wrap;
            justify-content: space-evenly;
            align-items: center;
            padding: 40px 20px;
            margin-top: 30px;
         }

         .stat-box {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            min-width: 150px;
            max-width: 200px;
            text-align: center;
         }

         .stat-box h2 {
            color: #ffffff;
            font-family: Manrope;
            font-size: 90px;
            font-weight: 700;
            letter-spacing: -1px;
         }

         .stat-box p {
            color: #ffffff;
            font-family: Manrope;
            font-size: 24px;
            font-weight: 400;
         }



         @media (max-width: 992px) {
            .about-content {
               flex-direction: column;
            }





            .btn-primary,
            .btn-secondary {
               width: 100%;
            }
         }



         /* the expandables */

         /* Custom accordion styles */
         .custom-accordion {
            width: 100%;
            background-color: #fff;
            border: none;
         }

         .custom-accordion .accordion-item {
            border-bottom: 1px solid #ddd;
            background-color: #f9f9f9;
         }

         .custom-accordion .accordion-button {
            background-color: #fff;
            color: #002e34;
            font-size: 20px;
            font-weight: 500;
            padding: 20px;
            transition: background-color 0.3s;
         }

         .custom-accordion .accordion-button:not(.collapsed) {
            background-color: #0074a6;
            color: #fff;
         }

         .custom-accordion .accordion-body {
            padding: 20px;
            background-color: #f9f9f9;
         }

         .custom-accordion .list {
            flex: 1;
            list-style-type: disc;
            padding-left: 75px;
            font-size: 20px;
            color: #333;
         }

         .custom-accordion .list li {
            color: #555;
            font-family: manrope;
            font-weight: bold;
            margin-bottom: 10px;
         }

         .accordion-body img {
            border-radius: 10px;
         }

         .custom-accordion .accordion-img {
            flex: 1;
            width: 647px;
            height: 383px;
            object-fit: contain;
            border-radius: 8px;

            margin-left: 40px;
         }

         /* Responsive layout */
         @media (max-width: 768px) {
            .accordion-body {
               flex-direction: column !important;
            }

            .custom-accordion .accordion-img {
               margin: 20px 0 0 0;
            }
         }

         /* we care */
         /* === Section 1: We Care === */
         .section-care {
            width: 100%;
            height: auto;
            margin-bottom: 10px;
            margin-left: auto;
            margin-right: auto;
            display: flex;
            justify-content: space-between;
            align-items: flex-start;
         }

         .care-text {
            max-width: 50%;
         }

         .care-text h2 {
            width: 552px;
            height: 120px;
            color: var(--Text, #1C3A3C);
            font-family: Manrope;
            font-size: 64px;
            font-style: normal;
            font-weight: 800;
            line-height: 65px;
         }

         .care-text p {
            margin: 30px 0px;
            height: 80px;
            width: 573px;
            align-self: stretch;
            color: #1B1B1B;
            font-family: Quicksand;
            font-size: 24px;
            font-style: normal;
            font-weight: 400;
            line-height: 30px;
         }

         .care-feature {
            gap: 20px;
            width: 551px;
            height: 87px;
            display: flex;
            align-items: center;
            background-color: #f1f4f6;
            padding: 0px 24px;
            border-radius: 19px;
            margin-bottom: 30px;
         }

         .dot {
            display: flex;
            width: 31.334px;
            height: 31.334px;
            padding: 12px 10px;
            flex-direction: column;
            align-items: flex-start;
            gap: 10px;
            border-radius: 15.667px;
            background: var(--CBlue-darak, #0577AE);
         }

         .dot p {
            color: #1C3A3C;
            font-family: Manrope;
            font-size: 24px;
            font-style: normal;
            font-weight: 600;
            line-height: normal;

         }

         .care-button {
            border: 0;
            display: flex;
            width: 180px;
            height: 65px;
            padding: 20.923px 34px;
            justify-content: center;
            align-items: center;
            gap: 13.077px;
            flex-shrink: 0;
            border-radius: 10.462px;
            background: var(--CBlue-darak, #0577AE);
            color: #FFF;
            font-family: Manrope;
            font-size: 20px;
            font-style: normal;
            font-weight: 700;
            line-height: 130%;
         }

         .care-image {
            width: 50%;
            height: 100%;
            position: relative;
            flex-shrink: 0;
            border-radius: 20px;
            overflow: hidden;
            object-fit: fill;
         }

         .care-image img {
            width: 100%;
            height: 100%;
         }

         .explore-button {
            display: flex;
            justify-content: center;
            align-items: center;
            position: absolute;
            bottom: 18px;
            right: 20px;
            z-index: 2;
            background: white;
            color: #1f2d2f;
            padding: 20px 25px;
            border-radius: 8px;
            font-weight: 500;
            text-decoration: none;
            width: 293px;
            height: 92px;
            flex-shrink: 0;
            border-radius: 20px;
            background: #FFF;
         }

         .explore-button-class-one {
            padding-top: 10px;
         }

         .explore-button-class-one h1 {
            color: #1D2425;
            font-family: Manrope;
            font-size: 16px;
            font-style: normal;
            font-weight: 600;
            line-height: normal;
         }

         .explore-button-class-one p {
            color: #1D2425;
            font-family: Manrope;
            font-size: 14px;
            font-style: normal;
            font-weight: 400;
            line-height: normal;
         }

         .explore-button-class-two {
            display: flex;
            justify-content: center;
            align-items: center;
            width: 40px;
            height: 40px;
            flex-shrink: 0;
            aspect-ratio: 1/1;
            border-radius: 750px;
            background: var(--CBlue-darak, #0577AE);
         }

         .explore-button-class-two svg {
            width: 13px;
            height: 12.235px;
            flex-shrink: 0;
            stroke-width: 2.294px;
            stroke: var(--White, #FFF);
         }

         /* we care k abad wala */
         .section-certifications {
            width: 100%;
            height: 723px;
            margin: 0 auto;
            padding: 60px 100px;
            background: var(--CBlue-darak, #0577AE);
            box-sizing: border-box;
         }

         .cert-header {
            display: flex;
            justify-content: space-between;
            align-items: start;
            margin-bottom: 40px;
         }

         .cert-header h2 {
            color: var(--Text, #ffffff);
            font-family: Manrope;
            font-size: 64px;
            font-style: normal;
            font-weight: 800;
            line-height: 73px;
         }

         .cert-header p {
            max-width: 60%;
            margin-top: 30px;
            color: rgba(255, 255, 255, 0.7);
            font-family: Quicksand;
            font-size: 24px;
            font-style: normal;
            font-weight: 400;
            line-height: 34px;
         }

         .cert-header a {
            color: #1B1B1B;
            font-family: Quicksand;
            font-size: 24px;
            font-style: normal;
            font-weight: 600;
            line-height: 34px;
            text-decoration-line: underline;
            text-decoration-style: solid;
            text-decoration-skip-ink: auto;
            text-decoration-thickness: auto;
            text-underline-offset: auto;
            text-underline-position: from-font;
         }

         .cert-icons {
            display: flex;
            gap: 15px;
            flex-wrap: wrap;
         }

         .cert-card {
            width: 214px;
            height: 332px;
            flex-shrink: 0;
            background: white;
            border-radius: 20px;
            padding: 25px 30px;
            display: flex;
            flex-direction: column;
            align-items: flex-start;
            justify-content: space-between;
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.05);
         }

         .cert-card img {
            width: 89px;
            height: 102px;
            flex-shrink: 0;
            aspect-ratio: 47 / 43;
            object-fit: contain;
            margin-bottom: 15px;
         }

         .cert-card p {
            color: rgba(27, 27, 27, 0.70);
            font-family: Quicksand;
            font-size: 16px;
            font-style: normal;
            font-weight: 400;
            line-height: normal;
         }

         /* purpose */
         .section-purpose {
            width: 100%;
            margin: 0 auto;
            padding-top: 60px;
            padding-left: 40px;
            padding-right: 40px;
            display: flex;
            justify-content: space-between;
            gap: 60px;
            box-sizing: border-box;
         }

         .purpose-left {
            width: 50%;
         }

         .purpose-left h2 {
            color: var(--Text, #1C3A3C);
            font-family: Manrope;
            font-size: 63px;
            font-style: normal;
            font-weight: 800;
            line-height: 93px;
            letter-spacing: -3.999px;
         }

         .purpose-left p {
            color: #1B1B1B;
            font-family: Quicksand;
            font-size: 24px;
            font-style: normal;
            font-weight: 400;
            line-height: 34px;
         }

         .purpose-right {
            width: 50%;
            display: flex;
            flex-direction: column;
            gap: 20px;
         }

         .purpose-accordion-item {
            border-bottom: 1px solid #ccc;
            padding: 12px 0;
         }

         .purpose-accordion-title {
            color: var(--MAin-text, #1C3A3C);
            font-size: 36px;
            font-family: Quicksand;
            font-weight: 600;
            line-height: 34px;
            word-wrap: break-word
         }

         .purpose-accordion-content {
            margin: 10px 0px;
            color: #000;
            font-family: Quicksand;
            font-size: 32px;
            font-style: normal;
            font-weight: 400;
            line-height: 44px;
            /* 137.5% */
         }

         /* By default, only the first one is open */
         .accordion-item:not(.open) .accordion-content {
            display: none;
         }

         /* about us */
         .about-us-top {
            border-radius: 20px;
            background: var(--CBlue-darak, #0577AE);
            display: flex;
            width: 100%;
            height: 262px;
            padding: 54px 51px;
            margin-bottom: 30px;
         }

         .contact-us-top-left {
            width: 60%;
         }

         .contact-us-top-left h4 {
            color: #ffffff;
            font-family: Manrope;
            font-size: 28px;
            font-style: normal;
            font-weight: 500;
            line-height: normal;
         }

         .contact-us-top-left h1 {
            color: #ffffff;
            font-family: Manrope;
            font-size: 74.299px;
            font-style: normal;
            font-weight: 800;
            line-height: 91px;
         }

         .contact-us-top-right p {
            max-width: 833px;
            color: #ffffff;
            font-family: Manrope;
            font-size: 24px;
            font-style: normal;
            font-weight: 400;
            line-height: normal;
         }

         .gallery-up-top {
            border-radius: 20px;
            background: var(--CBlue-darak, #0577AE);
            display: flex;
            width: 100%;
            height: 262px;
            padding: 54px 51px;
            margin-bottom: 30px;
         }

         .gallery-up-top-left {
            width: 60%;
         }

         .gallery-up-top-left h4 {
            color: #ffffff;
            font-family: Manrope;
            font-size: 28px;
            font-style: normal;
            font-weight: 500;
            line-height: normal;
         }

         .gallery-up-top-left h1 {
            color: #ffffff;
            font-family: Manrope;
            font-size: 74.299px;
            font-style: normal;
            font-weight: 800;
            line-height: 91px;
         }


         .contact-us-container {
            height: 1073px;
            display: flex;
            flex-direction: column;
            gap: 30px;
         }

         .contact-us-header {
            display: flex;
            justify-content: space-between;
            align-items: flex-start;
         }

         .contact-us-header-title {
            font-size: 48px;
            font-weight: bold;
            margin: 0;
         }

         .contact-us-header-title p {
            color: #2C2C2C !important;
            font-family: Figtree !important;
            font-size: 20px !important;
            font-style: normal !important;
            font-weight: 500 !important;
            line-height: 100% !important;
            /* 20px */
            letter-spacing: 0.2px !important;
            text-transform: uppercase !important;

         }

         .contact-us-header-title h1 {
            color: #2C2C2C !important;
            font-family: Figtree !important;
            font-size: 32px !important;
            font-style: normal !important;
            font-weight: 400 !important;
            line-height: 34.054px !important;
            /* 106.419% */

         }

         .email-oper p {

            color: #2C2C2C;
            font-family: Figtree;
            font-size: 20px;
            font-style: normal;
            font-weight: 500;
            line-height: 100%;
            /* 20px */
            letter-spacing: 0.2px;
            text-transform: uppercase;
            margin: 5px 0px;
         }

         .email-oper h1 {
            color: #2C2C2C;
            font-family: Figtree;
            font-size: 32px;
            font-style: normal;
            font-weight: 400;
            line-height: 34.054px;
            /* 106.419% */

         }

         .contact-us-header-subtitle {
            max-width: 600px;
            font-size: 16px;
         }

         .contact-us-info-section {
            display: flex;

         }

         .contact-us-details {
            padding: 30px 30px;
            display: flex;
            width: 100%;
            flex-direction: column;
            gap: 20px;
         }

         .contact-us-detail-item {
            display: flex;
            align-items: center;
            gap: 10px;
            font-size: 16px;
         }


         .phone-envelop {
            background: var(--bg-off, #F7F7F7);
            width: 60.919px;
            height: 60.919px;
            padding: 10px 11px;
            border-radius: 50%;
         }

         .phone-envelop img {
            width: 38.919px;
            height: 38.919px;
            flex-shrink: 0;
         }

         .contact-us-map {
            width: 100%;
            height: 530px;
            flex-shrink: 0;
         }

         .contact-us-map iframe {
            width: 100%;
            height: 100%;
            border: 0;
         }

         .contact-us-form-section {
            display: flex;
            gap: 30px;
         }

         .contact-us-form {
            border-radius: 25px;
            background: var(--bg-off, #F7F7F7);

            margin-top: 20px;
            display: flex;
            width: 100%;
            padding: 10px 10px;


         }

         .contact-us-form-inner {

            padding: 30px 30px;
            gap: 20px;
            display: flex;
            flex-direction: column;

         }

         .contact-us-form-inner p {
            color: #1C3A3C;
            font-family: Manrope;
            font-size: 16px;
            font-style: normal;
            font-weight: 500;
            line-height: normal;
         }

         .contact-us-form-title-data {
            color: #1C3A3C;
            font-family: Manrope;
            font-size: 22px;
            font-style: normal;
            font-weight: 800;
            line-height: normal;
         }

         .contact-us-form-inner input {
            height: 65px;
            align-self: stretch;
            border-radius: 8px;
            border: 1px solid #D9D9D9;
            background: #FFF;

         }

         .contact-us-form-title {
            font-size: 18px;
            margin-bottom: 20px;
         }

         .contact-us-form input {
            width: 100%;
            padding: 10px;
            margin-bottom: 15px;
            border: 1px solid #ccc;
         }

         .contact-us-form button {
            color: #FFF;
            border: 0;
            border-radius: 10px;
            background: var(--CBlue-darak, #0577AE);
            display: flex;
            padding: 25px 0px;
            justify-content: center;
            align-items: center;
            align-self: stretch;
         }

         .contact-us-socials {
            padding: 30px 30px;
            display: flex;
            flex-direction: column;
            gap: 15px;
            align-items: flex-start;
            margin-top: 30px;
         }

         .contact-us-socials {
            display: flex;
            flex-direction: column;
            gap: 10px;
            align-items: flex-start;
            margin-top: 20px;
         }

         .social-icons {
            display: flex;
            gap: 15px;
            margin-top: 10px;
         }

         .social-icon {
            width: 40px;
            height: 40px;
            display: flex;
            align-items: center;
            justify-content: center;
            border-radius: 8px;
            background-color: #f0f0f0;
            /* Light circle */
            font-size: 18px;
            transition: all 0.3s ease;
            text-decoration: none;
         }

         .social-icon i {
            color: #0a0000;
            /* Dark icon */

         }

         .social-icon:hover {
            background-color: #2c2c2c;
            /* Dark background on hover */
            color: #ffffff;
            /* Light icon on hover */
         }

         .sicial {
            width: 32px;
            height: 0px;
            stroke-width: 2px;
            stroke: #2C2C2C;
         }


         .Gallery-button {
            color: var(--MAin-text, #1C3A3C);
            font-family: Manrope;
            font-size: 20px;
            text-decoration: none;
            font-style: normal;
            font-weight: 700;
            line-height: 100%;
            display: flex;
            width: fit-content;
            height: 75px;
            padding: 30px 26px;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            gap: 10px;
            flex-shrink: 0;
            border-radius: 20px;
            border: 1px solid var(--MAin-text, #1C3A3C);
         }

         .Gallery-button:hover {
            background: #0577AE;
            color: white;
            border: 0;

         }

         .ninety {
            width: 98% !important;
         }

         .ninety-six {
            width: 96% !important;
         }



         .gallery-top img {
            width: 844px;
            height: 479px;
            flex-shrink: 0;

         }

         .gallery-bottom {
            width: 100%;
            height: auto;
            object-fit: fill;
            flex-shrink: 0;
         }

         /* Products Page */
         .below-header {
            height: 90px;
            background-color: #1B7BB3;
            border-radius: 5px;
         }

         .below-header-left {
            border-radius: 5px;
            width: 25%;
            position: relative;
            right: 15px;
            color: var(--bg-off, #F7F7F7);
            font-family: Manrope;
            font-size: 25px;
            font-style: normal;
            font-weight: 400;
            line-height: 130%;
            /* 26px */
            letter-spacing: -0.4px;
            justify-content: center;
            align-items: center;
            background-color: #1390CC;
         }

         .below-header-left p {
            padding-top: 15px;
         }

         .below-header-middle {
            width: 60%;
            display: flex;
            justify-content: center;
            align-items: center;
         }

         .below-header-middle p {
            padding-top: 8px;
            color: var(--bg-off, #F7F7F7);
            font-family: Manrope;
            font-size: 34px;
            font-style: normal;
            font-weight: 400;
            line-height: 130%;
            /* 26px */
            letter-spacing: -0.4px;
         }

         .below-header-right {
            display: flex;
            align-items: center;
            justify-content: end;
            width: 25%;
            padding: 5px 5px;
         }

         .below-header-right-white-section {
            display: flex;
            width: 85px;
            padding: 10px 14px;
            align-items: center;
            gap: 14px;
            border-radius: 5px;
            background: #FFF;
         }


         .below-header-right-white-section h2 {
            color: #7D868E;
            font-family: Manrope;
            font-size: 20px;
            font-style: normal;
            font-weight: 500;
            line-height: normal;
            padding-top: 4px;
         }


         /* below side bar */
         .product-home-container {
            padding: 20px;
            position: relative;
         }

         .product-home-heading {
            text-align: left;
            margin-bottom: 20px;
            margin-left: 20px;
         }

         .product-home-heading h2 {
            color: var(--MAin-text, #1C3A3C);
            text-align: center;
            font-family: Manrope;
            font-size: 32px;
            font-style: normal;
            font-weight: 600;
            line-height: normal;
            text-transform: capitalize;
         }

         /* Product section */
         .product-home-section-container {
            position: relative;
            width: 100%;
            overflow: hidden;
         }

         .product-home-section {
            display: flex;
            flex-wrap: wrap;
            gap: 15px;
            padding: 0;
            transition: transform 0.5s ease;
            width: 100%;
         }

         /* Product card */
         .product-home-card {
            width: 32%;
            height: 356.782px;
            background-color: #f8f9fa;
            border-radius: 15px;
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
            position: relative;
            overflow: hidden;
            transition: all 0.3s ease;
            flex-shrink: 0;
         }

         /* Image container */
         .product-home-image-container {
            margin-top: 20px;
            mix-blend-mode: multiply;
            width: 313.494px;

            height: auto;
            margin: -70px auto 0px;
            transition: all 0.3s ease;
            flex-shrink: 0;
            aspect-ratio: 162.49 / 195.38;
            transition: all 0.3s ease;
         }

         .product-home-image-container img {
            width: 100%;
            height: 100%;
            object-fit: contain;
            transition: transform 0.3s ease;
         }

         .product-home-card:hover .product-home-image-container {
            transform: translateY(50px);
         }

         /* Product info - aligned */
         .product-home-info {
            position: absolute;
            bottom: 25px;
            left: 30px;
            right: 30px;
            text-align: left;
            transition: all 0.3s ease;
            opacity: 1;
            transform: translateY(0);
         }

         .product-home-card:hover .product-home-info {
            opacity: 0;
            transform: translateY(20px);
         }

         .product-home-info h2 {
            color: #1C3A3C;
            font-family: Manrope;
            font-size: 22.509px;
            font-style: normal;
            font-weight: 700;
            line-height: 130%;
            /* 29.262px */
            letter-spacing: -0.45px;
         }

         .product-home-info p {
            color: #1C3A3C;
            font-family: Manrope;
            font-size: 14.068px;
            font-style: normal;
            font-weight: 400;
            line-height: 130%;
            /* 18.289px */
            letter-spacing: -0.281px;
         }

         .product-home-footer {
            position: absolute;
            bottom: 0;
            left: 0;
            right: 0;
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 20px 30px;
            color: #1C3A3C;
            border-bottom-left-radius: 15px;
            border-bottom-right-radius: 15px;
            transform: translateY(100%);
            transition: all 0.3s ease;
         }

         .product-home-card:hover .product-home-footer {
            transform: translateY(0);
         }

         .product-home-footer-info h3 {
            margin: 0;
            font-size: 20px;
            font-weight: 700;
         }

         .product-home-footer-info p {
            margin: 5px 0 0;
            font-size: 14px;
            opacity: 0.8;
         }

         .product-home-footer-button {
            background: #0577AE;
            border: none;
            color: white;
            cursor: pointer;
            padding: 8px;
            width: 50px;
            height: 50px;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
         }

         .add-to-cart.in-cart {
            background-color: red;
            transform: rotateX(180deg);
            /* or any style to show it's active */
         }

         .product-home-nav-buttons {
            display: flex;
            justify-content: center;

            margin-top: 30px;
         }

         .product-home-nav-button {
            display: flex;
            width: 80px;
            height: 80px;
            padding: 26.371px;
            flex-direction: column;
            align-items: flex-start;
            gap: 8.241px;
            background: none;
            border: none;
            cursor: pointer;
            padding: 10px;
            object-fit: fill;
            overflow: hidden;
         }

         .product-home-nav-button img {
            width: 100%;
            height: 100%;
         }


         .product-home-nav-button:disabled {
            opacity: 0.5;
            cursor: not-allowed;
         }

         .shop-retail {
            width: 100%;
            height: 513px;
            gap: 20px;
            margin-bottom: 20px;
         }

         .shop-retail-left {
            width: 22%;
            height: auto;
            flex-shrink: 0;
            overflow: hidden;
            object-fit: fill;
         }

         .shop-retail-left img {
            width: 100%;
            height: 100%;
         }

         .shop-retail-right {
            display: flex;
            gap: 20px;
            height: 100%;
            width: 75%;
            flex-shrink: 0;
            overflow: hidden;
            object-fit: contain;
            flex-direction: column;
         }

         .shop-retail-right-inner {
            height: 100%;
         }

         .shop-retail-right-top {
            height: 100%;
            gap: 20px;
         }

         .shop-retail-right-top-left {
            border-radius: 10px;
            width: calc(50% - 10px);
            height: auto;
            object-fit: fill;
            overflow: hidden;
         }

         .shop-retail-right-top-left img {

            width: 100%;
            height: 100%;

         }

         .shop-retail-right-top-right {
            border-radius: 10px;
            width: calc(50% - 10px);
            height: auto;
            flex-shrink: 0;
            overflow: hidden;
            object-fit: fill;
         }

         .shop-retail-right-top-right img {
            width: 100%;
            height: 100%;
         }

         .shop-retail-right-bottom {
            background: var(--bg-off, #F7F7F7);
            display: flex;
            border-radius: 10px;
            width: 100%;
            height: 30%;
            padding: 25px 0px;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            gap: 10px;
            flex-shrink: 0;
         }

         .shop-retail-right-bottom h1 {
            color: var(--MAin-text, #1C3A3C);
            text-align: center;
            font-family: Manrope;
            font-size: 27.803px;
            font-style: normal;
            font-weight: 700;
            line-height: normal;
         }

         .shop-retail-right-bottom span {
            color: var(--CBlue-darak, #0577AE);
            font-family: Manrope;
            font-size: 27.803px;
            font-style: normal;
            font-weight: 700;
            line-height: normal;
         }

         .shop-retail-right-bottom p {
            color: var(--MAin-text, #1C3A3C);
            text-align: center;
            font-family: Manrope;
            font-size: 20.852px;
            font-style: normal;
            font-weight: 500;
            line-height: normal;
         }

         /* product home we care */
         .product-home-section-care {
            padding: 0px 20px;
            width: 100%;
            height: auto;
            margin: 0 auto;
            display: flex;
            gap: 20px;
            align-items: flex-start;
            justify-content: space-evenly;
         }

         .product-home-care-text {
            margin-top: 20px;
            width: 33%;
            display: flex;
            flex-direction: column;
         }

         .product-home-care-text h2 {
            width: 100%;
            height: 150.789px;
            color: var(--Text, #1C3A3C);
            font-family: Manrope;
            font-size: 60px;
            font-style: normal;
            font-weight: 800;
            line-height: 65px;
         }

         .product-home-care-text p {
            color: rgba(76, 90, 101, 0.70);
            ;
            font-family: Manrope;
            word-spacing: 0px;
            font-size: 20px;
            font-style: normal;
            font-weight: 400;
            line-height: normal;
         }

         .product-home-care-feature {
            width: 89%;
            gap: 30px;
            display: flex;
            height: 80px;
            padding: 26px 22px;
            border-radius: 20px;
            background: #F8F9FD;
            justify-content: start;
            align-items: flex-start;
            margin-bottom: 15px;
         }

         .product-home-dot {
            width: 24px;
            height: 24px;
            border-radius: 50%;
            display: flex;
            justify-content: center;
            align-items: center;
            flex-shrink: 0;
            background: var(--CBlue-darak, #0577AE);
         }

         .product-home p {
            color: #1C3A3C;
            ;
            word-spacing: 2px;
            font-family: Manrope;
            font-size: 18px;
            font-style: normal;
            font-weight: 600;
            line-height: normal;
         }

         .product-home-care-button {
            border: 0;
            display: flex;
            width: 200px;
            height: 65.254px;
            padding: 20.923px 34px;
            justify-content: center;
            align-items: center;
            gap: 13.077px;
            flex-shrink: 0;
            border-radius: 10.462px;
            background: var(--CBlue-darak, #0577AE);
            color: #FFF;
            font-family: Manrope;
            font-size: 20.923px;
            font-style: normal;
            font-weight: 700;
            line-height: 130%;
            /* 27.2px */
         }

         .product-home-care-image {

            width: auto;
            height: 620px;
            position: relative;
            border-radius: 20px;
            overflow: hidden;
            object-fit: cover;
         }

         .product-home-care-image img {
            width: 100%;
            height: 100%;

         }

         .product-home-explore-button {
            display: flex;
            justify-content: center;
            align-items: center;
            position: absolute;
            bottom: 40px;
            right: 40px;
            z-index: 2;
            background: white;
            color: #1f2d2f;
            padding: 20px 25px;
            border-radius: 8px;
            font-weight: 500;
            text-decoration: none;
            width: 372px;
            height: 111px;
            flex-shrink: 0;
            border-radius: 20px;
            background: #FFF;
         }

         .product-home-explore-button-class-one {
            padding-top: 10px;
         }

         .product-home-explore-button-class-one h1 {
            color: #1D2425;
            font-family: Manrope;
            font-size: 20px;
            font-style: normal;
            font-weight: 600;
            line-height: normal;
         }

         .product-home-explore-button-class-one p {
            color: #1D2425;
            font-family: Manrope;
            font-size: 16px;
            font-style: normal;
            font-weight: 400;
            line-height: normal;
         }

         .product-home-explore-button-class-two {
            display: flex;
            justify-content: center;
            align-items: center;
            width: 72px;
            height: 72px;
            flex-shrink: 0;
            aspect-ratio: 1/1;
            border-radius: 750px;
            background: var(--CBlue-darak, #0577AE);
         }

         .product-home-explore-button-class-two svg {
            width: 13px;
            height: 12.235px;
            flex-shrink: 0;
            stroke-width: 2.294px;
            stroke: var(--White, #FFF);
         }

         .product-home-we-care-right {
            display: flex;
            flex-direction: column;
            gap: 20px;
         }

         .product-home-we-care-right-card {
            display: flex;
            justify-content: space-between;
            width: 300px;
            height: 290px;
            padding: 20px 25px;
            align-items: left;
            gap: 10px;
            align-self: stretch;
            border-radius: 10px;
            background: var(--bg-off, #F7F7F7);
         }

         .product-home-we-care-right-card p {
            color: rgba(76, 90, 101, 0.70);
            font-family: Manrope;
            word-spacing: 0px;
            font-family: Manrope;
            font-size: 20px;
            line-height: normal;
         }

         .product-home-we-care-right-card h3 {
            color: #1C3A3C;
            font-family: Manrope;
            font-size: 16px;
            font-style: normal;
            font-weight: 500;
            line-height: normal;
         }

         .heading-sev h1 {
            color: #1C3A3C;
            font-family: Manrope;
            font-size: 22px;
            font-style: normal;
            word-spacing: 0px;
            font-weight: 600;
            line-height: normal;
            width: 160.766px;
         }

         .product-home-svg {
            display: flex;
            justify-content: center;
            align-items: center;
            width: 50px;
            height: 50px;
            border-radius: 30px;
            background: var(--CBlue-darak, #0577AE);
         }

         /* product info page */
         .product-section {
            border-radius: 20px;
            background: var(--bg-off, #F7F7F7);
            display: flex;
            width: 1720px;
            padding: 70px 120px;
            justify-content: space-between;
            align-items: center;
            gap: 108px;
         }

         .product-image {
            display: flex;
            width: 570px;
            height: 530px;
            padding: 8px 79px;
            justify-content: center;
            align-items: center;
            gap: 10px;
            flex-shrink: 0;
            mix-blend-mode: multiply;
         }

         .product-image img {
            width: 100%;
            height: 100%;
            flex-shrink: 0;
            object-fit: contain;
         }

         .product-details {
            justify-content: center;
            gap: 20px;
            height: 530px;
            margin: auto 0px;
         }

         .product-details h2 {
            font-size: 24px;
            font-weight: 700;
            margin-bottom: 10px;
         }

         .buttons {
            display: flex;
            gap: 15px;
            margin-bottom: 20px;
         }

         .product-page-footer-button {
            border: 0;
            display: flex;
            width: 217.079px;
            padding: 20.923px 34px;
            justify-content: center;
            align-items: center;
            gap: 13.077px;
            border-radius: 10.46px;
            background: var(--CBlue-darak, #0577AE);
         }

         .product-page-footer-button.in-cart {
            transform: rotateX(180deg);
            background-color: #e74c3c;
         }

         .product-page-footer-button:hover {
            background-color: #007bff;
            color: #fff;

         }

         .quote-button {
            border: 2px black;
            display: flex;
            width: 217.079px;
            padding: 20.923px 34px;
            justify-content: center;
            align-items: center;
            gap: 13.077px;
            border-radius: 10.46px;
            background: var(--CBlue-darak, #ffffff);
         }

         .quote-button:hover {
            background-color: #007bff;
            color: #fff;
         }

         .tags {
            display: flex;
            gap: 10px;
         }

         .tag {
            padding: 5px 10px;
            border-radius: 6px;
            font-size: 14px;
            font-weight: 500;
            display: inline-flex;
            align-items: center;
            gap: 6px;
         }

         .tag.eco {
            background-color: #d4f5d0;
            color: #2f8f2f;
         }

         .tag.bio {
            background-color: #e0f7f1;
            color: #1a9e89;
         }

         /* cart page */
         .cart-page-container {
            display: flex;
            flex-direction: column;
            gap: 20px;
         }

         @media (min-width: 900px) {
            .cart-page-container {
               flex-direction: row;
            }
         }

         .cart-page-cart {
            gap: 20px;
            padding: 30px 30px;
            width: 70%;
            flex-shrink: 0;
            border-radius: 10px;
            background: var(--bg-off, #F7F7F7);
         }

         .cart-page-cart-header {
            display: flex;
            justify-content: space-between;
            align-items: center;
         }

         .cart-page-cart-header h2 {
            margin: 0;
         }

         .cart-page-continue-shopping {
            font-size: 14px;
            color: #007bff;
            text-decoration: none;
         }

         .cart-page-item {
            display: flex;
            align-items: flex-start;
            border-top: 1px solid #ddd;
            padding: 15px 0;
         }

         .cart-page-item-image {
            width: 164px;
            height: 154px;
            background-color: #ccc;
            margin-right: 15px;
         }

         .cart-page-item-image img {
            width: 100%;
            height: 100%;
         }

         .cart-page-item-details {
            flex: 1;
         }

         .cart-page-item-details h3 {
            color: #1C3A3C;
            font-family: Manrope;
            font-size: 24px;
            font-style: normal;
            font-weight: 800;
            line-height: 125.815%;
            /* 30.196px */
         }

         .cart-page-item-details p {
            color: rgba(76, 90, 101, 0.70);
            ;
            font-family: Manrope;
            font-size: 16.548px;
            font-style: normal;
            font-weight: 400;
            line-height: normal;
         }

         .cart-page-remove-button {
            display: flex;
            width: 142px;
            height: 46.461px;
            padding: 13.692px 22.249px;
            justify-content: center;
            align-items: center;
            gap: 8.557px;
            flex-shrink: 0;
            border-radius: 6.845px;
            border: 0.856px solid var(--MAin-text, #1C3A3C);
         }

         .cart-page-remove-button:hover {
            background-color: #f0f0f0;
         }

         .cart-page-quote-box {
            height: 435px;
            flex: 1;
            padding: 25px;
            box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
            border-radius: 10px;
            background: var(--bg-off, #F7F7F7);
         }

         .cart-page-quote-box h2 {
            color: #1C3A3C;
            font-family: Manrope;
            font-size: 36px;
            font-style: normal;
            font-weight: 800;
            line-height: 125.815%;
            /* 45.294px */
         }

         .cart-page-quote-box p {
            color: rgba(76, 90, 101, 0.70);
            ;
            font-family: Manrope;
            font-size: 20px;
            font-style: normal;
            font-weight: 400;
            line-height: normal;
         }

         .cart-page-quote-button {
            text-decoration: none;
            text-emphasis: none;
            display: flex;
            border: 0;
            font-size: 20px;
            width: 217.079px;
            padding: 20.923px 34px;
            color: #FFF;
            justify-content: center;
            align-items: center;
            gap: 13.077px;
            border-radius: 10.46px;
            background: var(--CBlue-darak, #0577AE);
         }

         .cart-page-quote-button:hover {
            transform: translateY(-2px);
         }

         /* circle section */
         /* circle section */
         .section {
            width: 100%;
            height: auto;
            margin: 0px auto;
            display: flex;
            background: white;
            box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
            border-radius: 12px;
            overflow: hidden;
         }

         .left {
            background: #F7F7F7;
            flex: 1;
            width: 60%;
            padding: 39px 27px;
            display: flex;
            flex-direction: column;
            justify-content: space-between;
            background-color: #f7f9fc;
         }

         .left h2 {
            color: var(--Text, #1C3A3C);
            font-family: Manrope;
            font-size: 40px;
            font-style: normal;
            font-weight: 800;
            line-height: normal;
         }

         .left button {
            font-size: 24px;
            color: #FFF;
            border: 0;
            display: flex;
            width: 211.695px;
            height: 64.831px;
            padding: 15px 30px;
            justify-content: center;
            align-items: center;
            gap: 10px;
            flex-shrink: 0;
            border-radius: 8px;
            background: var(--CBlue-darak, rgba(5, 119, 174, 1));
         }

         .left button:hover {
            background-color: var(--CBlue-darak, rgba(5, 119, 174, 1));
         }


         /* Ensure image fits and doesn't overflow */
         .right {
            width: 50%;
            object-fit: fill;
         }

         .right img {
            width: 100%;
            height: auto;
         }

         .gallery-bottom img {
            width: 33%;
            height: auto;

            border-radius: 8px;
         }

         @media (max-width: 768px) {
            .gallery-bottom img {
               width: 100%;
            }
         }

         /* Responsive Styles */
         @media (max-width: 1024px) {
            .section {
               height: auto;
               flex-direction: column;
            }

            .left {
               padding: 40px 30px;
               text-align: center;
               align-items: center;
            }

            .left h2 {
               font-size: 28px;
            }

            .left button {
               width: 220px;
               height: 70px;
               font-size: 24px;
            }

            .right {
               width: 100%;
            }

            .right img {
               max-width: 100%;
               margin: 0 auto;
               display: block;
            }
         }

         @media (max-width: 600px) {
            .left {
               width: 100%;
               padding: 30px 20px;
               gap: 20px;
            }

            .left h2 {
               font-size: 22px;
            }

            .left button {
               width: 180px;
               height: 60px;
               font-size: 20px;
            }

            .right {
               display: none;
            }
         }

         .carousel-track {
            animation: none !important;
            transform: none !important;
            /* Optional: stop any motion position */
         }

         .carousel-track {
            animation-play-state: paused !important;
         }

         #lightbox {
            position: fixed;
            top: 0;
            left: 0;
            width: 100vw;
            height: 100vh;
            background: rgba(0, 0, 0, 0.9);
            display: flex;
            justify-content: center;
            align-items: center;
            flex-direction: column;
            z-index: 9999;
         }

         .lightbox-img {
            max-width: 90%;
            max-height: 80%;
            border: 4px solid white;
            border-radius: 10px;
            box-shadow: 0 0 20px rgba(255, 255, 255, 0.2);
         }

         .lightbox-controls {
            position: absolute;
            top: 50%;
            width: 100%;
            display: flex;
            justify-content: space-between;
            color: white;
            font-size: 3rem;
            padding: 0 40px;
            user-select: none;
         }

         .prev,
         .next {
            cursor: pointer;
         }

         .close-btn {
            position: absolute;
            top: 20px;
            right: 30px;
            font-size: 3rem;
            color: white;
            cursor: pointer;
            user-select: none;
         }

         @media (max-width: 600px) {

            .step-tabs {
               gap: 8px;
            }

            .step-tab {
               font-size: 16px;
            }

            .contact-us-form-inner {
               padding: 15px 15px;
               gap: 0px;
            }

            .contact-us-form-title-data {
               font-size: 16px;
            }

            .contact-us-form-inner input {
               height: 35px;
            }

            .contact-us-form-inner p {
               font-size: 10px;
            }

            .second_section {
               margin-top: 0px;
               padding: 0;
               margin-bottom: 0px;
            }

            .sec_one {
               padding: 20px !important;
            }

            .heading_one {
               font-size: 20px;
            }

            .heading_two {
               font-size: 20px;
               line-height: 0%;

            }

            .paragraph_one p {
               max-width: 100%;
               font-size: 16px;
            }

            .description {
               margin-bottom: -20px;
               color: #555;
               font-size: 12px;
            }

            .fixed-card {
               margin-bottom: 0px;
            }

            .contact-us-container {
               height: auto;
            }

            .section-label {
               font-size: 16px;
            }

            .section-title {
               font-weight: 600;
               font-size: 20px;
            }

            .custom-accordion .list {
               font-size: 12px;
            }

            .custom-accordion .list li {
               margin-bottom: 5px;
            }

            .custom-accordion .accordion-img {
               width: 100%;
            }

            .care-text {
               max-width: 100%;
            }

            .care-text h2 {
               width: 100%;
               height: auto;
               color: var(--Text, #1C3A3C);
               font-family: Manrope;
               font-size: 40px;
               font-style: normal;
               font-weight: 900;
               line-height: 56px;
            }

            .care-feature {
               gap: 7px;
               width: 100%;
               height: 87px;
               display: flex;
               align-items: center;
               background-color: #f1f4f6;
               padding: 0px 27px;
               border-radius: 19px;
               margin-bottom: 17px;
            }

            .care-text p {
               margin: 30px 0px;
               height: 9%;
               width: auto;
               align-self: stretch;
               color: #1B1B1B;
               font-family: Quicksand;
               font-size: 16px;
               font-style: normal;
               font-weight: 400;
            }

            .section-purpose {
               flex-direction: column;
            }

            .purpose-left {
               width: 100%;
            }

            .purpose-left h2 {
               word-spacing: 4px;
               font-size: 30px;
               line-height: 39px;
               letter-spacing: 0;
            }

            .purpose-left p {
               word-spacing: 0px;
               letter-spacing: 0px;
               line-height: 24px;
               font-size: 16px;
            }

            .purpose-right {
               width: 100%;
               gap: 5px;
            }

            .section-purpose {
               width: 100%;
               padding: 0 10px;
               gap: 0;
            }

            .purpose-accordion-title {
               word-spacing: 4px;
               font-size: 20px;
               line-height: 39px;
               letter-spacing: 0;
            }

            .purpose-accordion-content {
               word-spacing: 0px;
               letter-spacing: 0px;
               line-height: 17px;
               font-size: 14px;
            }

            .purpose-accordion-item {
               padding: 5px 0;
            }

            .stats {
               background: var(--CBlue-darak, #0577AE);
               border-radius: 30px;
               display: flex;
               flex-wrap: wrap;
               justify-content: space-evenly;
               align-items: center;
               padding: 21px 0px;
               margin-top: 9px;
            }

            .stat-box {
               width: 150px;
            }

            .stat-box h2 {
               font-size: 16px;
            }

            .stat-box p {
               font-size: 10px;
            }

            .about-section {
               margin-bottom: 10px;
            }

            .hero-heading {
               font-size: 43px;
            }

            .hero-text {
               font-size: 10px;
               margin-bottom: 3px;
            }

            .btn-secondary {
               padding: 10px 0px;
               border-radius: 3px;
               width: 90px !important;
               font-size: 10px;
            }

            .awain {
               margin-top: 0px;
               width: 100%;
               font-size: 16px;
               font-family: manrope;
               font-weight: bold;
               color: white !important;
            }

            .How-it-works-title {
               text-align: center;
               font-size: 40px;
            }

            .works_blue-line {
               left: 100px;
            }

            .step-number {
               width: 12px;
               height: 30px;
               line-height: 30px;
               font-size: 20px;
            }

            .step-title {
               font-size: 20px;
            }

            .step-description {
               font-size: 16px;
               margin-left: 20px;
            }

            .left-section {
               position: relative;
               left: 12px;
               width: 100% !important;
               padding: 20px;
            }

            .action-buttons {
               margin-top: 20px;

               align-items: center;
            }

            .our-brands-heading {
               font-size: 40px;
               text-align: center;
            }

            .Brands_blue_line {
               left: 33px;
            }

            .text-start p,
            .lead {
               font-size: 16px;
               text-align: center;
            }

            .proven {
               font-size: 40px;
               text-align: center;
               margin-bottom: 20px;
            }

            .Measureable_blue_line {
               width: 232px;
               margin: 0 auto;
            }

            .custom-accordion .accordion-button {
               font-size: 15px;
            }

            .custom-accordion .list {
               padding-left: 40px;
            }

            .email-oper h1 {
               font-size: 18px;
            }

            .email-oper p {
               font-size: 16px;
            }

            .contact-us-form button {
               font-size: 14px;
               width: 100px;
               height: 34px;
            }

            .about-us-top {
               border-radius: 20px;
               background: var(--CBlue-darak, #0577AE);
               display: flex;
               gap: 12px;
               width: 100%;
               height: 125px;
               padding: 25px 20px;
               margin-bottom: 0px;
            }

            .contact-us-top-right p {
               max-width: 680px;
               color: #ffffff;
               font-family: Manrope;
               font-size: 10px;
               font-style: normal;
               font-weight: 400;
               line-height: normal;
            }



            .contact-us-info-section {
               flex-direction: column-reverse;
            }

            .contact-us-top-left h4 {
               color: #ffffff;
               font-family: Manrope;
               font-size: 12px;
               font-style: normal;
               font-weight: 500;
               line-height: normal;
            }

            .contact-us-top-left h1 {
               color: #ffffff;
               font-family: Manrope;
               font-size: 16px;
               font-style: normal;
               font-weight: 800;
               line-height: 17px;
            }

            .phone-envelop {
               width: 30px;
               height: 30px;
               padding: 1px 5px;

            }

            .phone-envelop img {
               width: 20px;
               height: 20px;
            }

            .contact-us-map {
               height: 250px;
            }

            .Gallery-button {
               color: var(--MAin-text, #1C3A3C);
               font-family: Manrope;
               font-size: 10px;
               text-decoration: none;
               font-style: normal;
               font-weight: 700;
               line-height: 100%;
               display: flex;
               width: fit-content;
               height: 35px;
               padding: 15px 15px;
               flex-direction: column;
               justify-content: center;
               align-items: center;
               gap: 10px;
               flex-shrink: 0;
               border-radius: 10px;
               border: 1px solid var(--MAin-text, #1C3A3C);
            }

            .gallery-up-top {
               border-radius: 20px;
               background: var(--CBlue-darak, #0577AE);
               display: flex;
               gap: 15px;
               width: 100%;
               height: 125px;
               padding: 10px 13px;
               margin-bottom: 0px;
            }

            .gallery-up-top-left h4 {
               color: #ffffff;
               font-family: Manrope;
               font-size: 12px;
               font-style: normal;
               font-weight: 500;
               line-height: normal;
            }

            .gallery-up-top-left h1 {
               color: #ffffff;
               font-family: Manrope;
               font-size: 16px;
               font-style: normal;
               font-weight: 800;
               line-height: 17px;
            }

            .box_logo {
               width: 229px;
               height: 78px;
               margin-left: -3px;
            }

            .logo {
               width: 210px;
               height: 71px;
            }

            .navbar>.container,
            .navbar>.container-fluid,
            .navbar>.container-lg,
            .navbar>.container-md,
            .navbar>.container-sm,
            .navbar>.container-xl,
            .navbar>.container-xxl {
               flex-wrap: nowrap;
               gap: 20px;
            }

            .navbar {
               align-items: flex-end;
               padding: 0 1px;
            }

            .navbar-toggler {
               position: relative;
               top: 10px;
            }


         }