/*-----------------------------------------------------------------------------------

    Project Name: KBM Infotech - Website Design & Development Company
    Author: KBM Infotech -->> (https://kbminfotech.com)
    Support: info@kbminfotech.com
    Description: KBM Infotech - KBM Infotech is a Jaipur-based IT company delivering smart solutions in website development, software development, SEO, and digital marketing. We focus on innovation, transparency, and client satisfaction to help businesses grow online.
    Developer: Bhaskar Kumawat -> info@kbminfotech.com
    Version: 1.0

-----------------------------------------------------------------------------------

    CSS INDEX
    ==================

	01. Theme default CSS
    02. header
    03. global
    04. hero
    05. feature
    06. about
    07. service
    08. team
    09. testimonial
    10. contact
    11. blog
    12. bramd
    13. pricing
    14. project
    15. cta
    16. fanfact
    17. marquee
    18. process
    19. banner
    20. portfolio
    21. accordion
    22. mission
    23. career
    24. shop
    25. breadcrumb
    26. sidebar
    27. backtotop
    28. sec-title
    29. search
    30. mobile-menu
    31. 404
    32. preloader

-----------------------------------------------------------------------------------*/
:root {
  --color-primary: #FF6600;
  --color-secondary: #0000FF;
  --color-black: #000;
  --color-white: #ffffff;
  --btn-primary: #0000FF;
  --btn-secondary: #FF6600;
  --bg-primary: #F3F6F8;
  --bg-secondary: #F8F6F3;
  --duration: 1s;
  --nav-duration: calc(var(--duration) / 4);
  --ease: cubic-bezier(0.215, 0.61, 0.355, 1);
  --font-family: 'Sofia Pro';
}

*,::after,::before {
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

/* scrollbar */
::-webkit-scrollbar {
  width: 5px;
  height: 5px;
}

::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
  -webkit-border-radius: 10px;
  border-radius: 10px;
}

::-webkit-scrollbar-thumb {
  -webkit-border-radius: 10px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.3);
  -webkit-box-shadow: inset 0 0 6px rgb(255 102 0);
}

::-webkit-scrollbar-thumb:window-inactive {
  background: rgba(255, 255, 255, 0.3);
}

body {
    line-height: 1.74;
    font-size: 15px;
    font-style: normal;
    font-weight: 400;
    font-family: 'Sofia Pro';
    color: #696969;
    position: relative;
    background-color: #fff
}

h1,h2,h3,h4,h5,h6 {
    color: var(--color-black);
    font-family: 'sofia pro';
    font-weight: 700;
    line-height: 1.41
}


h1 {
  font-size:38px!important
}
h2 {
  font-size:32px
}

h3 {
  font-size:30px
}
h4 {
  font-size:28px
}
h5 {
  font-size:24px
}
h6 {
  font-size:18px
}

ul, li {
  list-style: none;
  padding: 0;
  margin: 0;
}

a, a:hover {
    text-decoration: none;
}

.kbm-btn {
  position: relative;
  overflow: hidden;
  background-color: var(--btn-primary);
  color: var(--color-white);
  display: flex;
  align-items: center;
  padding: 8px 20px;
  font-weight: 400;
  font-size: 18px;
  border-radius: 100px;
  letter-spacing: 0.5px;
  gap: 6px;
  border: none;
  cursor: pointer;
  transition: background-color 0.3s ease;
}

.kbm-btn::before {
  content: '';
  position: absolute;
  top: 0;
  left: -75%;
  width: 50%;
  height: 100%;
  background: linear-gradient(
    120deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.5) 50%,
    rgba(255, 255, 255, 0) 100%
  );
  transform: skewX(-20deg);
}

/* Shine animation */
.kbm-btn:hover::before {
  animation: shine 0.8s forwards;
}

@keyframes shine {
  0% {
    left: -75%;
  }
  100% {
    left: 125%;
  }
}

.kbm-btn-arrow {
    color: var(--color-white);
    font-size: 16px;
    font-weight: 500;
    display: inline-flex;
    gap: 8px;
    align-items: center;
    text-transform: uppercase;
    padding: 7px 9px;
    line-height: normal;
    letter-spacing: 1px;
    position: relative;
    transition: all 0.3s ease-in-out;
}
.kbm-btn-arrow:before {
    content: "";
    position: absolute;
    height: 34px;
    width: 34px;
    border-radius: 50%;
    left: 0;
    top: 0;
    background-color: var(--btn-secondary);
    z-index: 1;
    transition: all 0.3s ease-in-out;;
}
.kbm-btn-arrow:hover{
    color: var(--btn-secondary);
}
.kbm-btn-arrow:hover::before {
    left: calc(100% - 38px);
}
.kbm-btn-arrow span{
    position: relative;
    z-index: 2;
    transition: all 0.3s ease-in-out;
}
.kbm-btn-arrow:hover span.icon-arrow-1{
    color: var(--color-white);
    margin-left: 4px;
}


/* ***************Common css end****************** */



/* Header css start */

.header-main {
    position: relative;
    width: 100%;
    z-index: 9;
    top: 0;
    background: #fff;
    border-bottom: 1px solid #D6E3E9;
}
.top-bar {
  background-color: var(--color-black); /* Deep blue */
  color: var(--color-white);
}
.top-bar a {
  color: #ffffff;
  text-decoration: none;
}
.top-bar .social-icons a {
  margin-left: 10px;
  color: #333;
  background-color: #ffffff;
  border-radius: 4px;
  padding: 0 6px;
  margin: 4px;
  display: inline-block;
}
.top-bar  .social-icons a:hover {
  color: #f60;
}


.navbar{
  padding: 0;
}

.navbar-brand img {
    height: 50px;
}

.desktop-navigation {
    display: flex;
    align-items: center;
    gap: 25px;
}
.desktop-navigation > li {
    position: relative;
}
.desktop-navigation li#dropdown {
    font-size: 18px;
    font-weight: 400;
    position: relative;
}

.desktop-navigation li a {
    color: var(--color-black);
    padding: 18px 4px 20px;
    position: relative;
    display: block;
    font-weight: 400;
    font-size: 18px;
}


.desktop-navigation li:hover a:before{width: 100%;}
.desktop-navigation > li > a::before {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 0;
  height: 2px;
  background: #FF6600;
  transition: width .3s;
}
.dropdown-m::after {
    content: "";
    position: absolute;
    right: -10px;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 7px;
    height: 12px;
    background-image: url(https://www.helpfulinsightsolution.com/wp-content/themes/hipl/images/right-arrow.svg);
    background-size: contain;
    background-repeat: no-repeat;
    transition: transform 0.3s ease;
    transform: rotate(90deg);
}

#dropdown:hover > a::after {
  transform: rotate(0deg);
}
.dropdown-content {
    display: none;
    position: fixed;
    left: 0;
    right: 0;
    top: 104px;
    background-color: var(--bg-primary);
    z-index: 1;
    border-radius: 10px;
    box-shadow: 0 10px 20px rgb(0 0 0 / 14%);
}

ul.dropdown-menu-link {
    padding: 5px 20px;
}

ul.dropdown-menu-link li a {
    border-bottom: 1px solid #ddd;
    font-weight: 300;
    font-size: 17px;
    padding: 10px 5px;
}
ul.dropdown-menu-link li:last-child a {
	border: 0;
}
ul.dropdown-menu-link li a:hover{
  border-bottom: 1px solid #FF6600;
}


ul.dropdown-menu-link li a span {
    margin: 0 10px 0 0;
    font-size: 14px;
    color: var(--color-primary);
}

.megamenu-content {
  position: relative;
  left: 10px;
  border-radius: 10px;
  background-color: var(--color-black);
  padding: 30px;
  height: 100%;
  text-align: center;
}

.megamenu-content h3 {
  font-size: 16px;
  color: var(--color-white);
  text-transform: uppercase;
}
.megamenu-content h4 {
  color: var(--color-primary);
}



.float-navbar {
    display: flex;
    align-items: center;
}



/* call button for mobile screen */
.call-btn.mobile-view {
    display: none;
}


.main-navigation-toggle {
    position: fixed;
    height: 1px;
    width: 1px;
    overflow: hidden;
    clip: rect(1px, 1px, 1px, 1px);
    white-space: nowrap;
}
.call-btn.mobile-view {
    display: none;
}

.call-btn {
    align-items: center;
    font-size: 18px;
    padding: 7px 18px 7px 18px;
}
    
.call-btn {
    border-radius: 100px;
    color: #6e6d6d !important;
    display: flex;
    padding: 10px 24px 8px 24px;
    margin-right: 12px;
    font-weight: 400;
    font-size: 18px;
    background: #fff;
    border: 1px solid #DBDBDB;
}

.desktop-navigation li#dropdown:hover .dropdown-content {
  display: block;
}

.main-navigation {
	position: fixed;
	top: 0;
	left: 0;
	overflow: hidden;
	display: flex;
	align-items: center;
	width: 100%;
	height: 100%;
	transform: translateX(-100%);
	transition: transform var(--nav-duration); /*not setteled*/
	z-index: 3;
}
.main-navigation-toggle {
  position: fixed;
  height: 1px;
  width: 1px;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px);
  white-space: nowrap;
}

/* ***Hero section */

.hero-section{
    background: linear-gradient(to right, #fff, #FFF4F0);
}
.hero-content .section-subtitle{
    font-size: 16px;
    font-weight: 400;
    color: #000;
    padding: 10px 20px;
    background: #FFF5EF;
    border-radius: 100px;
    display: inline-block;
    font-style: italic;
    margin: 0 0 30px;
    letter-spacing: 0.5px;
    line-height: 1.2;
}
.hero-content h1 span.highlight {
    color: #ff6600;
}
.hero-content p{
    font-size: 18px;
}
.hero-content .hero-buttons{
  padding: 20px 0 0;
}
.hero-content .video-btn{
  color: var(--color-black);
  padding: 10px 20px 10px 20px;
  font-size: 18px;
}
.hero-content .video-btn span{
  font-size: 28px;
  margin: 0 0 0 5px;
  position: relative;
  top: 7px;
}

.hero-section .icon-wrapper {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 15px;
}
.hero-section .icon-card {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 60px;
    height: 60px;
    border-radius: 10px;
    background-color: #fff;
    box-shadow: 0 10px 10px rgb(0 0 0 / 20%);
    transition: all 0.3s ease-in-out;
    cursor: pointer;
}
.hero-section .icon-card> i{
    font-size: 40px;
}

.icon-card:hover {
  transform: scale(1.15);
  box-shadow: 0 6px 20px rgba(0,0,0,0.2);
}

/* ***Hero section END*/


/* services section */

.services-section .subheading {
  font-weight: 600;
  font-size: 20px;
  line-height: 28px;
}

.services-section .tab-sidebar {
  background: #000;
  min-height: 100%;
  border-radius: 20px 0 0 20px;
  padding: 20px 0;
  box-shadow: 0 3px 15px rgba(0, 0, 0, 0.2);
}
.services-section .tab-sidebar .nav-link {
  border-radius: 0;
  color: #fff;
  text-align: left;
  padding: 12px 20px;
  font-weight: 500;
  transition: 0.3s;
}
.services-section .tab-sidebar .nav-link.active {
  margin-right: -20px;
  box-shadow: 2px 0 10px rgba(0, 0, 0, 0.4);
  z-index: 2;
  margin-left: 22px;
}
/* Right Content Box */
.services-section .tab-content-box {
  background: linear-gradient(to right,#000,#1c315b);
  padding: 30px 55px;
  border-radius: 0 20px 20px 0;
  box-shadow: 0 3px 15px rgba(0, 0, 0, 0.4);
  min-height: 300px;
  position: relative;
  z-index: 1;
  height: 100%;
  margin-left: 2%;
}
.services-section .tab-content-box h4 {
  color: var(--color-white);
  margin-bottom: 15px;
  text-transform: capitalize;
}
.services-section .tab-content-box h5 {
  color: var(--color-white);
  font-weight: 400;
  text-transform: capitalize;
}
.services-section .tab-content-box p {
  color: #bababa;
  margin-bottom: 20px;
  font-size: 17px;
  line-height: 24px;
}
.services-section .frameworks-outer a{
  display: inline-block;
  font-family: var(--font-family) !important;
  color: var(--color-white);
  text-align: center;
  text-transform: capitalize;
  transition: 0.3s;
} 
.services-section .frameworks-outer a .svg-icon{
    width: 70px;
    height: 70px;
}
.services-section .frameworks-outer a:hover{
  color: var(--color-primary);
}
.mobile-accordion{
    display: none;
  }



/* List Styling */
.services-section .tab-content-box ul {list-style: none;padding-left: 0;}
.services-section .tab-content-box ul li { margin-bottom: 10px; position: relative; padding-left: 18px;}
.services-section .tab-content-box ul li::before {content: "■";font-size: 10px; color: #000; position: absolute; left: 0; top: 0px;}
.services-section .tab-content-box ul li a {text-decoration: none;color: #ff6600;font-weight: 500;}
.services-section .tab-content-box ul li a:hover {text-decoration: underline;}


.services-section .service-content {font-size: 16px;line-height: 24px;vertical-align: middle;}
/*****mobile**/
.mobile-accordion .accordion-button:focus {box-shadow: none;}
.mobile-accordion .accordion-button.collapsed {padding: 20px 19px;background: #fff;color: #000;font-size: 22px;}
.mobile-accordion .accordion-button {padding: 20px 19px !important;background: #ff6600;color: #fff;}
.mobile-accordion .collapse.show .accordion-body {padding: 20px 24px 0;background: #fff4f0;margin: 0 0 0;}
.mobile-accordion .accordion-item {padding: 0 0;}
/* Hide accordion on desktop, hide sidebar on mobile */






/***********************clients css******************/
.our-clients-logos{
  height: 100%;
}
.our-clients ul {
    display: grid;
    height: 100%;
}
.our-clients ul {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
}
.our-clients ul li {
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px;
    border: 1px solid #ddd;
}
.our-clients ul li img {
    transition: .22s;
    width: 100%;
    height: 100px;
    object-fit: contain;
    filter: grayscale(3);
}
.testimonial-box {
    height: 100%;
    padding: 25px;
    background: var(--color-black);
    border-radius: 0 20px 20px 0;
}
.testimonial-box h3 {
    color: #fff;
    margin-bottom: 24px;
}

.testimonial-box p {
    color: #bababa;
}
.our-clients ul li:hover img {
    filter: none;
}




.technology-section ul.logo-wrapper{display: flex; gap: 20px; justify-content: center; flex-wrap: wrap;}
.technology-section ul.logo-wrapper li{padding:5px 20px; height: 60px; text-align: center; border: 1px solid #ddd; border-radius: 10px; display: flex;
  overflow: hidden; width:auto; justify-content: center; gap:0; align-items: center;}
.technology-section ul.logo-wrapper li img{width: auto; display: block;}
.technology-section ul.logo-wrapper li p{margin: 0; font-size: 1rem; line-height: 120%; font-weight: 400; padding:0;}
.technology-section ul.logo-wrapper.full-width li{height: 70px; padding: 10px 20px;}
.technology-section ul.logo-wrapper.full-width li img{max-width: none;}

.technology-section ul.logo-wrapper li{width: 15%}

/****** About section********/
.about-section {
  padding: 70px 0;
  background: #fff;
} 
.about-section h6 {
  color: #999;
  text-transform: uppercase;
  font-weight: 600;
  margin-bottom: 10px;
  font-size: 15px;
} 
.about-images img {
  border-radius: 16px;
  width: 100%;
  height: auto;
  object-fit: cover;
}

.about-images .top-image img {
  height: auto;
} 
.about-images .bottom-images {
  display: flex;
  gap: 15px;
} 
.about-images .bottom-images img {
  height: 180px;  
  object-fit: cover;
  flex: 1;
}  
/* Rating Box */
.rating-box {
border: 1px solid #e1e1e1;
border-radius: 16px;
padding: 0 12px; 
} 
.about-section .rating-stars {
  color: #ffb400;
  font-size: 22px;
  font-weight: 700;
  letter-spacing: 2px;
}
.g-rating {
border-bottom: 1px solid #ddd;
gap: 8px;
display: flex;
padding: 11px 0;
}
.about-section .rating-box p {
 margin: 0;
font-size: 15px;
color: #575757;
padding: 4px 0;
}
/******Ai Section****/

    .ai-section {
      position: relative;
      overflow: hidden;
      border-radius: 15px;
    }

    .ai-section img {
      width: 100%;
      height: auto;
      border-radius: 15px;
      object-fit: cover;
      filter: brightness(0.7);
    }

    .ai-content {
      position: absolute;
      top: 50%;
      right: 5%;
      transform: translateY(-50%);
      background: rgba(60, 10, 100, 0.9);
      color: #fff;
      padding: 40px 50px;
      border-radius: 10px;
      max-width: 500px;
      border: 1px solid rgba(255, 255, 255, 0.2);
    }
 

    .ai-content .btn-outline-light {
      border-color: #d2ff00;
      color: #fff;
      background: transparent;
      font-weight: 500;
      padding: 8px 22px;
      transition: all 0.3s ease;
    }

    .ai-content .btn-outline-light:hover {
      background: #d2ff00;
      color: #000;
      border-color: #d2ff00;
    }

 /******** Award Section********/
     .awards-section {
      padding: 90px 0;
	  
    }
 
    .awards-title {
      color: #f25c2a; 
    }

    

    /* Middle circular stats */
    .stats {
        display: flex;
    flex-direction: column;
    gap: 40px;
    justify-content: center;
    align-items: center;
    border-right: 1px solid #dddddd4d;
    }

    .circle-wrapper {
      width: 140px;
      height: 140px;
      border-radius: 50%;
      position: relative;
      margin: 0 auto 10px;
    }

    .rotating-ring {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      border-radius: 50%;
      animation: rotateText 12s linear infinite;
    }

    .rotating-ring span {
      position: absolute;
      top: 50%;
      left: 50%;
      transform-origin: 0 0;
      font-size: 10px;
      color: #888;
      letter-spacing: 2px;
      text-transform: uppercase;
    }

    /* Center text static */
    .circle-center {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      text-align: center;
      z-index: 5;
      animation: none !important;
    }

    .circle-number {
      font-size: 22px;
      font-weight: 700;
      color: #fff;
      line-height: 1;
    }

    .circle-label {
      font-size: 11px;
      color: #aaa;
      text-transform: uppercase;
      letter-spacing: 1px;
      margin-top: 3px;
    }

    @keyframes rotateText {
      from {
        transform: rotate(0deg);
      }
      to {
        transform: rotate(360deg);
      }
    }

   

    /* RIGHT SIDE - Awards Grid */
    .awards-grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 40px 25px;
      justify-items: center;
      align-items: start;
    }

    .award-item {
      text-align: center;
      color: #fff;
    }

    .award-item img {
      width: 80px;
      height: auto;
      margin-bottom: 10px; 
      opacity: 0.9;
    }
    /*****************Cta Section*************/
    .cta-section {
      background: linear-gradient(90deg, #052d68 0%, #083b8c 100%);
      border-radius: 20px;
      color: #fff;
      padding: 0 40px; 
    } 

    .cta-section .cta-image {
      position: relative;
      text-align: center;
      z-index: 2;
    }

    .cta-section .cta-image img.main {
      max-width: 100%;
      height: auto;
      position: relative;
	   margin-top: -60px;
    }
/********************Success Css *********************************************/ 
    .success-section {
      text-align: center;
      padding: 80px 20px;
      background:#f0f8ff;
    }
 
    .success-card {
      background: #fff;
      border-radius: 10px;
      box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
      padding: 14px 20px;
      transition: all 0.3s ease;
      height: 100%;
    }
    .success-card:hover {
      transform: translateY(-5px);
      box-shadow: 0 6px 18px rgba(0, 0, 0, 0.1);
    }
    .success-card i {
      font-size: 2.5rem;
      color: #ff6600;
      margin-bottom: 20px;
    }
    .success-card h6 {
      font-weight: 600;
      font-size: 1rem;
      color: #000;
      margin-top: 10px;
      line-height: 1.4;
    }
 /********Bottom Footer Css*********/
 .partner-logos {
      background: #fff;
      text-align: center;
      padding: 15px 20px 10px;
    }
    .partner-logos img {
      max-height: 40px;
      margin: 0 20px;
      transition: all 0.3s ease;
      filter: grayscale(0);
    }
    .partner-logos img:hover {
      transform: scale(1.05);
      filter: grayscale(0%);
    }
    .copyright-text {
      text-align: center;
      color: #444;
      font-size: 0.95rem;
      margin-top: 6x;
      padding-bottom: 3px;
    }
    .copyright-text strong {
      color: #000;
    }
/*********Footer Css***********************/
.main-footer {
    background: #000;
        padding: 0 0 21px;
}
#footer_row {
    font-size: 16px;
        color: #9e9e9e;
}
.content {
    max-width: 1920px;
    padding-left: 100px;
    padding-right: 100px;
    margin-left: auto;
    margin-right: auto;
}
.footer_pixel_design {
    padding: 40px 0 0;
}
.footer_pixel_design img {
    margin-bottom: 20px;
}.footer_pixel_design p {
    color: #fff;
    font-size: 17px;
}
.footer_pixel_design .f-contact-link li {
    margin: 0;
    padding: 10px 0 0;
    display: flex;
    justify-content: left;
    align-items: center;
    gap: 14px;
}
.footer_pixel_design .f-contact-link li span {
    font-size: 22px;
    color: #FF6600;
}
.icon-email-2-1:before {
    content: "\e90a";
}
.footer_pixel_design .f-contact-link li a {
    font-weight: 300;
    font-size: 17px;
    color: #fff;
}
.footer_pixel_design ul.footer-social {
    padding: 40px 0 0;
    display: flex;
    gap: 15px;
    justify-content: left;
    align-items: center;
}
.footer_pixel_design ul.footer-social li {
    margin: 0;
}
.footer_pixel_design li a {
    color: #F2F2F2;
    font-weight: 500;
   
}
.footer_pixel_design li {
    margin-top: 10px;
}
.footer_pixel_design ul.footer-social li a span {
    font-size: 30px;
    color: #fff;
}
.icon-Facebook:before {
    content: "\e902";
}
.footer_pixel_design.quick-link {
    padding-left: 80px;
}
.footer_pixel_design h4 {
    font-weight: 400;
    color: #fff;
    margin: 0 0 30px;
}
.footer_pixel_design ul.footer-list-link li a {
    font-weight: 300;
    display: flex;
    color: #fff;
    font-size: 16px;
}
.footer_pixel_design ul.footer-list-link li a span.icon-right-arrow-1 {
    top: 8px;
}
.footer_pixel_design ul.footer-list-link li a span {
    margin: 0 8px 0 0;
    position: relative;
}
/**********Before Footer Cta Section Css***********/
.footer-contact-wrapper .container {
    background: #F2F7FF url("../images/footer-contact-creative.png") left bottom no-repeat;
    background-size: 95%;
    border-radius: 10px;
        text-align: left;

}
.footer-contact-left {
    padding: 50px;
}
.footer-contact-left h3 {
    font-size: 40px;
    font-weight: 200;
}
.footer-contact-left h2 {
    font-size: 50px;
    margin: 30px 0;
}
.footer-contact-left ul li {
    padding: 0 0 10px;
    display: flex;
    justify-content: left;
    align-items: center;
    gap: 16px;
}
.footer-contact-left ul li span {
    padding: 10px;
    background: #E0EAFB;
    border-radius: 5px;
    color: #0D2F63;
    font-size: 22px;
}
.icon-email-2-1:before {
    content: "\e90a";
}
.footer-contact-left ul li a {
    font-size: 20px;
    font-weight: 400;
    color: #0e2f64;
}
.footer-contact-right {
    padding: 50px 40px 50px 0;
}
.form-wrapper {
    padding: 30px;
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 0 30px rgba(0, 0, 0, 0.05);
}
.form-container h2.common-heading {
    font-size: 30px;
    margin: 0 0 25px;
        font-weight: 600;
    color: #060606;
}
.form-container h2.common-heading span {
    display: block;
    width: 50px;
    height: 3px;
    background: #43B614;
    margin: 10px 0 0;
}
.form-wrapper .mb-4 {
    position: relative;
}
.form-wrapper .mb-4 span.name {
    left: 3px;
}
.form-wrapper .mb-4 span, .form-wrapper .mb-4 img {
    position: absolute;
    left: 0;
    top: 13px;
    font-size: 20px;
    color: #838282;
}
.form-wrapper .form-control {
    text-transform: none;
    padding: 10px 10px 10px 38px;
    border-radius: 0 !important;
    font-size: 18px;
    font-weight: 300;
   border-bottom: 1px solid #ddd !important;
    border: none;
}
.form-wrapper .mb-4 img {
    top: 10px;
}
.form-wrapper .form-control:focus { 
    box-shadow: none;
}
/*********lets takl csss**********/

    .lets-talk {
         text-align: center;
    padding: 18px 20px;
    background-color: #000;
    border-radius: 20px;
    }

    .lets-talk h2 {
      font-size: 4rem;
      font-weight: 700;
      color: #fff;
    }

    .lets-talk h2 span {
      background: linear-gradient(45deg, #ffb800, #ff00b3);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
    }

    .lets-talk p {
        max-width: 650px;
    margin: 15px auto 40px;
    color: #fff;
    font-size: 21px;
    line-height: 1.6;
    }

    /* BUTTONS */
    .lets-talk .contact-buttons {
      display: flex;
      justify-content: center;
      align-items: center;
      gap: 0;
      flex-wrap: wrap;
    }

    .lets-talk .btn-whatsapp {
      background-color: #ffb800;
      color: #fff;
      font-weight: 600;
      padding: 14px 50px;
      border: none;
      border-radius: 8px 0 0 8px;
      transition: all 0.3s ease;
      font-size: 1rem;
    }

    .lets-talk .btn-call {
      background-color: #fff;
      color: #000;
      font-weight: 600;
      padding: 14px 50px;
      border: none;
      border-radius: 0 8px 8px 0;
      transition: all 0.3s ease;
      font-size: 1rem;
    }

    .lets-talk .btn-whatsapp:hover,
    .lets-talk .btn-call:hover {
      background-color: #000;
      color: #fff;
    }

    .lets-talk .or-divider {
      background-color: #000;
      border: 3px solid #ffb800;
      color: #fff;
      font-weight: 700;
      border-radius: 50%;
      width: 50px;
      height: 50px;
      display: flex;
      justify-content: center;
      align-items: center;
      margin: 0 -25px;
      z-index: 2;
      font-size: 1rem;
    }

    /* SOCIAL ICONS */
    .lets-talk .social-icons {
      margin-top: 45px;
    }

    .lets-talk .social-icons a { 
      font-size: 1.4rem;
      margin: 0 10px;
     color: #fff; 
      transition: all 0.3s ease;
    }

    .lets-talk .social-icons a:hover {
      color: #ffb800;
    }

/*******faq section***********/
.faq-container {
    padding: 15px 0 0;
}
.faq-container .accordion-item {
    padding: 20px 0;
    margin: 0;
    border-radius: 0 !important;
    overflow: hidden;
    border: 0;
    border-bottom: 1px solid #d6e1f1;
}
.faq-container .accordion-header {
    margin-bottom: 0;
}

.faq-container .accordion-item .accordion-button {
    padding: 0;
    font-size: 22px;
    font-weight: 500;
}
.faq-container .accordion-item .accordion-button span {
    color: #FF6600;
    font-weight: 500;
    font-size: 24px;
    line-height: 36px;
    text-align: center;
    margin-right: 29px;
}
.faq-container .accordion-body {
    padding: 20px 0 0 52px;
    text-align: left;
}
.faq-container .accordion-body {
    padding: 20px 0 0;
    margin: 20px 0 0;
    border-top: 2px solid #FF6600;
}
.faq-container .accordion-body p {
    margin: 0 0 16px;
    line-height: 24px;
        font-size: 17px;
        color: #000;

}
.faq-container .accordion-body p b {
    display: block;
    color: #545454;
    font-weight: 600;
}
.faq-container .accordion-button:not(.collapsed) {
    color: var(--bs-accordion-active-color);
    background-color: transparent;
    box-shadow: none;
}
 .accordion-button:focus { 
    box-shadow: none !important; 
}

/*******Why Choose Us************/
.how-we-work-wrapper.why-choose-wrapper {
    background: #F3F8FF url("../images/why-choose-bg.png") 50% 100% no-repeat;
    background-size: 100%;
        padding: 56px 0;
} 
.ForDesktop {
    display: block;
}
.how-we-work-wrapper.why-choose-wrapper .how-we-work-box {
    min-height: 248px;
    padding: 40px;
}
.how-we-work-box {
    background: #fff;
    padding: 30px;
    border-radius: 10px;
    border-bottom: 4px solid #000;
    margin: 30px 0 0;
    min-height: 350px;
}

.how-we-work-box h4 {
    font-weight: 500;
    font-size: 22px;
}
.how-we-work-box p {
    margin: 0;
    letter-spacing: 0;
    color: #707070;
}
/********Blog Section********/
.blog-section {
    text-align: left;
}
.blog-section .section-title {
    color: #ff6600;
    font-weight: 700;
    font-size: 22px;
    line-height: 28px;
    letter-spacing: 5.66px;
    vertical-align: middle;
    text-transform: uppercase;
}
.blog-section .blog-card {
    border-radius: 8px;
    overflow: hidden;
    background: #F3F6F8;
    transition: all 0.3s ease;
    height: 100%;
}
.blog-section .blog-meta {
    font-size: 14px;
    color: #888;
}
.blog-section .blog-meta span {
    font-weight: 400;
    font-size: 16px;
    line-height: 16px;
    vertical-align: middle;
}

.blog-section .blog-meta .calendra {
    margin-left: 13px;
}
.blog-section .blog-title {
    margin-top: 10px;
    font-weight: 600;
    font-size: 24px;
    line-height: 32px;
    vertical-align: middle;
    color: #090B0E;
}
.blog-section .blog-desc {
    color: #3D4C5E;
    font-family: Figtree;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    vertical-align: middle;
}
.blog-section .learn-more {
    font-family: Figtree;
    font-weight: 700;
    font-size: 16px;
    line-height: 16px;
    vertical-align: middle;
    color: #090B0E;
}
.blog-section .blog-img {
    width: 100%;
    border-radius: 8px;
    object-fit: cover;
    min-height: 300px;
}



























@media only screen and (min-width:992px) and (max-width:1199px) {

  /* Laptop screen */
  h1 {
    font-size:30px
  }
  h2 {
    font-size:28px
  }
  h3 {
    font-size:26px
  }
  h4 {
    font-size:20px
  }

  /* header css */
  .navbar-brand img {
    height: 50px;
  }
/******* About Section*****/
  .about-section {
        text-align: center;
      }
      .about-images {
        margin-bottom: 30px;
      }
      .about-images .bottom-images {
        flex-direction: column;
      }
      .about-images .bottom-images img {
        height: auto;
      }
      .about-section .rating-box {
        flex-direction: column;
      }
  /******Ai Section***/
        .ai-content {
        position: static;
        transform: none;
        background: rgba(60, 10, 100, 0.95);
        margin-top: -20px;
        border-radius: 0 0 15px 15px;
        text-align: center;
        max-width: 100%;
      }
      /******Cta Section******/
         .cta-section .cta-image img.main {
        margin-top: -60px;
      }



}
@media only screen and (min-width:768px) and (max-width:991px) {
  h1 {
    font-size:30px
  }
  h2 {
    font-size:28px
  }
  h3 {
    font-size:26px
  }
  h4 {
    font-size:20px
  }
  /*********award section********/
  .stats {
        flex-direction: row;
        justify-content: center;
        flex-wrap: wrap;
        gap: 25px;
      }

      .stat-item {
        width: 45%;
        padding: 30px 15px;
      }
      /******cta section***/
       .cta-section .cta-section {
        flex-direction: column;
        text-align: center;
        padding: 40px 20px;
      }
      .cta-section .cta-content {
        margin-bottom: 30px;
      }
}
@media only screen and (max-width:767px) {
  h1,h2 {
    font-size:24px
  }
  h3,h5 {
    font-size:20px
  }
  h4 {
    font-size:18px
  }

  /* Header */
  .navbar-brand img {
      height: 36px;
  }
  .header-main {
      position: relative;
      width: 100%;
      z-index: 9;
      top: 0;
      background: #fff;
      border-bottom: 1px solid #D6E3E9;
  }



  .call-btn.mobile-view, .header_sticky .enquire_now_btn {
      display: flex;
      align-items: center;
      justify-content: center;
  }

  /***********************clients css******************/
  .our-clients-flex{
    display: block;
  }
  .our-clients ul {
      grid-template-columns: 1fr 1fr 1fr;
  }
  /***********************clients css end******************/
  .mobile-accordion{
    display: block;
  }
  /*********Award Section*******/
     .awards-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 25px 15px;
      }
      .award-item img {
        width: 60px;
      }
      /*******Bottom Footer*******/
       .partner-logos img {
        margin: 10px;
        max-height: 35px;
      }
}

    @media (max-width: 575px) {
      .ai-content {
        padding: 30px 20px;
      }
      /*****award section********/
        .stat-item {
        width: 100%;
      }
      /***lets takl********/
      .lets-talk .contact-buttons {
        flex-direction: column;
        gap: 15px;
      }

      .lets-talk .btn-whatsapp,
      .lets-talk .btn-call {
        border-radius: 8px !important;
        width: 100%;
      }

      .lets-talk .or-divider {
        margin: 0;
        position: static;
      }
    }