body{ margin: 0px 0px; padding: 0px 0px;}
html{ overflow-x: hidden; scroll-behavior: smooth;}
a{ text-decoration: none;}
p{font-size: 18px; color: #444;}
.purple-ttl{ font-size: 20px; color: #4A3DAC; text-transform: capitalize;}
.large-text{ font-size: clamp(1.5rem, 2vw + 1rem, 2.3rem); margin: 0px 0px 25px 0px; text-transform: uppercase; line-height: 1.2; font-weight: 700;}
.readmore{ display: inline-block; margin: 0px 0px 30px 0px; padding: 0px 0px; position: relative; border-radius: 30px;}
.readmore a{ display: inline-block; padding: 10px 25px; background: #4A3DAC; color: #fff; font-size: 16px; font-weight: 600; border-radius: 30px; position: relative; z-index: 1;}
.readmore a::before{ content: ''; display: block; position: absolute; left: 0; top: 0; bottom: 0; width: 0; height: 100%; border-radius: 30px 30px 30px 30px; background: #ff7d21; transition: all ease 0.5s; z-index: -1;}
.readmore a:hover::before{ width: 100%;}

#header-part{ position: fixed; top: 0; left: 0; width: 100%; z-index: 111;}
.top-part{ margin: 0px 0px 0px 0px; padding: 0px 0px; position: relative; background: #161D41; transition: all ease 0.5s;}
.top-contact{ text-align: right; margin: 0px 0px; padding: 0px 0px; position: relative;} 
.top-contact li{ display: inline-block; list-style: none; border-left: 1px solid #ffffff6b;}
.top-contact li:first-child{ border: none;}
.top-contact li a{ padding: 10px 15px; color: #fff; font-size: 16px; display: block; text-decoration: none;}

/* #header-part.hide {
    transform: translateY(-100%);
}

#header-part.hide .header-menu{ background: #fff;} */
#header-part.sticky{ position: sticky; top: 0;}
#header-part.sticky .top-part{ position: relative; top: 0; }
#header-part.sticky .header-menu{ position: sticky; top: 0;  width: 100%; background: #fff; box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.25);}


.header-menu{ display: flex; transition: all ease 0.5s;}
.header-menu .nav-item{ margin: 0px 0px; padding: 0px 0px; position: relative;}
.header-menu .nav-item .nav-link{ padding: 5px 25px; font-size: 17px; color: #000000; font-weight: 500; text-transform: uppercase;}
.header-menu .nav-item button.dropdown-toggle { position: absolute; right: 0; top: 0; bottom: 0; margin: auto; background: transparent; border: none;}
.right-top{ margin: 0px 0px 0px 0px; padding: 0px 0px; position: relative;}
.right-top li{ margin: 0px 0px; padding: 0px 0px; position: relative; list-style: none;}
.right-top li a{ padding: 8px 35px; display: inline-block; font-size: 18px; color: #000000; border: 2px solid #161D41; border-radius: 50px; transition: all ease 0.5s;}
.right-top li a:hover{ background: #161D41; color: #fff;}

#banner-section{padding: 250px 0px;margin: 0px 0px 0px 0px;position: relative;z-index: 0; overflow: hidden;}
#banner-section::before{content: '';display: block;position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: url(../img/slide-bg.jpg) no-repeat; background-size: cover; z-index: -1; animation: fadeInOut 3s ease-in-out infinite;}
.banner-text{ margin: 0 auto; text-align: center; position: relative; max-width: 1000px;}
.banner-text h6{font-size: clamp(1.5rem, 2vw + 1rem, 3rem); color: #4A3DAC; margin: 0px 0px 20px 0px;}
.banner-text h2{font-size: clamp(1.5rem, 2vw + 1rem, 4rem); color: #141D3F; font-weight: 700;}

@keyframes fadeInOut {
  0%   { opacity: .35; transform: scale(1); }
  50%  { opacity: .75; transform: scale(1.1); }
  100% { opacity: .45; transform: scale(1); }
}

/* =================================================== */
#slider-scroller{margin: 0px 0px; position: relative; }
.slider-text { margin: -20px 0px 30px 0px; position: relative; z-index: 1;}
.slider-text .rr-scroller {background-repeat: repeat;padding: 25px 0px 25px;overflow: hidden;background: #fff;transform: rotate(-2deg);width: calc(100% + 00px);border-top: 2px solid #141D3F;border-bottom: 2px solid #141D3F;}
.slider-text .rr-scroller ul { list-style: none; margin: 0; padding: 0; display: -webkit-box; display: -ms-flexbox; display: flex; gap: 52px;}
.slider-text .rr-scroller ul li { display: inline-block; position: relative; padding: 0px 35px;}  .slider-text .rr-scroller ul li:before {content: "";position: absolute;height: calc(100% - 10px);width: 1px;/* background: rgb(182 210 195); */left: -26px;top: 50%;transform: translateY(-50%);}
.slider-text .rr-scroller ul li img{object-fit: contain;max-width: 110px;filter: grayscale(1); }
.rr-scroller[data-animated=true] .rr_scroller_inner { width: max-content; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-animation: scroll var(--_animation-duration, 1500s) linear infinite; animation: scroll var(--_animation-duration, 1500s) linear infinite;} 
.rr-scroller[data-speed=slow] { --_animation-duration: 1500s;} 
@keyframes scroll { to {   -webkit-transform: translate(calc(-50% - 0.5rem));   transform: translate(calc(-50% - 0.5rem)); }} 

#welcome-section{ padding: 75px 0px; margin: 0px 0px 0px 0px; position: relative;}
.welcome-left { margin: 0px 0px 30px 0px; padding:0px 10px 10px 0px; position: relative; z-index: 1;}
.welcome-left::after{ content: ''; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #f5f5f5; border-radius: 580px 580px 580px 580px; z-index: -1;}
.welcome-left img{margin: 0px 0px;padding: 0px 0px;position: relative;border-radius: 580px 580px 580px 580px;}

.experience-years{position: absolute;right: -20px;top: -30px;transition: 0.5s ease;z-index: 1;}
.experience-years-inr{background-color: #fff;border-radius:50%;overflow: hidden;border: 0px solid #fff;}
.experience-years-inr a{display: block;padding: 5px;font-weight: 500;font-size: 14px;line-height: 1;color: #444;}
.experience-years-inr a svg{width: 155px;animation: move 10s infinite linear;}
@keyframes move{0%{transform: rotate(0deg);}100%{transform: rotate(360deg);}}
textPath{fill: #444;letter-spacing: 1px;font-weight: 500;text-transform: uppercase;font-size: 9px;}
.catalog-download span{color: var(--theme-color);width: 65px;height: 65px;background: #fff;border-radius: 50px;display: flex;align-items: center;justify-content: center;font-size: 25px;overflow: hidden;padding: 5px;position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);font-size: 33px;font-weight: 700;color: #0d8ebd;}
.catalog-download span sup{font-size: 60%;font-weight: 400;}
#circlePath{fill: transparent;}

.welcome-points{ margin: 0px 0px 30px 0px; padding: 0px 0px; position: relative;}
.welcome-points li{ list-style: none; padding:5px 0px 5px 35px; position: relative; font-size: 18px;}
.welcome-points li::before{content: '';display: block;position: absolute;left: 0;top: 5px;background: url(../img/check.png) no-repeat;width: 25px;height: 25px;background-size: contain;}



#marquee-carousel{ padding: 25px 0px; position: relative; overflow: hidden; z-index: 11;}
#marquee-carousel::before{ content: ''; display: block; background: #161D41; position: absolute; top: 1px; right: 0; width: 51%; height:25px; clip-path: polygon(100% 0, 0 100%, 100% 99%);}
#marquee-carousel::after{ content: ''; display: block; background: #161D41; position: absolute; bottom: 0; left: 0; width: 51%; height:25px; clip-path: polygon(100% 0, 0 0, 0 100%);}
#marquee-carousel .marquee-slider{padding: 15px 0px; background: linear-gradient(176deg,rgba(164, 51, 254, 1) 0%, rgba(79, 63, 168, 1) 100%);}
#marquee-carousel .item{ font-size: 18px; color: #fff; font-weight: 600; padding: 0px 10px;}

#offer-section{ margin: -25px 0px 0px 0px; padding: 75px 0px 75px 0px; position: relative; background: url(../img/services-bg.jpg) no-repeat; background-size: cover; z-index: 1;}
#offer-section::before{content: '';display: block;background: rgb(10 16 43 / 78%);position: absolute;left: 0;bottom: 0;width: 100%;height: 45%;z-index: -1;}
#offer-section::after{content: '';display: block;background: url(../img/service-img.jpg) no-repeat fixed;position: absolute;left: 0;bottom: 0;width: 100%;height: 45%;opacity: .35;z-index: -2;}
.offer-top{ margin: 0px 0px 75px 0px; padding: 0px 0px 0px 0px; position: relative;}
.offer-left{ margin: 0px 0px 0px 0px; padding: 0px 0px; position: relative;}

.services-data{ margin: 0px 0px; padding: 0px 0px; position: relative;}
.services-info{margin: 0px 0px;padding: 30px 30px;background: #fff;border-radius: 20px;height: 100%;box-shadow: 0px 0px 25px 0px rgb(15 17 30 / 13%); position: relative; z-index: 1;}
.services-info::before{ content: ''; display: block; position: absolute; right: 0; top: 0; width: 15px; height: 15px; border-radius: 20px; z-index: -1; background: #4a3dac; opacity: 0; transition: all ease 0.5s; clip-path: circle(26.3% at 100% 0);}
.services-info a{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1;}
.services-info span{ display: block; margin: 0px 0px 20px 0px;}
.services-info span img{ max-width: 70px; transition: all ease 0.5s;}
.services-info h3{ font-size: 20px; color: #202020; margin: 0px 0px 15px 0px; text-transform: uppercase; transition: all ease 0.5s;}
.services-info p{ transition: all ease 0.5s;}
.services-info:hover::before{ width: 100%; height: 100%; opacity: 1; clip-path: circle(141.4% at 100% 0);}
.services-info:hover img{ filter: brightness(0) invert(1);}
.services-info:hover h3, .services-info:hover p{ color: #fff;}

#why-choose-section{ margin: 0px 0px 0px 0px; padding: 75px 0px; position: relative;}
.choose-img{ margin: 0px 0px 0px 0px; padding: 0px 0px; position: relative;}
.choose-img:before{ content: ''; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(167deg,rgba(64, 62, 167, 0) 0%, rgba(151, 53, 241, 0.76) 100%); border-radius: 30px;}
.choose-img img{ border-radius: 30px; width: 100%;}
.choose-left{ margin: 0px 0px; padding: 0px 0px; position: relative;}
.choose-points{ margin: 0px 0px 30px 0px; padding: 0px 0px; position: relative;}
.choose-points li{ list-style: none; padding:5px 0px 5px 35px; position: relative; font-size: 18px;}
.choose-points li::before{content: '';display: block;position: absolute;left: 0;top: 5px;background: url(../img/check.png) no-repeat;width: 25px;height: 25px;background-size: contain;}

#counter-section{ margin: 0px 0px; padding: 0px 0px 75px 0px; position: relative;}
.experience-counter{ margin: 0px 0px; padding: 35px 30px; position: relative; background: #161D41; border-radius: 100px 100px 100px 100px;}
.progress-content{ margin: 0px 0px; padding: 0px 30px; position: relative; text-align: center; border-right: 1px solid #ffffff24;}
.progress-content h3{font-size: clamp(1.5rem, 2vw + 1rem, 3.5rem);color: transparent;font-weight: 700;margin: 0px 0px;-webkit-text-stroke: 1px #fff;position: relative;display: flex;align-items: flex-start;margin-bottom: 2px;width: 100%;justify-content: center;}
.progress-content p{ font-size: 22px; color: #fff; margin: 0px 0px 0px 0px;}
.progress-content .counter {position: relative;display: flex;overflow: hidden;height: 55px;text-align: center;padding-right: 10px;align-items: flex-end;justify-content: center;}
.progress-content .counter > span {z-index: 1;display: flex;flex-direction: column;height: 100%;width: 27px;transition: transform 2s ease;transform: translateY(0);align-items: center;}
.progress-content .counter > span span { flex: 0 0 100%; height: 100%;}
.progress-content:last-child .counter > span:last-child span{margin: 0px 0px 0px 0px;}
.experience-counter .progress-content h3:after {
    content: '+';
    font-weight: 400;
    margin: -3px -3px 0;
}

#client-testimonials{ margin: 0px 0px; padding: 75px 0px; position: relative; background: url(../img/services-bg.jpg) no-repeat;}
.testimonial-section{ margin: 0px 0px; padding: 0px 0px; position: relative;}
.testimonial-info{margin: 0px 0px 0px 0px;padding: 55px 0px 40px 0px;position: relative;}
.testimonial-info::before{content: '';display: block;position: absolute;top: 0;left: 0;background: url(../img/quote.png) no-repeat;width: 42px;height: 32px;background-size: contain;}
.testimonial-info p{ font-size: 18px; color: #444; line-height: 1.4;}
.testimonial-img{margin: 0px 0px 0px 0px;padding: 20px 0px 0px 0px;position: relative;z-index: 1;display: flex;align-items: center;}
.testimonial-img span{max-width: 150px;z-index: 1;padding: 0px 15px 0px 0px;border-right: 1px solid #ccc;margin: 0px 15px 0px 0px; display: none;}
.testimonial-img span img{ width: 100%;}
.testimonial-img h3{font-size: 20px;color: #444;font-weight: 600;}
.testimonial-img h3 small{display: block;font-size: 15px;color: #565656;font-weight: 400;margin: 7px 0px 0px 0px;}

#blog-section{ padding: 75px 0px; background: #fff; position: relative;}
.blog-slider{ padding: 0px 15px; margin: 0px 0px; position: relative;}
.blog-info{ margin: 0px 0px; padding: 25px 25px; position: relative; z-index: 1;}
.blog-info a{ display: block; position: absolute; top: 0; width: 100%; height: 100%; z-index: 1;}
.blog-info::before{ content: ''; display: block; position: absolute; bottom: 0; left: 0; right: 0; margin: auto; width: 100%; height: 55%; border: 2px solid #444; border-radius: 15px; z-index: -1;}
.blog-info .blog-img{ margin: 0px 0px 20px 0px; padding: 0px 0px; position: relative; overflow: hidden;}
.blog-info .blog-img img{ border-radius: 10px; max-height: 220px; width: 100%; object-fit: cover; transition: all ease 0.5s;}
.blog-info .blog-content{ margin: 0px 0px 0px 0px; padding: 0px 50px 0px 0px; position: relative;}
.blog-info .blog-content h3{ font-size: 17px; color: #444; font-weight: 600;}

.blog-info .blog-img:after {content: ""; position: absolute; width: 200%; height: 0%; left: 50%; top: 50%; z-index: 1; background-color: rgba(255, 255, 255, 0.3); -webkit-transform: translate(-50%, -50%) rotate(-45deg); transform: translate(-50%, -50%) rotate(-45deg); transition: none;  }
.blog-info:hover .blog-img:after{height: 250%; -webkit-transition: all 600ms linear; transition: all 600ms linear; background-color: transparent; } 
.blog-info:hover .blog-img img{ transform: scale(1.1) rotate(3deg);}

#footer{ padding: 50px 0px 0px 0px; margin: 0px 0px; position: relative; background: #161D41;}
.footer-top{ margin: 0px 0px 20px 0px; padding: 0px 0px; position: relative;}
.mantra-text{ margin: 0px 0px; padding: 0px 0px; position: relative;}
.mantra-text h4{ font-size: 60px; color: transparent; -webkit-text-stroke: 2px #FFA500; font-weight: 700; margin: 0px 0px;}

.footer-body{ margin: 0px 0px; padding: 0px 0px 20px 0px; position: relative; border-bottom: 1px solid #ffffff40;}
.footer-body h2{ font-size: 20px; color: #fff; font-weight: 600; margin: 0px 0px 15px 0px;}
.footer-address{ margin: 0px 0px 0px 0px; padding: 0px 0px; position: relative;}
.address-list{ margin: 0px 0px 0px 0px; padding: 0px 0px; position: relative;}
.address-list li{ list-style: none; font-size: 17px; color: #fff; opacity: .7; margin: 0px 0px 15px 0px; padding: 0px 50px 0px 30px;}
.address-list li span{ position: absolute; left: 0;}
.address-list li a{font-size: 17px; color: #fff; opacity: .8;}

.footer-link{ margin: 0px 0px 0px 0px; padding: 0px 0px; position: relative;}
.footer-link li{ margin: 0px 0px; padding: 0px 0px; position: relative; list-style: none;}
.footer-link li a{color: #fff;opacity: .7;padding: 3px 0px;display: inline-block; transition: all ease 0.5s; position: relative; overflow: hidden;}
.footer-link li a::before{ content: ''; display: block; position: absolute; left: 0; bottom: 0; width: 0; height: 2px; background: #fff; transition: all ease 0.5s;}
.footer-link li a:hover::before{ width: 100%; left: 100%;}
.footer-link li a:hover{ opacity: 1;}

.form-group{ margin: 0px 0px 30px 0px; padding: 0px 0px; position: relative;}
.form-group input{ width: 100%; padding: 10px 20px; border: 2px solid #fff; font-size: 15px; color: #fff; background: transparent; border-radius: 30px;}
.form-group .subscribe{position: absolute;right: 0px;padding: 3px 15px;border-left: 1px solid #fff !important;background: transparent;border: none;top: 0;bottom: 0;font-size: 13px;color: #fff;font-weight: 500;}
.social{margin: 0px 0px 0px 0px;padding: 0px 0px;position: relative;display: flex;flex-wrap: wrap;}
.social li{display: flex;margin: 0px 7px 0px 0px;align-items: center;}
.social li a{display: flex;font-size: 15px;color: #fff;padding: 5px 5px;width: 35px;height: 35px;line-height: 35px;border: 2px solid #fff;border-radius: 35px;align-items: center;justify-content: center;}
.footer-bottom{ padding: 15px 0px; text-align: center; position: relative;}
.footer-bottom p{ margin: 0px 0px; font-size: 16px; color: #fff;}

/* Custom styles for Lead Process Steps to match existing design */
#lead-process-steps {
    padding-top: 5rem;
    padding-bottom: 5rem;
    background-color: #f8f9fa; /* Matches the background of the "What We Offer" section */
}

/* Section Title */
#lead-process-steps .section-title {
    font-family: 'Montserrat', sans-serif;
    font-size: 2.8rem;
    font-weight: 700;
    text-align: center;
    margin-bottom: 4rem;
    color: #343a40;
}

@media (max-width: 767.98px) {
    #lead-process-steps .section-title {
        font-size: 2rem;
        margin-bottom: 3rem;
    }
}

/* Card Styling */
.lead-step-card {
    background-color: #ffffff;
    padding: 2rem;
    border-radius: 0.5rem;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08);
    transition: all 0.3s ease-in-out;
    min-height: 280px; /* This is the key change for uniform size */
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start; /* Left-aligns content */
    border: 1px solid transparent; /* A transparent border to prevent shifting on hover */
}

.lead-step-card:hover {
    box-shadow: 0 8px 15px rgba(0, 0, 0, 0.12); /* A more subtle, deeper shadow */
    border-color: #007bff; /* Adds a border on hover for a cleaner look */
}

/* Icon Styling */
.lead-step-icon {
    font-size: 2.5rem;
    color: #007bff;
    margin-bottom: 1rem;
    line-height: 1;
    transition: color 0.3s ease;
}

.lead-step-card:hover .lead-step-icon {
    color: #0056b3; /* Darker blue on hover */
}

/* Title Styling */
.lead-step-title {
    font-family: 'Montserrat', sans-serif;
    font-size: 1.25rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
    color: #343a40;
    text-align: left; /* Ensures title is left-aligned */
}

/* Description Styling */
.lead-step-description {
    font-family: 'Inter', sans-serif;
    font-size: 1rem;
    color: #6c757d;
    flex-grow: 1;
    line-height: 1.6;
    text-align: left; /* Ensures description is left-aligned */
}




/* dm */


/* Digital Marketing Services Section */
#digital-marketing-services {
    padding-top: 5rem;
    padding-bottom: 5rem;
    background-color: #f8f9fa;
}

#digital-marketing-services .section-title {
    font-family: 'Montserrat', sans-serif;
    font-size: 2.8rem;
    font-weight: 700;
    text-align: center;
    margin-bottom: 4rem;
    color: #343a40;
}

@media (max-width: 767.98px) {
    #digital-marketing-services .section-title {
        font-size: 2rem;
        margin-bottom: 3rem;
    }
}

/* Service Card Styling */
.service-card {
    background-color: #ffffff;
    padding: 2rem;
    border-radius: 0.5rem;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08);
    transition: all 0.3s ease-in-out;
    min-height: 250px; /* Ensures all cards are the same height */
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    border: 1px solid transparent;
}

.service-card:hover {
    box-shadow: 0 8px 15px rgba(0, 0, 0, 0.12);
    border-color: #007bff;
}

/* Icon Styling */
.service-icon {
    font-size: 2.5rem;
    color: #007bff;
    margin-bottom: 1rem;
    line-height: 1;
    transition: color 0.3s ease;
}

.service-card:hover .service-icon {
    color: #0056b3;
}

/* Title Styling */
.service-title {
    font-family: 'Montserrat', sans-serif;
    font-size: 1.25rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
    color: #343a40;
    text-align: left;
}

/* Description Styling */
.service-description {
    font-family: 'Inter', sans-serif;
    font-size: 1rem;
    color: #6c757d;
    flex-grow: 1;
    line-height: 1.6;
    text-align: left;
}




/* wd */

/* Website Services Section */
#website-services {
    padding-top: 5rem;
    padding-bottom: 5rem;
    background-color: #f8f9fa; /* Matches other sections */
}

#website-services .section-title {
    font-family: 'Montserrat', sans-serif;
    font-size: 2.8rem;
    font-weight: 700;
    text-align: center;
    margin-bottom: 4rem;
    color: #343a40;
}

/* Service Card Styling */
#website-services .service-card {
    background-color: #ffffff;
    padding: 2rem;
    border-radius: 0.5rem;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08);
    transition: all 0.3s ease-in-out;
    min-height: 250px; /* Ensures all cards are the same height */
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    border: 1px solid transparent;
}

#website-services .service-card:hover {
    box-shadow: 0 8px 15px rgba(0, 0, 0, 0.12);
    border-color: #007bff;
}

/* Icon Styling */
#website-services .service-icon {
    font-size: 2.5rem;
    color: #007bff; /* Changed from teal to blue for consistency */
    margin-bottom: 1rem;
    line-height: 1;
    transition: color 0.3s ease;
}

#website-services .service-card:hover .service-icon {
    color: #0056b3;
}

/* Title and Description Styling */
#website-services .service-title {
    font-family: 'Montserrat', sans-serif;
    font-size: 1.25rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
    color: #343a40;
    text-align: left;
}

#website-services .service-description {
    font-family: 'Inter', sans-serif;
    font-size: 1rem;
    color: #6c757d;
    flex-grow: 1;
    line-height: 1.6;
    text-align: left;
}

/* Development Process Section */
#dev-process {
    padding-top: 5rem;
    padding-bottom: 5rem;
    background-color: #f8f9fa; /* Consistent with other sections */
}

#dev-process .section-title {
    font-family: 'Montserrat', sans-serif;
    font-size: 2.8rem;
    font-weight: 700;
    text-align: center;
    margin-bottom: 4rem;
    color: #343a40;
}

/* Process Card Styling */
#dev-process .process-card {
    background-color: #ffffff;
    padding: 2rem;
    border-radius: 0.5rem;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08);
    transition: all 0.3s ease-in-out;
    min-height: 250px; /* Ensures uniform height */
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
}

#dev-process .process-card:hover {
    box-shadow: 0 8px 15px rgba(0, 0, 0, 0.12);
    transform: translateY(-5px);
}

/* Process Number Styling */
#dev-process .process-number {
    font-family: 'Montserrat', sans-serif;
    font-size: 2.5rem;
    font-weight: 700;
    color: #007bff; /* Consistent blue color */
    margin-bottom: 1rem;
}

/* Process Title and Description Styling */
#dev-process .process-title {
    font-family: 'Montserrat', sans-serif;
    font-size: 1.25rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
    color: #343a40;
}

#dev-process .process-description {
    font-family: 'Inter', sans-serif;
    font-size: 1rem;
    color: #6c757d;
    line-height: 1.6;
}



/* md */


/* Mobile App Services Section */
#mobile-app-services {
    padding-top: 5rem;
    padding-bottom: 5rem;
    background-color: #f8f9fa; /* Matches other sections */
}

#mobile-app-services .section-title {
    font-family: 'Montserrat', sans-serif;
    font-size: 2.8rem;
    font-weight: 700;
    text-align: center;
    margin-bottom: 4rem;
    color: #343a40;
}

/* Service Card Styling */
#mobile-app-services .service-card {
    background-color: #ffffff;
    padding: 2rem;
    border-radius: 0.5rem;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08);
    transition: all 0.3s ease-in-out;
    min-height: 250px; /* Ensures all cards are the same height */
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    border: 1px solid transparent;
}

#mobile-app-services .service-card:hover {
    box-shadow: 0 8px 15px rgba(0, 0, 0, 0.12);
    border-color: #007bff;
}

/* Icon Styling */
#mobile-app-services .service-icon {
    font-size: 2.5rem;
    color: #007bff; /* Consistent blue color */
    margin-bottom: 1rem;
    line-height: 1;
    transition: color 0.3s ease;
}

#mobile-app-services .service-card:hover .service-icon {
    color: #0056b3;
}

/* Title and Description Styling */
#mobile-app-services .service-title {
    font-family: 'Montserrat', sans-serif;
    font-size: 1.25rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
    color: #343a40;
    text-align: left;
}

#mobile-app-services .service-description {
    font-family: 'Inter', sans-serif;
    font-size: 1rem;
    color: #6c757d;
    flex-grow: 1;
    line-height: 1.6;
    text-align: left;
}

/* Development Process Section */
#dev-process {
    padding-top: 5rem;
    padding-bottom: 5rem;
    background-color: #f8f9fa; /* Consistent with other sections */
}

#dev-process .section-title {
    font-family: 'Montserrat', sans-serif;
    font-size: 2.8rem;
    font-weight: 700;
    text-align: center;
    margin-bottom: 4rem;
    color: #343a40;
}

/* Process Card Styling */
#dev-process .process-card {
    background-color: #ffffff;
    padding: 2rem;
    border-radius: 0.5rem;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08);
    transition: all 0.3s ease-in-out;
    min-height: 250px; /* Ensures uniform height */
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
}

#dev-process .process-card:hover {
    box-shadow: 0 8px 15px rgba(0, 0, 0, 0.12);
    transform: translateY(-5px);
}

/* Process Number Styling */
#dev-process .process-number {
    font-family: 'Montserrat', sans-serif;
    font-size: 2.5rem;
    font-weight: 700;
    color: #007bff; /* Consistent blue color */
    margin-bottom: 1rem;
}

/* Process Title and Description Styling */
#dev-process .process-title {
    font-family: 'Montserrat', sans-serif;
    font-size: 1.25rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
    color: #343a40;
}

#dev-process .process-description {
    font-family: 'Inter', sans-serif;
    font-size: 1rem;
    color: #6c757d;
    line-height: 1.6;
}


/* ux */


/* UI/UX Services Section */
#ui-ux-services {
    padding-top: 5rem;
    padding-bottom: 5rem;
    background-color: #f8f9fa; /* Matches other sections */
}

#ui-ux-services .section-title {
    font-family: 'Montserrat', sans-serif;
    font-size: 2.8rem;
    font-weight: 700;
    text-align: center;
    margin-bottom: 4rem;
    color: #343a40;
}

/* Service Card Styling */
#ui-ux-services .service-card {
    background-color: #ffffff;
    padding: 2rem;
    border-radius: 0.5rem;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08);
    transition: all 0.3s ease-in-out;
    min-height: 250px; /* Ensures all cards are the same height */
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    border: 1px solid transparent;
}

#ui-ux-services .service-card:hover {
    box-shadow: 0 8px 15px rgba(0, 0, 0, 0.12);
    border-color: #007bff;
}

/* Icon Styling */
#ui-ux-services .service-icon {
    font-size: 2.5rem;
    color: #007bff; /* Consistent blue color */
    margin-bottom: 1rem;
    line-height: 1;
    transition: color 0.3s ease;
}

#ui-ux-services .service-card:hover .service-icon {
    color: #0056b3;
}

/* Title and Description Styling */
#ui-ux-services .service-title {
    font-family: 'Montserrat', sans-serif;
    font-size: 1.25rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
    color: #343a40;
    text-align: left;
}

#ui-ux-services .service-description {
    font-family: 'Inter', sans-serif;
    font-size: 1rem;
    color: #6c757d;
    flex-grow: 1;
    line-height: 1.6;
    text-align: left;
}

/* Development Process Section */
#dev-process {
    padding-top: 5rem;
    padding-bottom: 5rem;
    background-color: #f8f9fa; /* Consistent with other sections */
}

#dev-process .section-title {
    font-family: 'Montserrat', sans-serif;
    font-size: 2.8rem;
    font-weight: 700;
    text-align: center;
    margin-bottom: 4rem;
    color: #343a40;
}

/* Process Card Styling */
#dev-process .process-card {
    background-color: #ffffff;
    padding: 2rem;
    border-radius: 0.5rem;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08);
    transition: all 0.3s ease-in-out;
    min-height: 250px; /* Ensures uniform height */
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
}

#dev-process .process-card:hover {
    box-shadow: 0 8px 15px rgba(0, 0, 0, 0.12);
    transform: translateY(-5px);
}

/* Process Number Styling */
#dev-process .process-number {
    font-family: 'Montserrat', sans-serif;
    font-size: 2.5rem;
    font-weight: 700;
    color: #007bff; /* Consistent blue color */
    margin-bottom: 1rem;
}

/* Process Title and Description Styling */
#dev-process .process-title {
    font-family: 'Montserrat', sans-serif;
    font-size: 1.25rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
    color: #343a40;
}

#dev-process .process-description {
    font-family: 'Inter', sans-serif;
    font-size: 1rem;
    color: #6c757d;
    line-height: 1.6;
}





.job-actions {
  margin-top: 10px;
}

.job-actions button,
.job-actions a {
  padding: 8px 14px;
  margin-right: 10px;
  border: none;
  background-color: #007bff;
  color: white;
  border-radius: 4px;
  cursor: pointer;
  text-decoration: none;
}

.job-actions button:hover,
.job-actions a:hover {
  background-color: #0056b3;
}

.job-full-details {
  margin-top: 20px;
  padding-top: 10px;
  border-top: 1px solid #ddd;
  animation: fadeIn 0.3s ease-in-out;
}

@keyframes fadeIn {
  from { opacity: 0; transform: translateY(-5px); }
  to { opacity: 1; transform: translateY(0); }
}