:root {
         --primary: #1c4742;
         --secondary: #555555;
         --light: #F1F3FA;
         --dark: #1C2035;
         --parit: #90da10;
     }

     * {
         margin: 0;
         padding: 0;
         box-sizing: border-box;
         overflow-x: hidden;
         font-family: "Poppins", sans-serif;
     }

     body {
         overflow-x: hidden;
     }

     a {
         text-decoration-line: none;
         display: inline-block;
         overflow: hidden;
     }

     .btn-start {
         background-color: var(--primary);
         color: var(--parit);
     }

     .btn-start:hover {
         background-color: var(--primary);
         color: var(--parit);
     }


     .text-green {
         color: var(--parit) !important;
     }

     /* ====== TOP BAR ====== */
     .main-header {
         background: var(--primary);
         color: white;
         border-bottom: 3px solid #eee;
     }

     /* Contact Info */
     .header-contact a {
         color: #000;
         font-weight: 500;
         text-decoration: none;
     }

     /* Social Icons */
     .social-icon {
         color: var(--parit);
         font-size: 18px;
         text-decoration: none;
     }

     .social-icon:hover {
         color: var(--parit);
     }

     /* ====== NAVBAR ====== */
     .navbar {
         background-color: transparent !important;
         position: absolute;
         top: 0;
         left: 0;
         width: 100%;
         z-index: 1000;
         min-height: fit-content;
         /* padding: 10px 0; */
         margin-top: 30px;
     }


     .navbar-brand img {
         width: 15rem;
     }


     .navbar-nav .nav-link {
         color: #fff;
         font-weight: 500;
         transition: 0.3s;
         margin-right: 10px;
     }


     .navbar-nav .nav-link:hover {
         color: var(--parit);
     }


     /* Mobile Fixes */
     @media (max-width: 768px) {
         .navbar {
             margin-top: 10px;
         }

         .navbar-brand img {
             width: 15rem !important;
         }

         .offcanvas {
             background-color: #000 !important;
             width: 200px;
         }

         .navbar-nav .nav-link {
             margin: 8px 0;
             font-size: 1rem;
         }
     }

     @media (max-width: 576px) {
         /* .navbar {
             margin-top: 10px;
         } */
         br {
             display: none;
         }
     }

     /* Extra Small Devices */
     @media (max-width: 480px) {
         .navbar-brand img {
             width: 10rem !important;
         }
     }

     .navbar-toggler-icon {
         display: none !important;
     }

     .navbar-toggler {
         border: none !important;
         box-shadow: none !important;
         margin-left: auto;
     }

     .navbar-toggler:focus {
         border: none !important;
         box-shadow: none !important;
     }


     /* ====== BANNER ====== */
     .banner {
         background: url('../images/mockup.jpg') center/cover no-repeat;
         position: relative;
         height: 90vh;
         display: flex;
         align-items: center;
         color: #fff;
     }

     .banner::before {
         content: "";
         position: absolute;
         inset: 0;
         background: rgba(6, 16, 38, 0.8);
     }

     .banner-content {
         position: relative;
         max-width: 100%;
         padding: 5px;
     }

     .banner h1 {
         font-size: 2.8rem;
         font-weight: 800;
     }

     .banner p {
         margin-top: 10px;
         font-size: 16px;
         color: #cfcfcf;
     }

     .banner .btn {
         background-color: var(--parit);
         border: none;
         color: #fff;
         font-weight: 600;
         margin-top: 20px;
         padding: 10px 30px;
         border-radius: 0px;
         transition: 0.3s;
     }

     .banner .btn:hover {
         background-color: var(--parit);
     }

     /* ====== RESPONSIVE ====== */

     @media (max-width: 991.98px) {
         header {
             padding-top: 2px !important;
             padding-bottom: 2px !important;
             display: none;
         }

         header img {
             max-width: 120px !important;
         }

         .social-icon {
             width: 26px;
             height: 26px;
             font-size: 12px;
             color: var(--primary) !important;
         }

         .navbar {
             background-color: var(--primary);
         }
     }

     .header-icons a i {
         font-size: 12px;
     }

     .header-icons a {
         width: 25px;
         height: 25px;
         line-height: 25px;
     }

     @media (max-width: 768px) {
         .banner {
             height: 80vh;
             text-align: left;
             padding-left: 20px;
         }

         .banner h1 {
             font-size: 2rem;
         }
     }

     /* =====================================================hero-action section ====================================== */
     .hero-action {
         height: auto;
         padding: 20px 0;
         background-color: var(--primary) !important;
     }


     .hero-action .btn {
         margin: 8px;
     }


     /* Prevent overflow and allow wrapping */
     .hero-action .actions-wrapper {
         display: flex;
         justify-content: center;
         align-items: center;
         flex-wrap: wrap;
         gap: 15px;
         padding: 10px;
         width: 100%;
     }


     /* Keep your original hover effects */
     .btn-outline-warning:hover img {
         filter: invert(0) !important;
     }


     .btn-outline-warning:hover {
         background-color: var(--parit) !important;
         border-color: var(--parit) !important;
         color: white !important;
     }


     .btn-outline-dark {
         background-color: var(--primary) !important;
         border-color: var(--parit) !important;
         color: white !important;
     }


     .btn-outline-dark:hover {
         background-color: var(--parit) !important;
         border-color: var(--parit) !important;
         color: white !important;
     }


     .btn-outline-info {
         background-color: var(--primary) !important;
         border-color: var(--primary) !important;
         color: white !important;
     }


     .btn-outline-info:hover {
         background-color: var(--parit) !important;
         border-color: var(--parit) !important;
         color: white !important;
     }


     /* Mobile responsiveness */
     @media (max-width: 576px) {
         .hero-action .btn {
             font-size: medium;
             width: 90%;
             text-align: center;
             justify-content: center;
         }
     }

     /*================================================================ owner section ======================================= */
     .team-item {
         position: relative;
         text-align: center;
         box-shadow: 0 0 45px rgba(0, 0, 0, .07);
     }

     .team-item .team-social {
         position: absolute;
         padding: 0;
         top: 15px;
         left: 0;
         overflow: hidden;
     }

     .team-item .team-social li {
         list-style-type: none;
         margin-bottom: 10px;
         margin-left: -50px;
         opacity: 0;
         transition: .5s;
     }

     .team-item:hover .team-social li {
         margin-left: 15px;
         opacity: 1;
     }

     .team-social li .btn {
         background: #FFFFFF;
         color: var(--primary);
         border-radius: 40px;
         transition: .5s;
     }

     .team-social li .btn:hover {
         color: #FFFFFF;
         background: var(--primary);
     }

     .team-social li:nth-child(1) {
         transition-delay: .1s;
     }

     .team-social li:nth-child(2) {
         transition-delay: .2s;
     }

     .team-item .team-social li:nth-child(3) {
         transition-delay: .3s;
     }

     .team-social li:nth-child(4) {
         transition-delay: .4s;
     }

     .team-social li:nth-child(5) {
         transition-delay: .5s;
     }

     .primary-blue {
         color: var(--primary) !important;
     }

     .light-blue {
         color: var(--parit) !important;
     }

     .border-light-blue {
         border-color: rgba(59, 130, 246, 0.2) !important;
     }

     .owner-img {
         width: 100%;
         height: 400px;
         object-fit: cover;
         border-radius: 20px;
         /* border: 2px solid #dce3f0; */
         box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
     }


     /* ==================================================department section ======================================== */


     .card-img-top {
         transition: transform 0.5s;
     }

     .department-card:hover .card-img-top {
         transform: scale(1.1);
     }

     .department-card button {
         background-color: var(--primary) !important;
         color: white !important;
         /* transition: all 1.5s ease; */
         border: none;
     }

     .department-card:hover button {
         background-color: var(--parit) !important;
         color: #0b0b0b !important;
         border: none;
     }

     .btn-responsive {
         font-size: clamp(0.8rem, 2.5vw, 1rem);
         /* text responsive */
         padding: clamp(8px, 2vw, 16px) clamp(20px, 4vw, 40px);
         /* padding responsive */
         border-radius: 50px;
         white-space: nowrap;
     }


     @media (max-width: 480px) {
         .btn-responsive i {
             font-size: 0.9rem;
         }
     }

     /* ====================================resume section start ======================= */
     .resume {
         background-image: linear-gradient(to top, rgba(28, 97, 50, 0.659), rgba(25, 142, 48, 0.538)), url(../images/12.jpg);
         background-position: center center;
         background-repeat: no-repeat;
         background-size: cover;
         /* position: fixed; */
         width: 100vw;
         object-fit: cover;
         height: auto;
         margin-bottom: 50px;
     }



     /***
=============================================
    Registration One
=============================================
***/
     .registration-one {
         position: relative;
         display: block;
         padding: 120px 0px 120px;
         z-index: 1;
     }

     .registration-one .section-title__tagline {
         color: #ffffff;
     }

     .registration-one .section-title__title {
         color: #ffffff;
     }

     .registration-one .section-title__title span {
         color: var(--thm-primary);
     }

     .registration-one__bg {
         position: absolute;
         top: 0;
         left: 0;
         bottom: 345px;
         right: 0;
         background-position: center center;
         background-attachment: fixed;
         background-size: cover;
         background-repeat: no-repeat;
     }

     .registration-one__bg::before {
         position: absolute;
         top: 0;
         left: 0;
         bottom: 0;
         right: 0;
         background-color: rgba(var(--thm-black-rgb), .7);
         content: "";
         z-index: 1;
     }

     .registration-one__left {
         position: relative;
         display: block;
         max-width: 625px;
         width: 100%;
         z-index: 2;
     }

     .registration-one__left-text {
         color: rgba(255, 255, 255, .7);
         margin: 0;
     }

     .registration-one__left-transform-box {
         position: relative;
         display: flex;
         align-items: center;
         margin-top: 175px;
         padding-bottom: 60px;
         border-bottom: 1px solid #e0e2e9;
     }

     .registration-one__left-transform-box-icon {
         position: relative;
         display: block;
         width: 105px;
         height: 105px;
         border-radius: 50%;
         background: var(--thm-base);
         color: #ffffff;
         text-align: center;
     }

     .registration-one__left-transform-box-icon span::before {
         font-size: 50px;
         line-height: 105px;
     }

     .registration-one__left-transform-box-text {
         position: relative;
         display: block;
         padding-left: 30px;
     }

     .registration-one__left-transform-box-text h3 {
         font-size: 22px;
         line-height: 32px;
         font-weight: 700;
     }

     .registration-one__left-transform-box-text h3 a {
         color: var(--thm-black);
         transition: all 200ms linear;
         transition-delay: 0.1s;
     }

     .registration-one__left-transform-box-text h3 a:hover {
         color: var(--thm-base);
     }

     .registration-one__left-transform-box-text p {
         margin: 0;
     }





     .registration-one__right {
         position: relative;
         display: block;
         z-index: 2;
         margin-top: 64px;
     }

     .registration-one__right-form {
         position: relative;
         background-color: #ffffff;
         padding: 55px 60px 60px;
         max-width: 470px;
         box-shadow: 0px 10px 60px 0px rgba(0, 0, 0, 0.07);
         z-index: 2;
         border-radius: 8px;
     }


     .registration-one__right-form .title-box {
         position: relative;
         display: block;
     }

     .registration-one__right-form .title-box h4 {
         position: relative;
         color: var(--thm-black);
         font-size: 24px;
         line-height: 34px;
         font-weight: 700;
     }

     .registration-one__right-form .form-box {
         position: relative;
         margin-top: 30px;
     }

     .registration-one__right-form .form-group {
         position: relative;
         margin-bottom: 10px;
     }


     .registration-one__right-form .form-group input[type="text"],
     .registration-one__right-form .form-group input[type="email"],
     .registration-one__right-form .form-group input[type="tel"],
     .registration-one__right-form .form-group input[type="url"],
     .registration-one__right-form .form-group textarea,
     .registration-one__right-form .form-group select {
         position: relative;
         display: block;
         font-size: 16px;
         line-height: 25px;
         color: var(--thm-gray);
         font-weight: 400;
         padding: 16px 30px 13px;
         width: 100%;
         height: 60px;
         border-radius: 8px;
         background-color: #f1f2f6;
         outline: none;
         border: none;
         -webkit-transition: all 300ms ease;
         -moz-transition: all 300ms ease;
         -ms-transition: all 300ms ease;
         -o-transition: all 300ms ease;
         transition: all 300ms ease;
     }

     .registration-one__right-form .form-group textarea {
         height: 130px;
         resize: none;
     }

     .registration-one__right-form button {
         border: none;
         outline: none;
         padding: 0;
     }


     /* --- Instructor Section Styling --- */
     /* --- Modern Team Section Styling --- */
     #team-section-modern {
         padding: 0px 20px;
         background-color: #f7f9fc;
         text-align: center;
         font-family: 'Poppins', sans-serif;
     }

     .container-modern {
         max-width: 1200px;
         margin: 0 auto;
     }

     .section-title-modern {
         font-size: 3em;
         color: #1e293b;
         margin-bottom: 10px;
         font-weight: 700;
     }

     .section-tagline-modern {
         font-size: 1.25em;
         color: #64748b;
         margin-bottom: 70px;
     }

     .team-members-grid {
         display: grid;
         grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
         gap: 40px;
         margin-bottom: 50px;
     }

     .team-card-modern {
         background: #ffffff;
         border-radius: 12px;
         padding: 30px;
         box-shadow: 0 10px 30px rgba(45, 55, 72, 0.05);
         transition: transform 0.4s ease, box-shadow 0.4s ease;
         overflow: hidden;
         position: relative;
         display: flex;
         flex-direction: column;
         align-items: center;
     }

     .team-card-modern:hover {
         /* transform: translateY(-12px); */
         box-shadow: 0 50px 40px rgba(45, 55, 72, 0.15);
     }

     /* Image Styling */
     .profile-image-container {
         width: 200px;
         height: 200px;
         margin-bottom: 25px;
         border-radius: 50%;
         overflow: hidden;
         object-fit: cover;
         position: relative;
         border: 5px solid #e2e8f0;
     }

     .profile-image {
         width: 100%;
         height: 100%;
         object-fit: cover;
         transition: transform 0.4s ease;
     }

     .team-card-modern:hover .profile-image {
         transform: scale(1.05);
     }

     /* Text Details */
     .profile-details h3 {
         font-size: 1.75em;
         /* font-weight: bold; */
         color: var(--primary);
         margin-bottom: 5px;
     }

     .role-title {
         font-size: 1.1em;
         color: var(--primary);
         font-weight: 600;
         margin-bottom: 15px;
         text-transform: uppercase;
         letter-spacing: 0.5px;
     }

     .short-bio {
         font-size: 0.95em;
         color: #475569;
         line-height: 1.6;
         margin-bottom: 20px;
     }

     /* Social Links */
     .social-links-modern {
         display: flex;
         gap: 15px;
         opacity: 0.6;
         transition: opacity 0.3s ease;
     }

     .team-card-modern:hover .social-links-modern {
         opacity: 1;
     }

     .social-links-modern a {
         color: #475569;
         font-size: 1.3em;
         transition: color 0.3s ease;
     }

     .social-links-modern a:hover {
         color: var(--primary);
     }

     .btn-more-team {
         display: inline-block;
         background: none;
         color: var(--primary);
         border: 2px solid var(--primary);
         padding: 10px 25px;
         border-radius: 50px;
         text-decoration: none;
         font-weight: 600;
         font-size: 1.1em;
         margin-top: 20px;
         transition: background-color 0.3s ease, color 0.3s ease;
     }

     .btn-more-team:hover {
         background-color: var(--primary);
         color: #ffffff;
     }

     /* --- Responsive Adjustments --- */
     @media (max-width: 768px) {
         #team-section-modern {
             padding: 60px 15px;
         }

         .section-title-modern {
             font-size: 2.2em;
         }

         .section-tagline-modern {
             font-size: 1em;
             margin-bottom: 40px;
         }
     }

     /* --- 8. Call to Action Button --- */

     /* news or blog section */
     .news {
         background-image: url('../images/blog-bg.jpg');
         background-size: cover;
         background-position: center center;
         padding: 60px 0;
     }

     .news-card img {
         transition: transform 1.5s ease;
         overflow: hidden;
     }

     .news-card:hover img {
         transform: scale(1.1);
     }

     .news-card .card-img {
         object-fit: cover;
         width: 100%;
         height: 300px;
         border-radius: 8px;
     }

     .news-card .card {
         border: none;
         overflow: hidden;
         border-radius: 10px;
         box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
         object-fit: cover;
     }

     .news .col-lg-6 .card-img {
         height: 610px;
         object-fit: cover;
     }

     @media screen and (max-width: 1200px) {
         .news-container {
             max-width: 95% !important;
         }
     }

     @media (max-width: 991px) {
         .news-card {
             margin-bottom: 15px;
         }

         .news-card .card-img {
             height: 220px;
         }

         .news .col-lg-6 .card-img {
             height: 220px;
             object-fit: contain;
         }
     }

     @media (max-width: 576px) {
         .news-card .card-img {
             height: 180px;
         }

         .news .col-lg-6 .card-img {
             height: 180px;
         }
     }

     /*--------------------------------------------------------------
# Clients Section
--------------------------------------------------------------*/
     .clients {
         padding: 40px 0;
         background: #fff;
         overflow: hidden;
     }

     .logo-slider {
         overflow: hidden;
         position: relative;
         width: 100%;
     }

     .logo-track {
         display: flex;
         width: calc(250px * 12);
         /* adjust based on number of logos */
         animation: scroll 30s linear infinite;
     }

     .client-logo {
         flex: 0 0 auto;
         width: 250px;
         /* adjust as needed */
         display: flex;
         justify-content: center;
         align-items: center;
     }

     .client-logo img {
         max-width: 80%;
         transition: transform 0.3s ease;
     }

     .client-logo img:hover {
         transform: scale(1.05);
     }

     /* Continuous scroll animation */
     @keyframes scroll {
         0% {
             transform: translateX(0);
         }

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

     /* Responsive */
     @media (max-width: 768px) {
         .client-logo {
             width: 150px;
         }

         .logo-track {
             animation-duration: 20s;
         }
     }



     /* ====== Main Contact Section ====== */
     .contact-section {
         background-color: var(--primary);
         padding-top: 100px;
         padding-bottom: 100px;
     }

     .contact-card {
         background-color: #fff;
         border-radius: 15px;
     }

     .contact-img img {
         border-top-right-radius: 15px;
         border-bottom-right-radius: 15px;
         filter: brightness(90%);
     }

     .contact-overlay {
         background: linear-gradient(to top, rgb(28, 71, 66), rgba(0, 0, 0, 0.3));
         border-top-right-radius: 15px;
         border-bottom-right-radius: 15px;
     }

     .contact-content {
         max-width: 90%;
         z-index: 2;
     }

     .btn-info {
         background-color: var(--primary);
         border: var(--primary);
         color: var(--light);
     }

     .btn-info:hover {
         background-color: var(--parit);
         color: var(--light);
     }

     /* Responsive Adjustments */
     @media (max-width: 991px) {

         .contact-img img,
         .contact-overlay {
             border-radius: 0 0 15px 15px;
         }

         .contact-section {
             padding-top: 60px;
             padding-bottom: 60px;
         }
     }

     /* faq-section  start  */
     .faq-section {
         background-color: #f8f9fa;
     }

     .text-info {
         color: var(--primary) !important;
     }

     .faq-custom-style .accordion-item {
         border: none;
         border-bottom: 1px solid #ddd;
     }

     .faq-custom-style .accordion-item:last-child {
         border-bottom: none;
     }

     .faq-custom-style .accordion-button {
         background-color: white;
         color: #333;
         font-weight: 500;
         padding: 15px 20px;
     }

     .faq-custom-style .last-item-open .accordion-body {
         background-color: #f7f7f7;
         color: #6c757d;
         font-size: 0.9rem;
         padding: 15px 20px;
         border-top: 1px solid #eee;
     }

     .faq-custom-style .accordion-button:not(.collapsed) {
         color: #333;
         background-color: white;
         box-shadow: none;
     }

     .faq-custom-style .accordion-button::after {
         background-image: none;
         content: '+';
         font-size: 1.2rem;
         font-weight: 300;
         transform: none;
     }

     .faq-custom-style .accordion-button:not(.collapsed)::after {
         content: '-';
         transform: none;
     }

     /* achievements-section start  */

     .achievements-section {
         background: linear-gradient(135deg, #f8f9fa, #e3f2fd);
         position: relative;
         overflow: hidden;
     }

     .achievements-section::before {
         content: "";
         position: absolute;
         top: -100px;
         left: -100px;
         width: 400px;
         height: 400px;
         background: radial-gradient(circle, rgba(0, 123, 255, 0.15) 0%, transparent 70%);
         animation: float 8s ease-in-out infinite alternate;
     }

     @keyframes float {
         0% {
             transform: translate(0, 0);
         }

         100% {
             transform: translate(50px, 50px);
         }
     }

     .achievements {
         background: transparent;
     }

     .section-title {
         font-size: 2.2rem;
         font-weight: 700;
         color: #222;
     }

     .section-subtitle {
         font-size: 1rem;
         color: #555;
     }

     .achievement-item {
         transition: all 0.3s ease;
     }

     .achievement-item i {
         font-size: 3rem;
         color: var(--primary);
         margin-bottom: 10px;
         transition: transform 0.3s ease, color 0.3s ease;
     }

     .achievement-item:hover i {
         transform: scale(1.2);
         color: var(--primary);
     }

     .counter {
         font-size: 2.5rem;
         font-weight: 700;
         color: #111;
         margin: 10px 0 5px;
     }

     .achievement-item p {
         font-weight: 500;
         color: #444;
         margin: 0;
     }

     /*================= achievements-section end ================ */


     /*--------------------------------------------------------------
# Global Footer
--------------------------------------------------------------*/
     .footer {
         color: var(--light);
         background-color: var(--primary);
         font-size: 14px;
         position: relative;
     }

     .footer-about img {
         margin: 0px 0px;
         display: block;
     }

     .footer .footer-top {
         padding-top: 50px;
         border-top: 1px solid color-mix(in srgb, var(--light), transparent 90%);
     }

     .footer .footer-about p {
         font-size: 14px;
         font-family: var(--heading-font);
     }

     .footer .social-links a {
         display: flex;
         align-items: center;
         justify-content: center;
         width: 40px;
         height: 40px;
         border-radius: 50%;
         border: 1px solid color-mix(in srgb, var(--light), transparent 50%);
         font-size: 16px;
         color: color-mix(in srgb, var(--light), transparent 30%);
         margin-right: 10px;
         transition: 0.3s;
         overflow: hidden;
     }

     .footer .social-links a:hover {
         color: var(--parit);
         border-color: var(--parit);
     }

     .footer h4 {
         font-size: 16px;
         font-weight: bold;
         position: relative;
         padding-bottom: 12px;
     }

     .footer .footer-links {
         margin-bottom: 30px;
         overflow: hidden;
     }

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

     .footer-links ul {
         padding: 0;
         margin: 0;
         list-style: none;
         overflow: hidden;
         /* Removes scrollbars */
     }

     .footer-links ul li {
         overflow: hidden;
         /* Extra safety */
         white-space: nowrap;
         /* Prevents text from wrapping and causing scroll */
     }

     .footer-links a {
         display: inline-block;
         text-decoration: none;
     }

     .footer .footer-links ul i {
         padding-right: 3px;
         font-size: 13px;
         line-height: 0;
         color: var(--parit);
         overflow: hidden;
     }

     .footer .footer-links ul li {
         padding: 10px 0;
         display: flex;
         align-items: center;
         overflow: hidden;
     }

     .footer .footer-links ul li:first-child {
         padding-top: 0;
     }

     .footer .footer-links ul a {
         color: color-mix(in srgb, var(--light), transparent 30%);
         display: inline-block;
         line-height: 1;
     }

     .footer .footer-links ul a:hover {
         color: var(--accent-color);
     }

     .footer .footer-contact p {
         margin-bottom: 10px;
     }

     .footer .footer-newsletter .newsletter-form {
         margin-top: 30px;
         margin-bottom: 15px;
         padding: 6px 8px;
         position: relative;
         border-radius: 4px;
         border: 1px solid color-mix(in srgb, var(--light), transparent 80%);
         display: flex;
         background-color: var(--primary);
         transition: 0.3s;
     }

     .footer .footer-newsletter .newsletter-form:focus-within {
         border-color: var(--parit);
     }

     .footer .footer-newsletter .newsletter-form input[type=email] {
         border: 0;
         padding: 4px;
         width: 100%;
         background-color: var(--primary);
         color: var(--light);
     }

     .footer .footer-newsletter .newsletter-form input[type=email]:focus-visible {
         outline: none;
     }

     .footer .footer-newsletter .newsletter-form input[type=submit] {
         border: 0;
         font-size: 16px;
         padding: 0 20px;
         margin: -7px -8px -7px 0;
         background: var(--parit);
         color: var(--light);
         transition: 0.3s;
         border-radius: 0 4px 4px 0;
     }

     .footer .footer-newsletter .newsletter-form input[type=submit]:hover {
         background: color-mix(in srgb, var(--parit), transparent 20%);
     }

     .footer .copyright {
         padding: 25px 0;
         border-top: 1px solid color-mix(in srgb, var(--parit), transparent 90%);
     }

     .footer .copyright p {
         margin-bottom: 0;
     }

     .footer .credits {
         margin-top: 6px;
         font-size: 13px;
     }

     /*--------------------------------------------------------------
# Hero Section
--------------------------------------------------------------*/
     .hero {
         width: 100%;
         min-height: 100vh;
         position: relative;
         padding: 80px 0;
         display: flex;
         align-items: center;
         justify-content: center;
     }

     .hero img {
         position: absolute;
         inset: 0;
         display: block;
         width: 100%;
         height: 100%;
         object-fit: cover;
         z-index: 1;
     }

     .hero:before {
         content: "";
         background: color-mix(in srgb, rgba(0, 0, 0, 0.845), transparent 30%);
         position: absolute;
         inset: 0;
         z-index: 2;
     }

     .hero .container {
         position: relative;
         z-index: 3;
     }

     .hero h2 {
         margin: 0;
         font-size: 48px;
         font-weight: 700;
         text-transform: uppercase;
     }

     .hero p {
         color: color-mix(in srgb, var(--light), transparent 20%);
         margin: 10px 0 0 0;
         font-size: 24px;
     }

     .hero .btn-get-started {
         background: var(--primary);
         color: var(--secondary);
         font-weight: 400;
         font-size: 14px;
         letter-spacing: 1px;
         display: inline-block;
         padding: 10px 30px;
         border-radius: 4px;
         transition: 0.3s;
         text-transform: uppercase;
     }

     .hero .btn-get-started:hover {
         background: color-mix(in srgb, var(--primary), transparent 20%);
     }

     @media (max-width: 768px) {
         .hero h2 {
             font-size: 32px;
         }

         .hero p {
             font-size: 18px;
         }
     }


     /* success-story start  */

     .success-story {
         background: transparent;
     }

     .section-title {
         font-size: 2.2rem;
         color: #222;
     }

     .section-subtitle {
         font-size: 1rem;
         color: #666;
     }

     .timeline {
         border-left: 3px solid var(--primary);
         padding-left: 40px;
         position: relative;
     }

     .timeline-item {
         position: relative;
         margin-bottom: 30px;
         padding-left: 15px;
     }

     .timeline-item::before {
         content: '';
         position: absolute;
         left: -12px;
         top: 5px;
         width: 15px;
         height: 15px;
         background-color: var(--primary);
         border-radius: 50%;
         transition: all 0.3s ease;
     }

     .timeline-item:hover::before {
         transform: scale(1.3);
         background-color: var(--primary);
     }

     .timeline-item .year {
         font-weight: 700;
         color: var(--primary);
         font-size: 1.1rem;
     }

     .timeline-item h4 {
         font-weight: 600;
         color: #222;
         margin-top: 5px;
     }

     .timeline-item p {
         color: #555;
         font-size: 0.95rem;
     }

     .story-image-wrapper img {
         transition: transform 0.6s ease, box-shadow 0.6s ease;
     }

     .story-image-wrapper:hover img {
         transform: scale(1.05);
         box-shadow: 0 8px 30px rgba(0, 0, 0, 0.2);
     }

     @media (max-width: 991px) {
         .timeline {
             border: none;
             padding-left: 0;
         }

         .timeline-item::before {
             display: none;
         }

         .timeline-item {
             text-align: center;
         }
     }






     /*--------------------------------------------------------------
# Portfolio Section
--------------------------------------------------------------*/
     .portfolio .portfolio-filters {
         padding: 0;
         margin: 0 auto 20px auto;
         list-style: none;
         text-align: center;
     }

     .portfolio .portfolio-filters li {
         cursor: pointer;
         display: inline-block;
         padding: 0;
         font-size: 18px;
         font-weight: 500;
         margin: 0 10px;
         line-height: 1;
         margin-bottom: 5px;
         transition: all 0.3s ease-in-out;
     }

     .portfolio .portfolio-filters li:hover,
     .portfolio .portfolio-filters li.filter-active {
         color: var(--primary);
     }

     .portfolio .portfolio-filters li:first-child {
         margin-left: 0;
     }

     .portfolio .portfolio-filters li:last-child {
         margin-right: 0;
     }

     @media (max-width: 575px) {
         .portfolio .portfolio-filters li {
             font-size: 14px;
             margin: 0 5px;
         }
     }

     .portfolio .portfolio-content {
         position: relative;
         overflow: hidden;
     }

     .portfolio .portfolio-content img {
         transition: 0.3s;
     }

     .portfolio .portfolio-content .portfolio-info {
         opacity: 0;
         position: absolute;
         inset: 0;
         z-index: 3;
         transition: all ease-in-out 0.3s;
         background: rgba(0, 0, 0, 0.6);
         padding: 15px;
     }

     .portfolio .portfolio-content .portfolio-info h4 {
         font-size: 14px;
         padding: 5px 10px;
         font-weight: 400;
         color: #ffffff;
         display: inline-block;
         background-color: var(--primary);
     }

     .portfolio .portfolio-content .portfolio-info p {
         position: absolute;
         bottom: 10px;
         text-align: center;
         display: inline-block;
         left: 0;
         right: 0;
         font-size: 16px;
         font-weight: 600;
         color: rgba(255, 255, 255, 0.8);
     }

     .portfolio .portfolio-content .portfolio-info .preview-link,
     .portfolio .portfolio-content .portfolio-info .details-link {
         position: absolute;
         left: calc(50% - 40px);
         font-size: 26px;
         top: calc(50% - 14px);
         color: #fff;
         transition: 0.3s;
         line-height: 1.2;
     }

     .portfolio .portfolio-content .portfolio-info .preview-link:hover,
     .portfolio .portfolio-content .portfolio-info .details-link:hover {
         color: var(--primary);
     }

     .portfolio .portfolio-content .portfolio-info .details-link {
         left: 50%;
         font-size: 34px;
         line-height: 0;
     }

     .portfolio .portfolio-content:hover .portfolio-info {
         opacity: 1;
     }

     .portfolio .portfolio-content:hover img {
         transform: scale(1.1);
     }

     /* contact section start  */
     .btn-square {
         width: 38px;
         height: 38px;
     }

     .btn-sm-square {
         width: 32px;
         height: 32px;
     }

     .btn-lg-square {
         width: 48px;
         height: 48px;
     }

     .btn-square,
     .btn-sm-square,
     .btn-lg-square {
         padding: 0;
         display: flex;
         align-items: center;
         justify-content: center;
         font-weight: normal;
     }

     .bg-green {
         background-color: var(--primary);
     }

     /* cintact section end  */

     /* --- WHY CHOOSE US Section Overhaul --- */
     /* Responsive map wrapper (works on older browsers) */
     /* .map-responsive {
         position: relative;
         width: 100%;
         height: 0;
         padding-bottom: 56.25%;
         /* 16:9 aspect ratio; change to 75% for 4:3 etc */
     /* overflow: hidden;
     }

     .map-responsive iframe {
         position: absolute;
         top: 0;
         left: 0;
         width: 100% !important;
         height: 100% !important;
         border: 0;
     } */


     /* Modern input style */

     body.modal-open {
         overflow: hidden !important;
         padding-right: 0 !important;
     }

     .modern-input {
         border-radius: 12px;
         padding: 12px 14px;
     }

     .modal-content {
         border-radius: 20px !important;
     }

     .modern-input {
         height: 48px;
         border-radius: 10px;
         padding: 10px 14px;
         border: 1px solid #dcdcdc;
         background: #f8f9fa;
         transition: all .3s ease;
         font-size: 14px;
         box-shadow: 0 0 0 transparent;
     }

     .modern-input:focus {
         border-color: #1cec62;
         background: #fff;
         box-shadow: 0 0 8px rgba(28, 236, 98, 0.25);
     }

     label.small {
         font-size: 13px;
         margin-bottom: 4px;
         color: #444;
     }

     /* Smooth spacing */
     .row.g-3>div {
         display: flex;
         flex-direction: column;
     }

     @media (max-width: 576px) {
         .no-truncate-sm {
             white-space: normal !important;
             overflow: visible !important;
             text-overflow: unset !important;
         }
     }