@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');

:root{
    --pink:#E6127A;
    --pink-deep:#B60F63;
    --blue:#1466C9;
    --blue-light:#3C9DFF;
    --navy:#081B33;
    --navy-deep:#050F1F;
    --ink:#0E1B2B;
    --muted:#5C6B7C;
    --bg-soft:#F4F7FB;
    --line:#E7ECF3;
    --grad: linear-gradient(120deg, var(--pink) 0%, var(--blue) 100%);
  }

  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    font-family:'Poppins', sans-serif;
    color:var(--ink);
    background:#fff;
    overflow-x:hidden;
  }
  html, body{
  max-width:100%;
  overflow-x:hidden;
}
a{ text-decoration: none;}
  h1,h2,h3,h4,.display-font{
    font-family:'Poppins', sans-serif;
  }
  .text-grad{
    background:var(--grad);
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
  }
  .sec_head{
    font-family: 'Montserrat', sans-serif;
        font-weight: 800 !important;
  }
  .btn-grad{
    background:var(--grad);
    border:none;
    color:#fff;
    font-weight:600;
    padding:.85rem 1.9rem;
    border-radius:50px;
    position:relative;
    overflow:hidden;
    transition:transform .25s ease, box-shadow .25s ease;
    box-shadow:0 8px 20px rgba(230,18,122,.25);
  }
  .btn-grad:hover{
    transform:translateY(-3px);
    box-shadow:0 14px 28px rgba(20,102,201,.32);
    color:#fff;
  }
  .btn-outline-light-custom{
    border:1.5px solid rgba(255,255,255,.35);
    color:#fff;
    padding:.85rem 1.9rem;
    border-radius:50px;
    font-weight:600;
    background:transparent;
    transition:.25s ease;
  }
  .btn-outline-light-custom:hover{
    background:rgba(255,255,255,.12);
    border-color:#fff;
    color:#fff;
  }
  .eyebrow{
    display:inline-flex;
    align-items:center;
    gap:.5rem;
    font-size:.78rem;
    font-weight:700;
    letter-spacing:.14em;
    text-transform:uppercase;
    padding:.4rem 1rem;
    border-radius:50px;
  }

  /* ============ HEADER (TOP BAR + NAVBAR) ============ */
  #siteHeader{
    position:fixed; top:0; left:0; right:0; z-index:1000;
  }

 /* ============ REFINED HEADER CSS (AS PER REF IMAGE) ============ */

/* Topbar Background & Text Color */
.topbar {
  background: #f8f9fa !important;
  color: #495057 !important;
  font-size: 0.82rem;
  font-weight: 500;
  border-bottom: 1px solid #e9ecef;
  padding: 9px 0;
}

.topbar-info span {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  color: #555;
  margin-right: 1.5rem;
}

.topbar-info i {
  color: #6c757d;
}

.topbar-auth-link {
  color: #495057 !important;
  text-decoration: none;
  font-weight: 500;
  margin-left: 1.2rem;
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
}

.topbar-auth-link:hover {
  color: #e6127a !important;
}

/* Navbar Style Clean Clean Modern Look */
.navbar-custom {
  background: #ffffff !important;
  padding: 0px 0 !important;
  border-bottom: 1px solid #f0f0f0;
       box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
}

#siteHeader::after {
  display: none;
}

/* Nav Link Underline Design (Active Pink Line) */
.nav-pill-wrap {
  gap: 1.2rem;
}

.navbar-custom .nav-link {
  color: #212529 !important;
  font-weight: 600;
  font-size: 15px;
  padding: 0.5rem 0.2rem !important;
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  position: relative;
}

.navbar-custom .nav-link i {
  font-size: 1.05rem;
  color: #495057;
}

.navbar-custom .nav-link.active,
.navbar-custom .nav-link:hover {
  color: #e6127a !important;
}

.navbar-custom .nav-link.active i,
.navbar-custom .nav-link:hover i {
  color: #e6127a !important;
}

/* Nav Link Underline Design (Active & Hover Pink Line) */
.navbar-custom .nav-link::after {
    content: '';
    position: absolute;
    bottom: 2px;
    left: 50%;
    width: 0;
    height: 3px;
    background-color: #e6127a;
    border-radius: 10px;
    transform: translateX(-50%);
    transition: width 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.navbar-custom .nav-link:hover::after,
.navbar-custom .nav-link.active::after {
    width: 70%;
}

.navbar-custom .nav-link::before {
  display: none;
}

/* Right Social Circular Icons */
.social-icon-btn {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  font-size: 1.1rem;
}

.social-icon-btn.instagram {
  background-color: #fde8f0;
  color: #e1306c;
}

.social-icon-btn.linkedin {
  background-color: #e8f0fe;
  color: #0a66c2;
}

.social-icon-btn:hover {
  transform: translateY(-2px);
}

/* Apply Now Solid Blue Button */
.nav-cta-btn {
  background-color: #1a6dff !important;
  color: #ffffff !important;
  padding: 0.55rem 1.4rem;
  border-radius: 8px;
  font-weight: 600;
  font-size: 0.9rem;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  margin-left: 0.5rem;
  transition: background-color 0.25s ease;
}

.nav-cta-btn:hover {
  background-color: #0052e0 !important;
  color: #ffffff !important;
}

  .navbar-custom .container{
    display:flex; align-items:center; justify-content:space-between;
       padding: 10px 0px;
    position:relative;
  }
  @media(max-width:992px){
     .navbar-custom .container{
       padding: 10px 10px;
     }
  }

  /* ============ TOPBAR FLEXBOX FIX ============ */
.topbar .row-inner {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: 100%;
      padding: 0!important;
}

.topbar-info {
  display: flex !important;
  align-items: center !important;
  gap: 1.5rem;
}

.topbar-social {
  display: flex !important;
  align-items: center !important;
  gap: 1.2rem;
  margin-left: auto !important;
}

.topbar-auth-link {
  color: #495057 !important;
  text-decoration: none;
  font-weight: 500;
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  margin-left: 0 !important;
}
  /* floating logo badge - the signature element */
  .logo-badge{
      display: flex;
    align-items: center;
    padding: 0 0rem;
    transition: .3s ease;
  }
  .logo-badge:hover{ box-shadow:0 14px 30px rgba(230,18,122,.14); transform:translateY(-2px); }
  .navbar-custom img.logo{
    height:47px;
    transition:.3s ease;
  }
  #siteHeader.scrolled .navbar-custom img.logo{ height:43px; }
  #siteHeader.scrolled .logo-badge{ padding:.4rem .85rem; }

  /* center pill nav */
  .nav-pill-wrap{
    display:flex; align-items:center; gap:.2rem;
    border-radius:50px;
    padding:.35rem;
  }
  .navbar-custom .nav-link{
    color:var(--ink);
    font-weight:600;
    font-size:16px;
       padding: .55rem 0.6rem !important;
    position:relative;
    transition:color .25s ease;
  }
  .navbar-custom .nav-link::before{
    content:'';
    position:absolute; inset:0;
    border-radius:50px;
    background:var(--grad);
    opacity:0;
    transition:opacity .25s ease;
    z-index:-1;
  }
  .navbar-custom .nav-link:hover{ color:var(--pink); }
  .navbar-custom .nav-link:hover::before{ opacity:1; }
  .navbar-custom .nav-link.active{ color:var(--pink); }
  .navbar-custom .nav-link.active::before{ opacity:1; }

  /* right cluster: phone + CTA */
  .nav-right{ display:flex; align-items:center; gap:1.1rem; }
  .nav-phone{
    display:flex; align-items:center; gap:.7rem;
    text-decoration:none;
    padding-right:1.1rem;
    border-right:1px solid var(--line);
  }
  .nav-phone .ic-circle{
    width:38px; height:38px; border-radius:50%;
    background:linear-gradient(135deg, rgba(230,18,122,.1), rgba(20,102,201,.1));
    color:var(--pink-deep);
    display:flex; align-items:center; justify-content:center;
    font-size:1rem; flex:0 0 38px;
  }
  .nav-phone small{ display:block; color:var(--muted); font-size:.7rem; font-weight:600; text-transform:uppercase; letter-spacing:.04em; }
  .nav-phone strong{ display:block; color:var(--ink); font-size:.88rem; font-weight:700; }

  .nav-cta{
    background:var(--grad);
    color:#fff !important;
    border-radius:50px;
    padding:.75rem 1.6rem !important;
    font-weight:700;
    font-size:.9rem;
    box-shadow:0 8px 20px rgba(230,18,122,.28);
    display:inline-flex; align-items:center; gap:.5rem;
    transition:transform .25s ease, box-shadow .25s ease;
    white-space:nowrap;
    text-decoration: none;
  }
  .nav-cta:hover{ color:#fff !important; transform:translateY(-2px); box-shadow:0 14px 28px rgba(20,102,201,.32); }
/* ============ TOPBAR LOCATION DROPDOWN ============ */
.topbar-location-dropdown .location-btn {
  color: #495057 !important;
  text-decoration: none;
  font-weight: 500;
  font-size: 0.82rem;
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  cursor: pointer;
  transition: color 0.2s ease;
}

.topbar-location-dropdown .location-btn:hover {
  color: #e6127a !important;
}

.topbar-dropdown-menu {
  font-size: 0.82rem;
  border-radius: 8px;
  border: 1px solid #e9ecef;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08);
  padding: 0.4rem 0;
  min-width: 180px;
}

.topbar-dropdown-menu .dropdown-item {
  padding: 0.4rem 1rem;
  color: #495057;
  font-weight: 500;
}

.topbar-dropdown-menu .dropdown-item:hover {
  background-color: #f8f9fa;
  color: #e6127a;
}

.topbar-dropdown-menu .dropdown-item.active {
  background-color: #fde8f0;
  color: #e6127a;
  font-weight: 600;
}
.nav-item{
  list-style-type: none;
}
/* ============ COURSES DROPDOWN ON HOVER ============ */
@media (min-width: 992px) {
  .navbar-custom .nav-item.dropdown:hover .dropdown-menu {
    display: block !important;
    margin-top: 0;
    opacity: 1;
    visibility: visible;
    animation: fadeInDropdown 0.25s ease-in-out;
  }

  .navbar-custom .nav-item.dropdown .dropdown-menu {
    margin-top: 0;
    transition: all 0.2s ease-in-out;
  }
}

@keyframes fadeInDropdown {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.custom-dropdown-menu {
  border: 1px solid #e9ecef !important;
  border-radius: 8px !important;
  padding: 0.4rem 0 !important;
  overflow: hidden;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08) !important;
  min-width: 180px !important;
  background-color: #ffffff;
}

.custom-dropdown-menu .dropdown-item {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.4rem 1rem !important;
  font-size: 0.82rem !important;
  font-weight: 500;
  color: #495057;
  transition: all 0.2s ease;
  background-color: transparent;
}

.custom-dropdown-menu .dropdown-item i,
.custom-dropdown-menu .dropdown-item .icon {
  font-size: 0.95rem;
  color: #6c757d;
  transition: color 0.2s ease;
}

.custom-dropdown-menu .dropdown-item:hover {
  background-color: #f8f9fa;
  color: #e6127a !important;
}

.custom-dropdown-menu .dropdown-item:hover i,
.custom-dropdown-menu .dropdown-item:hover .icon {
  color: #e6127a !important;
}

.custom-dropdown-menu .dropdown-item.active {
  background-color: #fde8f0 !important;
  color: #e6127a !important;
  font-weight: 600;
}

.custom-dropdown-menu .dropdown-item.active i,
.custom-dropdown-menu .dropdown-item.active .icon {
  color: #e6127a !important;
}

.navbar-custom .nav-item.dropdown .nav-link::after {
  display: none !important;
}
  /* ============ MOBILE TOGGLER ============ */
  .hamburger-btn{
    width:46px; height:46px;
    border-radius:12px;
    border:1.5px solid var(--line);
    background:#fff;
    display:flex; align-items:center; justify-content:center;
    gap:5px; flex-direction:column;
    transition:.25s ease;
  }
  .hamburger-btn:hover{ border-color:var(--pink); }
  .hamburger-btn span{
    display:block; width:20px; height:2px; border-radius:2px;
    background:var(--ink); transition:.3s ease;
  }

  /* ============ MOBILE SIDEBAR (OFFCANVAS) ============ */
  /* ============ MOBILE SIDEBAR (OFFCANVAS) — WHITE THEME ============ */
.side-nav{
  width:300px!important;
  background:#ffffff;
  color:var(--ink);
  border:none;
  box-shadow:-8px 0 30px rgba(20,40,80,.12);
  transition:transform .35s cubic-bezier(.4,0,.2,1) !important;
}
.side-nav .offcanvas-header{
  padding:1.4rem 1.4rem 0;
  border-bottom:1px solid var(--line);
  padding-bottom:1rem;
      justify-content: space-between;
}
.side-nav .side-logo{
  height:30px;
  filter:none; /* white bg par original logo colors dikhenge */
}
.side-nav .btn-close-custom{
     width: 30px;
    height: 30px;
    border-radius: 7px;
    border: 1px solid var(--line);
    background: var(--bg-soft);
    color: var(--ink);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.8rem;
    transition: .25s ease;
    margin-top: -30px;
    margin-left: 41px;
}
.side-nav .btn-close-custom:hover{
  background:var(--grad); border-color:transparent; color:#fff; transform:rotate(90deg);
}
.side-nav .offcanvas-body{
  padding:1.6rem 1.4rem 1.8rem;
  display:flex; flex-direction:column;
}
.side-nav .side-eyebrow{
  font-size:.7rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  color:var(--muted); margin-bottom:1.1rem;
}
.side-nav .side-link{
  display:flex; align-items:center; gap:.85rem;
  color:var(--ink); text-decoration:none;
  font-weight:600; font-size:1.02rem;
  padding:.6rem .8rem;
  border-radius:12px;
  margin-bottom:.3rem;
  opacity:0; transform:translateX(-16px);
  transition:opacity .4s ease, transform .4s ease, background-color .25s ease, color .25s ease;
}
.side-nav.show .side-link{
  opacity:1; transform:translateX(0);
}
.side-nav .side-link i{
  width:38px; height:38px; flex:0 0 38px;
  border-radius:10px;
  background:var(--bg-soft);
  display:flex; align-items:center; justify-content:center;
  font-size:1.05rem; color:var(--pink-deep);
  transition:.25s ease;
}
.side-nav .side-link:hover, .side-nav .side-link.active{
  background:var(--bg-soft);
  color:var(--pink-deep);
}
.side-nav .side-link:hover i, .side-nav .side-link.active i{
  background:var(--grad); color:#fff;
}
.side-nav .side-link.active{
  box-shadow:inset 3px 0 0 var(--pink);
}
.side-nav .side-link:nth-child(2){ transition-delay:.05s; }
.side-nav .side-link:nth-child(3){ transition-delay:.1s; }
.side-nav .side-link:nth-child(4){ transition-delay:.15s; }
.side-nav .side-link:nth-child(5){ transition-delay:.2s; }
.side-nav .side-link:nth-child(6){ transition-delay:.25s; }
.side-nav .side-link:nth-child(7){ transition-delay:.3s; }
.side-nav .side-cta{
  margin-top:auto;
  padding-top:1.4rem;
  border-top:1px solid var(--line);
}
.side-nav .side-cta .btn-grad{
  width:100%; text-align:center; display:block;
}
.side-nav .side-social{
  display:flex; gap:.6rem; margin-top:1.1rem;
}
.side-nav .side-social a{
  width:36px; height:36px; border-radius:50%;
  background:var(--bg-soft);
  border:1px solid var(--line);
  display:flex; align-items:center; justify-content:center;
  color:var(--ink); transition:.25s ease;
}
.side-nav .side-social a:hover{ background:var(--grad); border-color:transparent; color:#fff; transform:translateY(-2px); }
.offcanvas-backdrop.show{ opacity:.4; }

  /* ============ HERO ============ */
  .hero{
    background:
      linear-gradient(135deg, rgba(230,18,122,.20) 0%, rgba(20,102,201,.20) 100%),
      linear-gradient(160deg, var(--navy) 0%, var(--navy-deep) 100%);
    padding:10.5rem 0 6rem;
    position:relative;
    overflow:hidden;
    color:#fff;
  }
  .hero::before{
    content:'';
    position:absolute;
    inset:0;
    background-image:
      linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
      linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
    background-size:44px 44px;
    mask-image:linear-gradient(180deg, rgba(0,0,0,.7), transparent 75%);
  }
  .hero .eyebrow{
    background:rgba(255,255,255,.08);
    color:#9FD0FF;
    border:1px solid rgba(255,255,255,.14);
  }
  .hero h1{
    font-size:3rem;
    font-weight:800;
    line-height:1.14;
    letter-spacing:-.01em;
  }
  .hero p.lead{
    color:#B6C4D8;
    font-size:1.08rem;
    max-width:540px;
  }
  @media (min-width:992px){ .hero h1{font-size:3.4rem;} }

  /* animated code panel */
  .code-card{
    background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02));
    border:1px solid rgba(255,255,255,.12);
    border-radius:20px;
    padding:1.4rem;
    backdrop-filter:blur(6px);
    box-shadow:0 30px 60px rgba(0,0,0,.35);
    animation:float 5s ease-in-out infinite;
  }
  @keyframes float{
    0%,100%{transform:translateY(0px);}
    50%{transform:translateY(-14px);}
  }
  .code-card .dot{width:10px;height:10px;border-radius:50%;display:inline-block;margin-right:6px;}
  .code-line{
    height:9px;border-radius:5px;background:rgba(255,255,255,.12);margin:10px 0;
  }
  .code-line.grad{background:var(--grad); opacity:.85;}
  .metric-chip{
    position:absolute;
    background:#fff;
    color:var(--ink);
    border-radius:16px;
    padding:.85rem 1.1rem;
    box-shadow:0 20px 40px rgba(0,0,0,.28);
    font-weight:700;
    animation:float 4.5s ease-in-out infinite;
  }
  .metric-chip small{display:block;font-weight:600;color:var(--muted);font-size:.72rem;}
  .metric-chip.one{ top:-18px; left:-24px; animation-delay:.4s;}
  .metric-chip.two{ bottom:-22px; right:-18px; animation-delay:1s;}

  .hero-stats{
    border-top:1px solid rgba(255,255,255,.12);
    margin-top:3.5rem;
    padding-top:2.2rem;
  }
  .hero-stats .num{
    font-family:'Poppins',sans-serif;
    font-weight:800;
    font-size:2.1rem;
    background:var(--grad);
    -webkit-background-clip:text;background-clip:text;color:transparent;
  }
  .hero-stats .lbl{color:#9FB0C6;font-size:.85rem;font-weight:500;}


  /* ============ HERO MOBILE RESPONSIVE FIX ============ */
@media (max-width: 991px){
  .hero-slider-section{
    padding:100px 0 40px;
    overflow-x:hidden;
  }
  .wave-bg-pattern,
  .glow-orb{
    display:none; /* overflow/scroll cause karne wale decorative elements hide */
  }
  .hero-heading{
    font-size:2rem;
  }
  .hero-desc{
    font-size:1rem;
  }
  /* Laptop mockup + floating cards wala pura visual section hide */
  .hero-visual-wrap{
    display:none !important;
  }
  .hero-content{
    text-align:left;
  }
}


@media (max-width: 575px){
  .hero-heading{
    font-size:2rem!important;
    line-height:1.3;
  }
  .hero-desc{
    font-size:.95rem;
  }
  .hero-btns .btn-pink-custom,
  .hero-btns .btn-white-custom{
    padding:11px 22px;
    font-size:.9rem;
  }
  .section-title{
     font-size: 1.3rem!important;
  }
}
  /* ============ SECTION HEADERS ============ */
  .section-pad{padding:2rem 0;}
  .eyebrow-light{
    background:rgba(230,18,122,.08);
    color:var(--pink-deep);
    border:1px solid rgba(230,18,122,.18);
  }
  .section-title{
       font-weight: 800;
    font-size: 1.6rem;
    letter-spacing: -.01em;
    text-transform: uppercase;
    font-family: 'Montserrat', sans-serif;
  }
  .section-sub{color:var(--muted); font-size:1.02rem; max-width:600px;}

  /* ============ SERVICES ============ */
  .bg-soft{background:var(--bg-soft);}
  .service-card{
    background:#fff;
    border:1px solid var(--line);
    border-radius:18px;
    padding:2rem 1.7rem;
    height:100%;
    transition:.3s ease;
    position:relative;
    overflow:hidden;
  }
  .service-card::before{
    content:'';
    position:absolute; inset:0;
    background:var(--grad);
    opacity:0;
    transition:.3s ease;
    z-index:0;
  }
  .service-card:hover{
    transform:translateY(-8px);
    box-shadow:0 24px 44px rgba(20,40,80,.12);
    border-color:transparent;
    cursor: pointer;
  }
  .service-card:hover::before{ opacity:1; }
  .service-card > *{ position:relative; z-index:1; }
  .service-card .icon-wrap{
    width:56px;height:56px;
    border-radius:14px;
    display:flex;align-items:center;justify-content:center;
    background:linear-gradient(135deg, rgba(230,18,122,.12), rgba(20,102,201,.12));
    color:var(--pink-deep);
    font-size:1.5rem;
    margin-bottom:1.2rem;
    transition:.3s ease;
  }
  .service-card:hover .icon-wrap{
    background:rgba(255,255,255,.18);
    color:#fff;
  }
  .service-card h5{ font-weight:700; margin-bottom:.6rem; transition:.3s ease;font-size: 14px;font-family: 'Montserrat', sans-serif;}
  .service-card:hover h5, .service-card:hover p{ color:#fff; }
  .service-card p{color:var(--muted); font-size:.92rem; margin-bottom:0;}

  /* ============ INDUSTRIES ============ */
  .industry-pill{
    background:#fff;
    border:1px solid var(--line);
    border-radius:16px;
    padding:1.6rem 1rem;
    text-align:center;
    transition:.3s ease;
    height:100%;
  }
  .industry-pill:hover{
    border-color:transparent;
    box-shadow:0 18px 34px rgba(20,40,80,.1);
    transform:translateY(-6px);
  }
  .industry-pill .ic{
    width:52px;height:52px;margin:0 auto 1rem;
    border-radius:50%;
    display:flex;align-items:center;justify-content:center;
    background:linear-gradient(135deg, var(--pink), var(--blue));
    color:#fff;font-size:1.35rem;
  }
  .industry-pill span{font-weight:700; font-size:.92rem;}

  /* ============ PROJECTS ============ */
  .project-card{
    border-radius:18px;
    overflow:hidden;
    position:relative;
    height:280px;
    box-shadow:0 14px 34px rgba(20,40,80,.1);
  }
  .project-card .cover{
    position:absolute; inset:0;
    background-size:cover; background-position:center;
    transition:transform .5s ease;
  }
  .project-card:hover .cover{ transform:scale(1.08); }
  .project-card .overlay{
    position:absolute; inset:0;
    background:linear-gradient(180deg, transparent 30%, rgba(5,15,31,.92) 100%);
    display:flex; align-items:flex-end;
    padding:1.4rem;
  }
  .project-card .tag{
    position:absolute; top:1rem; left:1rem;
    background:rgba(255,255,255,.92);
    color:var(--pink-deep);
    font-size:.72rem; font-weight:700;
    padding:.3rem .8rem; border-radius:50px;
  }
  .project-card h6{color:#fff; font-weight:700; margin-bottom:.15rem;}
  .project-card a{color:#9FD0FF; font-size:.82rem; font-weight:600; text-decoration:none;}

  /* ============ CTA BANNER ============ */
  .cta-banner{
    background:linear-gradient(120deg, var(--pink-deep), var(--blue));
    border-radius:26px;
    padding:3.5rem 3rem;
    position:relative;
    overflow:hidden;
    color:#fff;
  }
  .cta-banner::after{
    content:'';
    position:absolute; right:-60px; top:-60px;
    width:260px;height:260px;
    border-radius:50%;
    background:rgba(255,255,255,.08);
  }
  .cta-banner::before{
    content:'';
    position:absolute; left:10%; bottom:-90px;
    width:200px;height:200px;
    border-radius:50%;
    background:rgba(255,255,255,.07);
  }
  .btn-white-cta{
    background:#fff;
    color:var(--pink-deep);
    font-weight:700;
    padding:.85rem 2rem;
    border-radius:50px;
    border:none;
    transition:.25s ease;
  }
  .btn-white-cta:hover{ transform:translateY(-3px); box-shadow:0 14px 28px rgba(0,0,0,.2); color:var(--pink-deep); }

  /* ============ TESTIMONIALS ============ */
  .testi-card{
    background:#fff;
    border:1px solid var(--line);
    border-radius:18px;
    padding:2rem;
    height:100%;
  }
  .testi-card .stars{color:#FFB020; font-size:.9rem; margin-bottom:.9rem;}
  .testi-card p{color:var(--ink); font-size:.95rem;}
  .testi-card .who{
    display:flex; align-items:center; gap:.8rem; margin-top:1.2rem;
  }
  .avatar-init{
    width:44px;height:44px;border-radius:50%;
    background:var(--grad);
    color:#fff; font-weight:700;
    display:flex;align-items:center;justify-content:center;
  }
  .who h6{margin:0; font-weight:700; font-size:.9rem;}
  .who small{color:var(--muted);}

  /* ============ FOOTER ============ */
  footer{
    position:relative;
    background:
      linear-gradient(135deg, rgba(230,18,122,.18) 0%, rgba(20,102,201,.18) 100%),
      linear-gradient(165deg, #0A1F3B 0%, #050F1F 60%, #04070F 100%);
    color:#B6C4D8;
    padding-top:6rem;
    overflow:hidden;
    isolation:isolate;
  }
  footer::before{
    content:'';
    position:absolute; inset:0;
    z-index:0;
    opacity:.5;
    background-image:
      radial-gradient(rgba(255,255,255,.06) 1px, transparent 1px);
    background-size:26px 26px;
    mask-image:radial-gradient(ellipse 90% 70% at 50% 30%, #000 40%, transparent 90%);
  }
  .footer-wave{
    position:absolute;
    top:-1px; left:0; right:0;
    line-height:0;
    z-index:1;
  }
  .footer-wave svg{ width:100%; height:70px; display:block; }

  .footer-watermark{
    position:absolute;
    right:-2%; bottom:-6%;
    font-family:'Poppins',sans-serif;
    font-weight:800;
    font-size:clamp(4rem, 14vw, 11rem);
    letter-spacing:-.03em;
    color:transparent;
    -webkit-text-stroke:1px rgba(255,255,255,.06);
    z-index:0;
    pointer-events:none;
    user-select:none;
    white-space:nowrap;
  }

  footer .footer-inner{ position:relative; z-index:2; }

  .footer-cta-row{
    border:1px solid rgba(255,255,255,.1);
    background:rgba(255,255,255,.04);
    backdrop-filter:blur(8px);
    border-radius:20px;
    padding:2rem 2.2rem;
    margin-bottom:4rem;
  }
  .footer-cta-row h4{
    color:#fff; font-weight:800; font-family:'Poppins',sans-serif; margin-bottom:.3rem;
  }
  .footer-cta-row p{ margin:0; color:#9FB0C6; font-size:.92rem; }

  footer h6{
    color:#fff; font-weight:700; margin-bottom:1.2rem;
    letter-spacing:.02em; font-size:.95rem;
    position:relative; padding-bottom:.7rem;
  }
  footer h6::after{
    content:'';
    position:absolute; left:0; bottom:0;
    width:28px; height:3px; border-radius:3px;
    background:var(--grad);
  }
  footer a{color:#9FB0C6; text-decoration:none; font-size:.92rem; line-height:2.1; transition:.2s ease; display:inline-block;}
  footer a:hover{color:#fff; transform:translateX(3px);}
  footer .logo-footer{height:34px; margin-bottom:1rem;}
  footer .contact-item{
    display:flex; gap:.7rem; align-items:flex-start; margin-bottom:.9rem; font-size:.92rem;
  }
  footer .contact-item i{
    width:34px; height:34px; flex:0 0 34px;
    border-radius:9px;
    background:rgba(255,255,255,.07);
    display:flex; align-items:center; justify-content:center;
    color:var(--blue-light); font-size:.95rem;
  }
  .footer-bottom{
    position:relative; z-index:2;
    border-top:1px solid rgba(255,255,255,.08);
    margin-top:3rem;
    padding:1.4rem 0;
    font-size:.85rem;
  }
  .social-ic{
    width:38px;height:38px;border-radius:50%;
    background:rgba(255,255,255,.07);
    border:1px solid rgba(255,255,255,.1);
    display:flex;align-items:center;justify-content:center;
    color:#fff; transition:.25s ease;
  }
  .social-ic:hover{ background:var(--grad); border-color:transparent; transform:translateY(-3px); }

  /* ============ REVEAL ANIMATION ============ */
  .reveal{
    opacity:0;
    transform:translateY(28px);
    transition:opacity .7s ease, transform .7s ease;
  }
  .reveal.in{
    opacity:1;
    transform:translateY(0);
  }
  .reveal.d1{transition-delay:.08s;}
  .reveal.d2{transition-delay:.16s;}
  .reveal.d3{transition-delay:.24s;}
  .reveal.d4{transition-delay:.32s;}

  @media (prefers-reduced-motion: reduce){
    .reveal, .code-card, .metric-chip{ transition:none !important; animation:none !important; opacity:1 !important; transform:none !important;}
  }

  a:focus-visible, button:focus-visible{
    outline:3px solid var(--blue-light);
    outline-offset:2px;
  }

  @media (max-width:991px){
    .hero{padding:9.5rem 0 3.5rem;}
    .code-card{margin-top:3rem;}
  }


  /* ********************* new design******************** */
    /* ============ HERO SLIDER STYLES ============ */
.hero-slider-section {
  background: #f3faff;
  padding: 110px 0 44px;
  position: relative;
  overflow: hidden;
}

.wave-bg-pattern {
  position: absolute;
  top: 0;
  right: -5%;
  width: 55%;
  height: 100%;
  background: radial-gradient(ellipse at center, rgba(233, 30, 99, 0.06) 0%, rgba(26, 115, 232, 0.04) 50%, rgba(255, 255, 255, 0) 75%);
  pointer-events: none;
  z-index: 1;
}

.glow-orb {
  position: absolute;
  border-radius: 50%;
  filter: blur(80px);
  pointer-events: none;
  z-index: 1;
}
.orb-pink {
  width: 350px;
  height: 350px;
  background: rgba(233, 30, 99, 0.12);
  top: 10%;
  right: 15%;
}
.orb-blue {
  width: 300px;
  height: 300px;
  background: rgba(26, 115, 232, 0.1);
  bottom: 5%;
  right: 5%;
}

.hero-content {
  position: relative;
  z-index: 5;
}

.sub-title {
  font-size: 0.85rem;
  font-weight: 600;
  color: #6c757d;
  letter-spacing: 1px;
  margin-bottom: 16px;
  display: inline-block;
  text-transform: uppercase;
}

.hero-heading {
  font-size: 3rem;
      font-weight: 700;
  color: #1e293b;
  line-height: 1.25;
  margin-bottom: 22px;
  font-family: 'Montserrat', sans-serif;
}

.hero-heading .text-pink {
  color: #e91e63;
}

.hero-heading .text-blue {
  color: #1a73e8;
}

.hero-desc {
  font-size: 1.1rem;
  color: #0f1113;
  line-height: 1.6;
  margin-bottom: 32px;
}

.btn-pink-custom {
  background: linear-gradient(135deg, #e91e63, #d81b60);
  color: #fff;
  padding: 13px 30px;
  border-radius: 30px;
  font-weight: 600;
  text-decoration: none;
  box-shadow: 0 8px 20px rgba(233, 30, 99, 0.3);
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.btn-pink-custom:hover {
  color: #fff;
  transform: translateY(-3px);
  box-shadow: 0 12px 25px rgba(233, 30, 99, 0.45);
}

.btn-white-custom {
  background: #ffffff;
  color: #1e293b;
  border: 1px solid #e2e8f0;
  padding: 13px 30px;
  border-radius: 30px;
  font-weight: 600;
  text-decoration: none;
  box-shadow: 0 4px 10px rgba(0,0,0,0.03);
  transition: all 0.3s ease;
}

.btn-white-custom:hover {
  background: #f8fafc;
  color: #0f172a;
  transform: translateY(-3px);
  border-color: #cbd5e1;
}

.rating-text {
  font-size: 0.92rem;
  color: #475569;
}

.rating-badge {
  background: #f1f5f9;
  padding: 8px 16px;
  border-radius: 20px;
  font-size: 0.9rem;
  color: #334155;
  display: inline-block;
  border: 1px solid #e2e8f0;
}

.hero-visual-wrap {
  position: relative;
  z-index: 5;
  perspective: 1000px;
}

.laptop-3d-scene {
  position: relative;
  width: 100%;
  max-width: 480px;
  margin: 0 auto;
  transform: rotateY(-12deg) rotateX(8deg);
  transform-style: preserve-3d;
}

.laptop-mockup-img {
  display: block;
  width: 100%;
  height: auto;
  filter: drop-shadow(0 25px 40px rgba(15, 23, 42, 0.28));
  user-select: none;
  -webkit-user-drag: none;
}

.float-card {
  position: absolute;
  background: #ffffff;
  padding: 10px 18px;
  border-radius: 12px;
  font-size: 0.85rem;
  font-weight: 600;
  color: #1e293b;
  box-shadow: 0 10px 25px rgba(0,0,0,0.1);
  z-index: 10;
  animation: floatCard 4s ease-in-out infinite alternate;
}

.card-left { top: 40%; left: -30px; }
.card-right { top: 45px; right: -30px; animation-delay: 2s; }

@keyframes floatCard {
  0% { transform: translateY(0); }
  100% { transform: translateY(-10px); }
}

.visual-decor-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  display: flex;
  align-items: center;
  justify-content: center;
}

.decor-ring {
  position: absolute;
  border-radius: 50%;
  border: 1px dashed rgba(233, 30, 99, 0.18);
  animation: ringSpin 32s linear infinite;
}
.decor-ring.ring-1 { width: 420px; height: 420px; }
.decor-ring.ring-2 {
  width: 580px;
  height: 580px;
  border-color: rgba(26, 115, 232, 0.15);
  animation-duration: 48s;
  animation-direction: reverse;
}
@keyframes ringSpin {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}

.decor-particles { position: absolute; inset: 0; }
.decor-particles span {
  position: absolute;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: linear-gradient(135deg, #e91e63, #1a73e8);
  opacity: 0.55;
  animation: particleFloat 6s ease-in-out infinite;
}
.decor-particles span:nth-child(1) { top: 8%;  left: 10%; animation-delay: 0s; }
.decor-particles span:nth-child(2) { top: 18%; left: 84%; animation-delay: .8s; }
.decor-particles span:nth-child(3) { top: 72%; left: 6%;  animation-delay: 1.6s; }
.decor-particles span:nth-child(4) { top: 86%; left: 76%; animation-delay: 2.4s; }
.decor-particles span:nth-child(5) { top: 45%; left: 96%; animation-delay: 3.2s; }
.decor-particles span:nth-child(6) { top: 4%;  left: 55%; animation-delay: 4s; }
.decor-particles span:nth-child(7) { top: 94%; left: 44%; animation-delay: 4.8s; }
.decor-particles span:nth-child(8) { top: 55%; left: 1%;  animation-delay: 5.4s; }

@keyframes particleFloat {
  0%, 100% { transform: translateY(0) scale(1);       opacity: .35; }
  50%      { transform: translateY(-18px) scale(1.4); opacity: .9; }
}

.decor-dot-line {
  position: absolute;
  width: 2px;
  background: repeating-linear-gradient(to bottom, rgba(26, 115, 232, 0.35) 0 6px, transparent 6px 12px);
  animation: dotLineMove 3s linear infinite;
}
.decor-dot-line.l1 { height: 120px; top: 4%;    left: 16%; }
.decor-dot-line.l2 { height: 160px; bottom: 6%; right: 12%; animation-direction: reverse; }
@keyframes dotLineMove {
  from { background-position-y: 0; }
  to   { background-position-y: 24px; }
}

.laptop-float-wrap {
  position: relative;
  z-index: 2;
  animation: laptopFloat 5s ease-in-out infinite;
}
@keyframes laptopFloat {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(-14px); }
}

.laptop-float-wrap::before {
  content: '';
  position: absolute;
  inset: 8% 6%;
  background:
    radial-gradient(circle at 30% 30%, rgba(233, 30, 99, 0.28), transparent 60%),
    radial-gradient(circle at 75% 70%, rgba(26, 115, 232, 0.24), transparent 60%);
  filter: blur(40px);
  z-index: -1;
  animation: glowPulse 6s ease-in-out infinite;
}
@keyframes glowPulse {
  0%, 100% { opacity: .6; transform: scale(1); }
  50%      { opacity: 1;  transform: scale(1.08); }
}

.hero-visual-wrap.theme-erp .laptop-float-wrap::before {
  background:
    radial-gradient(circle at 30% 30%, rgba(255, 189, 46, 0.32), transparent 60%),
    radial-gradient(circle at 75% 70%, rgba(233, 30, 99, 0.20), transparent 60%);
}
.hero-visual-wrap.theme-app .laptop-float-wrap::before {
  background:
    radial-gradient(circle at 30% 30%, rgba(39, 201, 63, 0.28), transparent 60%),
    radial-gradient(circle at 75% 70%, rgba(26, 115, 232, 0.22), transparent 60%);
}

.mini-chart-badge {
  position: absolute;
  bottom: 12%;
  right: -8%;
  width: 150px;
  background: #ffffff;
  border-radius: 14px;
  padding: 10px 12px 8px;
  box-shadow: 0 14px 32px rgba(0, 0, 0, 0.15);
  z-index: 10;
  animation: floatCard 4.5s ease-in-out infinite alternate;
  animation-delay: 1s;
}
.mini-chart-badge svg { width: 100%; height: 40px; display: block; }
.mini-chart-badge .chart-line {
  fill: none;
  stroke: #e91e63;
  stroke-width: 2.4;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-dasharray: 220;
  stroke-dashoffset: 220;
  animation: drawLine 2.6s ease forwards infinite alternate;
}
.mini-chart-badge .chart-line-erp { stroke: #ffbd2e; }
.mini-chart-badge .chart-line-app { stroke: #27c93f; }
@keyframes drawLine {
  to { stroke-dashoffset: 0; }
}
.mini-chart-badge .chart-label {
  font-size: 0.72rem;
  font-weight: 600;
  color: #1e293b;
  margin-top: 4px;
  display: flex;
  align-items: center;
  gap: 6px;
}

@media (prefers-reduced-motion: reduce) {
  .decor-ring, .decor-particles span, .decor-dot-line,
  .laptop-float-wrap, .laptop-float-wrap::before,
  .float-card, .mini-chart-badge, .mini-chart-badge .chart-line {
    animation: none !important;
  }
}

@media (max-width: 991px) {
  .decor-ring, .decor-particles, .decor-dot-line, .mini-chart-badge {
    display: none;
  }
}

/* =============================================================
   SLICK CAROUSEL HERO INDICATORS OVERRIDE
   Matches Bootstrap Hero Carousel indicators design (.custom-indicators)
   ============================================================= */

/* 1. Slick Dots Container Layout */
/* Slick dots base styles */
.slick-dots {
    display: flex !important;
    justify-content: center;
    align-items: center;
    gap: 10px;
    margin-top: 30px;
    padding: 0;
    list-style: none;
}

.slick-dots li {
    margin: 0 !important;
    width: auto !important;
    height: auto !important;
}

/* Inactive dots (बाकीचे न दिसणारे dots) */
/* Inactive dots (active नसलेल्या dots ची height/width लहान केली आहे) */
.slick-dots li button {
    width: 8px !important;   /* नवीन लहान width (आधी 14px होती) */
    height: 8px !important;  /* नवीन लहान height (आधी 14px होती) */
    padding: 0;
    border: none;
    border-radius: 50%;
    background: #cbd5e1 !important;
    opacity: 0.7;
    font-size: 0;
    cursor: pointer;
    transition: all 0.3s ease;
}

.slick-dots li button:hover {
    background: #94a3b8 !important;
    opacity: 1;
    transform: scale(1.2); /* माऊस नेल्यावर हलका झूम इफेक्ट */
}

/* Active dot (सध्याचा मोठा pill dot) */
.slick-dots li.slick-active button {
    width: 32px !important;  /* Active dot ची योग्य width */
    height: 8px !important;  /* Inactive dots प्रमाणेच मोजकी height */
    background: linear-gradient(135deg, #e91e63 0%, #9c27b0 50%, #2196f3 100%) !important;
    border-radius: 9999px;
    opacity: 1;
    box-shadow: 0 4px 14px rgba(233, 30, 99, 0.45);
}

/* Hide default text/numbers inside slick buttons */
.slick-dots li button:before {
    display: none !important;
}


.custom-indicators {
  bottom: -40px;
}
.custom-indicators button {
  width: 10px !important;
  height: 10px !important;
  border-radius: 50% !important;
  background-color: #cbd5e1 !important;
  border: none !important;
  margin: 0 5px !important;
  transition: all 0.3s ease;
}
.custom-indicators button.active {
  background-color: #e91e63 !important;
  transform: scale(1.3);
}

.carousel-item .anim-item {
  opacity: 0;
  transform: translateY(35px);
  transition: all 0.7s cubic-bezier(0.25, 1, 0.5, 1);
}

.carousel-item .anim-laptop {
  opacity: 0;
  transform: rotateY(-12deg) rotateX(8deg) scale(0.9) translateY(40px);
  transition: all 0.8s cubic-bezier(0.25, 1, 0.5, 1);
}

.carousel-item.active .anim-item {
  opacity: 1;
  transform: translateY(0);
}

.carousel-item.active .anim-laptop {
  opacity: 1;
  transform: rotateY(-12deg) rotateX(8deg) scale(1) translateY(0);
}

.carousel-item.active .d-1 { transition-delay: 0.15s; }
.carousel-item.active .d-2 { transition-delay: 0.3s; }
.carousel-item.active .d-3 { transition-delay: 0.45s; }
.carousel-item.active .d-4 { transition-delay: 0.6s; }
.carousel-item.active .d-5 { transition-delay: 0.75s; }
.carousel-item.active .anim-laptop { transition-delay: 0.3s; }
.carousel-inner {
      padding-top: 20px;
}


/* ********************** hero section end***************** */

/* ******************* trust by 100 % business start *************/
.trusted-section .logo-item {
  padding: 0px;
  display: flex !important;
  align-items: center;
  justify-content: center;
}
.trusted-section .logo-item img {
  max-height: 65px;
  max-width: 130px;
  filter: grayscale(20%);
  transition: filter 0.3s ease;
}
.trusted-section .logo-item img:hover {
  filter: grayscale(0%);
}

.why-list li {
  font-size: 1.05rem;
  margin-bottom: 0.8rem;
  color: var(--ink);
}
.text-pink {
  color: var(--pink) !important;
}
.text-blue {
  color: var(--blue) !important;
}

.industry-pill {
  background: #f8fafc;
  border: 1px solid var(--line);
  border-radius: 12px;
  transition: all 0.3s ease;
}
.industry-pill .ic {
  width: 44px;
  height: 44px;
  margin: 0 auto;
  border-radius: 10px;
  background: rgba(20, 102, 201, 0.08);
  color: var(--blue);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.25rem;
}
.industry-pill:hover {
  background: #fff;
  border-color: var(--pink);
  transform: translateY(-4px);
  box-shadow: 0 10px 20px rgba(0,0,0,0.06);
}
.industry-pill:hover .ic {
  background: var(--grad);
  color: #fff;
}

/* ******************* trust by 100 % business end *************/

/* ==================================================================
   NEW SECTIONS — Featured Products / Latest Projects / Dev Process /
   Case Studies / Testimonials / Locations (matches reference layout)
   ================================================================== */

.btn-outline-pill{
  border:1.5px solid var(--line);
  color:var(--ink);
  font-weight:600;
  font-size:.85rem;
  padding:.55rem 1.3rem;
  border-radius:50px;
  text-decoration:none;
  background:#fff;
  transition:.25s ease;
  white-space:nowrap;
}
.btn-outline-pill:hover{
  border-color:var(--blue);
  color:var(--blue);
  transform:translateY(-2px);
}

/* ---- Featured Products ---- */
/* .product-mini-card{
  background:#fff;
  border:1px solid var(--line);
  border-radius:14px;
  padding:1.1rem;
  display:flex;
  align-items:flex-start;
  gap:.8rem;
  height:100%;
  transition:.25s ease;
}
.product-mini-card:hover{
  border-color:transparent;
  box-shadow:0 14px 30px rgba(20,40,80,.08);
  transform:translateY(-4px);
}
.pm-icon{
  width:44px; height:44px; flex:0 0 44px;
  border-radius:10px;
  display:flex; align-items:center; justify-content:center;
  font-size:1.2rem;
  color:#fff;
}
.pm-blue{ background:linear-gradient(135deg,#1a73e8,#1466C9); }
.pm-pink{ background:linear-gradient(135deg,#ff5c9d,#e6127a); }
.pm-orange{ background:linear-gradient(135deg,#ffb020,#ff8a00); }
.pm-purple{ background:linear-gradient(135deg,#8e6cf1,#5b3fd6); }
.product-mini-card h6{ font-weight:700; font-size:.92rem; margin-bottom:.25rem; }
.product-mini-card p{ font-size:.8rem; color:var(--muted); margin:0; } */

/* ---- Latest Projects ---- */
/* ---- Latest Projects Updated CSS ---- */
.proj-mini-card { 
  text-align: center; 
}

.proj-thumb {
  height: 160px;
  border-radius: 14px;
  overflow: hidden; /* इमेज बॉक्सच्या बाहेर जाऊ नये म्हणून */
  display: flex; 
  align-items: center; 
  justify-content: center;
  margin-bottom: 0.9rem;
  box-shadow: 0 8px 20px rgba(20, 40, 80, 0.08);
  border: 1px solid var(--line);
  background: #f8fafc;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.proj-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover; /* इमेज प्रमाणबद्ध रितीने बॉक्समध्ये सेट होईल */
  display: block;
  transition: transform 0.4s ease;
}

/* Hover Effect: माऊस नेल्यावर इमेज हलकी झूम होईल */
.proj-mini-card:hover .proj-thumb img {
  transform: scale(1.06);
}

.proj-mini-card:hover .proj-thumb {
  box-shadow: 0 12px 28px rgba(20, 40, 80, 0.15);
}

.proj-mini-card h6 { 
  font-weight: 700; 
  font-size: 0.95rem; 
  color: var(--ink); 
  margin: 0;
  text-align: center; 
  font-family: 'Montserrat', sans-serif;
}

/* ---- Dev Process (tech icons) ---- */
.tech-pill{
  background:#fff;
  border:1px solid var(--line);
  border-radius:14px;
  padding:1rem .5rem;
  text-align:center;
  transition:.25s ease;
}
.tech-pill:hover{
  border-color:transparent;
  box-shadow:0 14px 28px rgba(20,40,80,.1);
  transform:translateY(-4px);
}
.tech-pill img{
  width:34px; height:34px; object-fit:contain; margin-bottom:.5rem;
}
.tech-pill span{
  display:block; font-size:.74rem; font-weight:600; color:var(--ink);
}

/* ---- Case Study card ---- */
/* ---- Updated Case Study Circle Design ---- */
.case-study-card {
  background: var(--bg-soft);
  border-radius: 18px;
  padding: 1.6rem;
  display: flex;
  flex-direction: column;
  gap: 1.2rem;
  height: 100%;
  box-sizing: border-box;
}
.case-study-text h5{
  font-family: 'Montserrat', sans-serif;
      font-size: 1.4rem;
      font-weight: 700;
}
.case-study-text a{
  
      color: var(--bs-code-color);
    font-weight: 700;
}
.case-study-text p{
     color: #736e6e;
         font-size: 1rem;
}

.case-study-img {
  width: 100%;            /* Circle ची width */
  height: 170px;           /* Circle ची height */
  border-radius: 15px !important;
  overflow: hidden;
  margin: 0 auto;          /* सेंटरला आणण्यासाठी */
  /* border: 4px solid #ffffff; */
  /* box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1); */
  /* flex-shrink: 0; */
}

.case-study-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;       /* इमेज क्रॉप न होता फिट होण्यासाठी */
  display: block;
}
.slick-prev:before, .slick-next:before {
    font-family: 'slick';
    font-size: 20px;
    line-height: 1;
    opacity: .75;
    color: #df0a7b!important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
/* Slick Slider स्पेसिंग फिक्स */
.case-study-slider .slick-slide {
  padding: 0 12px;
}
.case-study-slider {
  margin: 0 -12px;
}
/* Slider मधील Card layout व्यवस्थित दिसण्यासाठी */
.case-study-slider .case-study-card {
  display: flex !important;
  flex-direction: column;
  gap: 1.2rem;
  box-sizing: border-box;
}
/* Slick Custom Arrows Style */
.case-study-slider {
  position: relative;
}

.case-study-slider .slick-prev,
.case-study-slider .slick-next {
  position: absolute;
  top: -45px;
  z-index: 10;
  background: #fff;
  border: 1px solid var(--line);
  width: 35px;
  height: 35px;
  border-radius: 50%;
  color: var(--pink);
  display: flex !important;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.case-study-slider .slick-prev {
  right: 45px;
  left: auto;
}

.case-study-slider .slick-next {
  right: 0;
}

.case-study-slider .slick-prev:hover,
.case-study-slider .slick-next:hover {
  background: var(--pink);
  color: #fff;
}
/* ---- Testimonials mini ---- */
.testi-mini-card{
  background:#fff;
  border:1px solid var(--line);
  border-radius:16px;
  padding:1.5rem 1.3rem;
  height:100%;
}
.testi-mini-card .quote-ic{
  font-size:1.6rem;
  color:var(--pink);
  margin-bottom:.6rem;
  display:block;
}
.testi-mini-card p{
  font-size:.88rem;
  color:var(--ink);
  min-height:70px;
}
.testi-mini-card .who{
  display:flex; align-items:center; gap:.7rem; margin-top:1rem;
}
.testi-mini-card .who h6{ margin:0; font-weight:700; font-size:.85rem; }
.testi-mini-card .who small{ color:var(--muted); font-size:.74rem; }
/* Slick Slider Spacing Fix for Testimonials */
.testimonial-slider .slick-slide {
  padding: 0 10px;
}
.testimonial-slider {
  margin: 0 -10px;
}
/* =============================================================
   TESTIMONIAL SLICK DOTS FIX & HERO MATCHING STYLING
   ============================================================= */

/* 1. Ensure Dots Container is Positioned and Centered */
.testimonial-slider .slick-dots {
    position: relative;
    bottom: 0;
    display: flex !important;
    align-items: center;
    justify-content: center;
    gap: 0.6rem;
    margin-top: 1.2rem;
    padding: 0;
    list-style: none;
}

/* 2. Reset Default Slick Li Elements */
.testimonial-slider .slick-dots li {
    margin: 0;
    padding: 0;
    width: auto;
    height: auto;
}

/* 3. Inactive Dots Color & Styling (Visible Dark-Slate Gray) */
.testimonial-slider .slick-dots li button {
    font-size: 0;
    line-height: 0;
    display: block;
    width: 14px;
    height: 14px;
    padding: 0;
    cursor: pointer;
    background: #cbd5e1 !important; /* Visible light-slate dot background */
    border: 0;
    border-radius: 9999px;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    opacity: 1 !important;
}

/* Hide Default Slick Pseudoelement Dots */
.testimonial-slider .slick-dots li button:before {
    display: none !important;
}

/* 4. Inactive Dot Hover State */
.testimonial-slider .slick-dots li button:hover {
    background: #94a3b8 !important;
    transform: scale(1.15);
}

/* 5. Active Dot State (Matching Hero Gradient Pill) */
.testimonial-slider .slick-dots li.slick-active button {
    width: 38px;
    height: 14px;
    background: linear-gradient(135deg, #e91e63 0%, #9c27b0 50%, #2196f3 100%) !important;
    border-radius: 9999px;
    box-shadow: 0 4px 14px rgba(233, 30, 99, 0.45);
    transform: scale(1);
}
.testi-mini-card {
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
/* ---- Locations ---- */
.locations-card{
  background:var(--bg-soft);
  border-radius:18px;
  padding:1.6rem;
  height:100%;
}
.loc-list li{
  display:flex; align-items:flex-start; gap:.9rem;
  padding:.9rem 0;
  border-bottom:1px dashed var(--line);
}
.loc-list li:last-child{ border-bottom:none; }
.loc-pin{
  width:40px; height:40px; flex:0 0 40px;
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  color:#fff; font-size:1.05rem;
}
.loc-pink{ background:linear-gradient(135deg,#ff5c9d,#e6127a); }
.loc-blue{ background:linear-gradient(135deg,#1a73e8,#1466C9); }
.loc-list h6{ margin:0; font-weight:700; font-size:.92rem; }
.loc-list small{ color:var(--muted); }

/* ============ LOCATIONS (MAP + LIST) ============ */
.loc-section-wrap{
  display:flex;
  align-items:center;
  gap:1.5rem;
}

/* Map */
.india-map-wrap{
  position:relative;
  flex:0 0 42%;
  max-width:220px;
}

.india-map-svg{
  width:100%;
  height:auto;
  display:block;
  filter: brightness(0) saturate(100%) invert(79%) sepia(10%) saturate(500%) hue-rotate(180deg);
  opacity:1;
}
.map-pin{
  position:absolute;
  transform:translate(-50%,-100%);
  color:var(--pink);
  font-size:1.1rem;
  display:flex;
  align-items:center;
  justify-content:center;
}
.map-pin.pin-blue{ color:var(--blue); }
.map-pin i{
  position:relative;
  z-index:2;
  filter:drop-shadow(0 3px 4px rgba(0,0,0,.25));
}
.pin-ping{
  position:absolute;
  bottom:1px;
  left:50%;
  transform:translateX(-50%);
  width:10px; height:10px;
  border-radius:50%;
  background:var(--pink);
  opacity:.35;
  animation:pinPulse 1.8s ease-out infinite;
}
.map-pin.pin-blue .pin-ping{ background:var(--blue); }
@keyframes pinPulse{
  0%{ transform:translateX(-50%) scale(.6); opacity:.5; }
  100%{ transform:translateX(-50%) scale(2.6); opacity:0; }
}

/* List */
.loc-plain-list{
  flex:1;
  display:flex;
  flex-direction:column;
  gap:1.6rem;
}
.loc-plain-list li{
  display:flex;
  align-items:center;
  gap:.9rem;
}
.loc-dot{
  width:38px; height:38px; flex:0 0 38px;
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  color:#fff; font-size:1rem;
}
.loc-dot-pink{ background:linear-gradient(135deg,#ff5c9d,#e6127a); }
.loc-dot-blue{ background:linear-gradient(135deg,#1a73e8,#1466C9); }
.loc-plain-list h6{ margin:0; font-weight:700; font-size:.95rem; color:var(--ink); }
.loc-plain-list small{ color:var(--muted); font-size:.85rem; }

@media(max-width:767px){
  .loc-section-wrap{ flex-direction:column; align-items:flex-start; }
  .india-map-wrap{ max-width:180px; margin:0 auto 1rem; }
}


/* ******************* asked question********* */
/* ============ FAQ SECTION ============ */
.faq-accordion{
  display:flex;
  flex-direction:column;
  gap:.9rem;
}
.faq-item{
  border:1px solid var(--line);
  border-radius:14px;
  overflow:hidden;
  background:#fff;
  transition:border-color .25s ease, box-shadow .25s ease;
}
.faq-item.active{
  border-color:transparent;
  box-shadow:0 14px 30px rgba(20,40,80,.08);
}
.faq-question{
  width:100%;
  background:none;
  border:none;
  text-align:left;
  padding:0.6rem 1.3rem;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  font-weight:600;
  font-size:.98rem;
  color:var(--ink);
  cursor:pointer;
}
.faq-icon{
  flex:0 0 30px;
  height:30px;
  width:30px;
  border-radius:50%;
  background:rgba(20,102,201,.08);
  color:var(--blue);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:1rem;
  transition:transform .3s ease, background .3s ease, color .3s ease;
}
.faq-item.active .faq-icon{
  background:var(--grad);
  color:#fff;
  transform:rotate(135deg);
}
.faq-answer{
  max-height:0;
  overflow:hidden;
  transition:max-height .35s ease, padding .35s ease;
  padding:0 1.3rem;
}
.faq-item.active .faq-answer{
  max-height:200px;
  padding:0 1.3rem 1.2rem;
}
.faq-answer p{
  margin:0;
  color:var(--muted);
  font-size:.9rem;
  line-height:1.6;
}

/* ============ FAQ CTA BANNER ============ */
.faq-cta-banner{
  background:var(--grad);
  border-radius:22px;
 padding: 1.6rem 2.2rem;
  color:#fff;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:1.8rem;
  text-align:center;
  position:relative;
  overflow:hidden;
      width: 100%;
}
.faq-cta-banner::before{
  content:'';
  position:absolute; right:-60px; top:-60px;
  width:220px; height:220px; border-radius:50%;
  background:rgba(255,255,255,.08);
}
.faq-cta-banner::after{
  content:'';
  position:absolute; left:-40px; bottom:-70px;
  width:180px; height:180px; border-radius:50%;
  background:rgba(255,255,255,.07);
}
.faq-cta-banner h3{
  font-weight:800;
  font-size:1.6rem;
  margin-bottom:.5rem;
  position:relative; z-index:1;
}
.faq-cta-banner p{
  color:rgba(255,255,255,.9);
  margin:0;
  position:relative; z-index:1;
}
.faq-cta-btns{
  display:flex;
  flex-wrap:wrap;
  gap:1rem;
  justify-content:center;
  position:relative; z-index:1;
}
.faq-cta-phone{
  background:#fff;
  color:var(--blue-deep, #1466C9);
  font-weight:700;
  padding:.85rem 1.6rem;
  border-radius:50px;
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  gap:.6rem;
  transition:.25s ease;
}
.faq-cta-phone:hover{
  transform:translateY(-3px);
  box-shadow:0 10px 22px rgba(0,0,0,.15);
  color:var(--blue);
}
.faq-cta-quote{
  border:1.5px solid rgba(255,255,255,.6);
  color:#fff;
  font-weight:700;
  padding:.85rem 1.6rem;
  border-radius:50px;
  text-decoration:none;
  transition:.25s ease;
}
.faq-cta-quote:hover{
  background:rgba(255,255,255,.15);
  border-color:#fff;
  color:#fff;
  transform:translateY(-3px);
}

@media(max-width:991px){
  .faq-cta-banner{ margin-top:1rem; }
}