@font-face { font-family: Inter; src: url('../font/Inter-Bold.eot'); src: url('../font/Inter-Bold.eot?#iefix') format('embedded-opentype'),url('../font/Inter-Bold.woff2') format('woff2'),url('../font/Inter-Bold.woff') format('woff'),url('../font/Inter-Bold.ttf') format('truetype'),url('../font/Inter-Bold.svg#Inter-Bold') format('svg'); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: Inter; src: url('../font/Inter-ExtraBold.eot'); src: url('../font/Inter-ExtraBold.eot?#iefix') format('embedded-opentype'),url('../font/Inter-ExtraBold.woff2') format('woff2'),url('../font/Inter-ExtraBold.woff') format('woff'),url('../font/Inter-ExtraBold.ttf') format('truetype'),url('../font/Inter-ExtraBold.svg#Inter-ExtraBold') format('svg'); font-weight: 800; font-style: normal; font-display: swap; }
@font-face { font-family: Inter; src: url('../font/Inter-Regular.eot'); src: url('../font/Inter-Regular.eot?#iefix') format('embedded-opentype'),url('../font/Inter-Regular.woff2') format('woff2'),url('../font/Inter-Regular.woff') format('woff'),url('../font/Inter-Regular.ttf') format('truetype'),url('../font/Inter-Regular.svg#Inter-Regular') format('svg'); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: Inter; src: url('../font/Inter-Medium.eot'); src: url('../font/Inter-Medium.eot?#iefix') format('embedded-opentype'),url('../font/Inter-Medium.woff2') format('woff2'),url('../font/Inter-Medium.woff') format('woff'),url('../font/Inter-Medium.ttf') format('truetype'),url('../font/Inter-Medium.svg#Inter-Medium') format('svg'); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: Inter; src: url('../font/Inter-SemiBold.eot'); src: url('../font/Inter-SemiBold.eot?#iefix') format('embedded-opentype'),url('../font/Inter-SemiBold.woff2') format('woff2'),url('../font/Inter-SemiBold.woff') format('woff'),url('../font/Inter-SemiBold.ttf') format('truetype'),url('../font/Inter-SemiBold.svg#Inter-SemiBold') format('svg'); font-weight: 600; font-style: normal; font-display: swap; }

img { max-width: 100%; }
.container { margin: 0 auto; max-width: 1280px; width: 90%; }
@media only screen and (min-width: 993px) { .container { width: 86%; }}
.servicesbanner { position: relative;  background-position: center; background-repeat: no-repeat; background-attachment: fixed; height: calc(100vh - 20px); min-height: 500px; display: flex; align-items: center; justify-content: center; overflow: hidden; }
.mobilenewapp-custombanner{background: url('../images/mobileappservices-banner-bg.webp'); background-size: cover;}

/* .hrms-banner-custom{background: url('../images/hrms-banner-bg.svg'); background-size: cover;}
.sass-banner-custom{background: url('../images/sass-banner-bg.svg'); background-size: cover;}
.erp-banner-custom{background: url('../images/erp-banner-bg.svg'); background-size: cover;}
.crm-banner-custom{background: url('../images/crm-banner-bg.svg'); background-size: cover;} */
.servicesbanner .container { position: relative; z-index: 2; width: 100%; max-width: 1200px; padding: 0 20px; }
.servicesbanner .banner_headsection { text-align: center; max-width: 100%; margin: 0 auto; padding: 40px 20px; }
.servicesbanner .banner_headsection h1 { font-size: 50px; font-weight: 700; color: #ffffff; line-height: 1.3; margin: 0 0 24px 0; letter-spacing: 0.2px; text-shadow: 0 2px 10px rgba(0,0,0,0.2); }
.servicesbanner .banner_headsection p { font-size: 20px; color: rgba(255,255,255,0.85); line-height: 1.7; margin: 0 0 40px 0; font-weight: 500; max-width: 750px; margin-left: auto; margin-right: auto; }
.servicesbanner .cta-button { display: inline-block; padding: 11px 20px; background: #ffffff; color: #1A508E; font-size: 1rem; font-weight: 600; text-decoration: none; border-radius: 8px; transition: all 0.3s ease; box-shadow: 0 4px 15px rgba(0,0,0,0.2); border: 2px solid #ffffff; }
.servicesbanner .cta-button:hover { background: transparent; color: #ffffff; transform: translateY(-2px); box-shadow: 0 6px 20px rgba(0,0,0,0.3); }
.banner_btnsection{display:flex;gap:15px;justify-content:center;flex-wrap:wrap;}
.servicesbanner .cta-button2 { display: inline-block; padding: 11px 20px;background: transparent; color: #ffffff; color: #fff; font-size: 1rem; font-weight: 600; text-decoration: none; border-radius: 8px; transition: all 0.3s ease; box-shadow: 0 4px 15px rgba(0,0,0,0.2); border: 2px solid #ffffff; min-width:140px }
.servicesbanner .cta-button2:hover{  background: #ffffff;color: #1A508E;   transform: translateY(-2px); box-shadow: 0 6px 20px rgba(0,0,0,0.3); }

.servicesbanner .cta-button:active { transform: translateY(0); }
.servicesbanner::after { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-image: radial-gradient(circle at 2px 2px, rgba(255,255,255,0.05) 1px, transparent 0); background-size: 40px 40px; z-index: 1; pointer-events: none; }
/* ========================================
   WE OFFER SECTION
   ======================================== */
.we-offer-section { padding: 3.5rem 0 0; background: #ffffff; overflow: hidden; }
.we-offer-section .section-label { display: inline-flex; align-items: center; gap: 0.5rem; font-size: 0.95rem; font-weight: 500; color: #0F172A; }
.we-offer-section .section-label::before { content: ''; width: 10px; height: 10px; background: #f59e0b; border-radius: 50%; display: inline-block; }
.we-offer-section .section-heading { font-size: 30px; font-weight: 500; color: #0F172A; line-height: 1.4; margin-bottom: 2.5rem; max-width: 1200px; letter-spacing: 0.2px; margin-top: 20px; }
.we-offer-section .content-grid { display: grid; grid-template-columns: 1fr; gap: 3rem; }
.we-offer-section .stats-wrapper { display: flex; gap: 10px; margin-bottom: 2rem; }
.we-offer-section .stat-item { display: flex; align-items: flex-start; gap: 10px; padding: 15px 15px 15px 25px; border-left: 4px solid #1A508E; min-width: 250px; flex-direction: column; flex: 1; }
.we-offer-section .stat-number { font-size: 44px; font-weight: 500; color: #1E293B; line-height: 1; }
.we-offer-section .stat-label { font-size: 16px; font-weight: 500; color: #1E293B; }
.we-offer-section .company-description { font-size: 16px; line-height: 1.8; color: #1E293B; max-width: 600px; font-weight: 500; margin-bottom: 1.5rem; letter-spacing: 0.2px; }
.we-offer-section .cta-button,
.why-partner-section .cta-button { display: inline-flex; align-items: center; justify-content: center; padding: 8px 20px; font-size: 1rem; font-weight: 600; color: #ffffff; text-decoration: none; background: #1A508E; border: none; border-radius: 8px; letter-spacing: 0.2px; transition: background-color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease; cursor: pointer; box-shadow: 0 4px 12px rgba(30, 64, 175, 0.2); }
.we-offer-section .cta-button:hover { background: #1A508E; box-shadow: 0 6px 20px rgba(30, 64, 175, 0.3); transform: translateY(-2px); }
.we-offer-section .cta-button:active { transform: translateY(0); }
.we-offer-section .logos-wrapper { margin-top: 25px; overflow: hidden; position: relative; }
.we-offer-section .logos-wrapper::before { left: 0; background: linear-gradient(to right, #ffffff 0%, transparent 100%); }
.we-offer-section .logos-wrapper::after { right: 0; background: linear-gradient(to left, #ffffff 0%, transparent 100%); }
.we-offer-section .logos-track { display: flex; gap: 3rem; align-items: center; width: max-content; animation: scrollLogos 30s linear infinite; will-change: transform; }
.we-offer-section .logos-track:hover { animation-play-state: paused; }
.we-offer-section .client-logo { flex-shrink: 0; height: 60px; width: auto; transition: filter 0.3s ease, opacity 0.3s ease, transform 0.3s ease; object-fit: contain; }
.we-offer-section .cta-button:focus-visible { outline: 3px solid #f59e0b; outline-offset: 2px; }
.we-offer-section .client-logo:focus { outline: 2px solid #1e40af; outline-offset: 2px; }
@keyframes scrollLogos {
    0% { transform: translateX(0); }

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


@media (prefers-reduced-motion: reduce) {
    .we-offer-section .logos-track { animation: none; overflow-x: auto; -webkit-overflow-scrolling: touch; }
    .we-offer-section .cta-button,
    .we-offer-section .client-logo { transition: none; }
    .we-offer-section .cta-button:hover { transform: none; }
}

@media (prefers-contrast: high) {
    .we-offer-section .stat-item { border-left-width: 5px; }
    .we-offer-section .cta-button { border: 2px solid #ffffff; }
    .we-offer-section .client-logo { opacity: 0.8; }
}

/* ========================================
   WHY PARTNER WITH US SECTION
   ======================================== */
.why-partner-section { padding: 0 0 3rem 0; background: #ffffff; }
.why-partner-section .section-header { text-align: center; margin-bottom: 3rem; }
.why-partner-section .section-title { font-size: 42px; font-weight: 600; color: #0F172A; margin-bottom: 1rem; margin-top: 0; line-height: 1.3; letter-spacing: 0.2px; }
.why-partner-section .section-subtitle { font-size: 16px; color: #334155; max-width: 900px; margin: 0 auto; font-weight: 500; line-height: 1.8; letter-spacing: 0.2px; }
.why-partner-section .stats-bar { background: #0F172A; border-radius: 12px; padding: 10px; margin-bottom: 1.5rem; display: grid; grid-template-columns: repeat(4, 1fr); gap: 2rem; }
.why-partner-section .stat-box { text-align: left; padding: 1.5rem; position: relative; }
.why-partner-section .stat-box:after { border-right: 2px solid #475569; position: absolute; right: 0; top: 50%; content: ""; height: 90px; transform: translateY(-50%); }
.why-partner-section .stat-box:last-child:after { display: none; }
.why-partner-section .stat-icon { width: 40px; height: 40px; margin: 0 0 1.5rem; color: #F1F5F9; }
.why-partner-section .stat-value { font-size: 46px; font-weight: 600; color: #ffffff; line-height: 1; margin-bottom: 1rem; }
.why-partner-section .stat-desc { font-size: 18px; color: #E2E8F0; font-weight: 500; }
.why-partner-section .features-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; margin-bottom:1rem; }
.why-partner-section .feature-card { padding: 2rem; border-left: 1px solid #F1F5F9; border-bottom: 1px solid #F1F5F9; transition: box-shadow 0.3s ease, transform 0.3s ease; }
.why-partner-section .feature-card:first-child,
.why-partner-section .feature-card:nth-child(4) { border-left: 1px solid transparent; }
.why-partner-section .feature-card:nth-child(4),
.why-partner-section .feature-card:nth-child(5),
.why-partner-section .feature-card:nth-child(6) { border-bottom: 1px solid transparent; }
.feature-cardtop { display: flex; gap: 5px; margin-bottom: 1.5rem; align-items: center; }
.why-partner-section .feature-icon { width: 64px; height: 64px; }
.why-partner-section .feature-title { font-size: 20px; font-weight: 600; color: #0F172A; margin-bottom: 1rem; line-height: 1.4; margin: 0; letter-spacing: 0.2px; }
.why-partner-section .feature-text { font-size: 16px; color: #334155; line-height: 1.7; margin: 0; letter-spacing: 0.2px; font-weight: 500; }
.why-partner-section .cta-center { text-align: center; margin-top: 2rem; }
.why-partner-section .cta-button { display: inline-flex; }
.why-partner-section .cta-button:focus-visible { outline: 3px solid #f59e0b; outline-offset: 2px; }

/* ========================================
   CUTTING EDGE TECH SECTION
   ======================================== */
.cutting-edge-tech-section { padding: 3rem 0; background: #0F172A; position: relative; overflow: hidden; }
.cutting-edge-tech-section .tech-grid { display: grid; grid-template-columns: 1fr; gap: 2rem; align-items: start; }
.cutting-edge-tech-section .tech-left { max-width: 100%; }
.cutting-edge-tech-section .tech-title { font-size: 46px; font-weight: 600; color: #F1F5F9; line-height: 1.3; margin-bottom: 1.5rem; letter-spacing: 0.2px; }
.cutting-edge-tech-section .tech-subtitle { font-size: 1rem; color:#E2E8F0; line-height: 1.4; margin-bottom: 2rem; font-weight: 500; letter-spacing: 0.2px; }
.cutting-edge-tech-section .tech-button { display: inline-flex; align-items: center; justify-content: center; padding: 10px 25px; font-size: 1rem; font-weight: 600; color: #1A508E; text-decoration: none; background: #ffffff; border: none; border-radius: 8px; transition: all 0.3s ease; cursor: pointer; }
.cutting-edge-tech-section .tech-button:hover { background: transparent; color: #ffffff; border: 1px solid #ffffff; }
.cutting-edge-tech-section .tech-button:active { transform: translateY(0); }
.cutting-edge-tech-section .tech-right { display: flex; flex-direction: column; gap: 2rem; max-height: calc((230px * 2) + (1.5rem * 1)); overflow-y: auto; scroll-behavior: smooth; position: relative; scrollbar-width: none; -ms-overflow-style: none; }
.cutting-edge-tech-section .tech-right::-webkit-scrollbar { width: 0px; background: transparent; }
.cutting-edge-tech-section .tech-right::after { content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 60px; background: linear-gradient(to bottom, transparent, #0F172A); pointer-events: none; opacity: 0.6; }
.cutting-edge-tech-section .tech-right:last-child::after { display: none; }
.cutting-edge-tech-section .tech-card { background: rgba(255, 255, 255, 0.98); border-radius: 12px; padding: 1.5rem; transition: transform 0.3s ease, box-shadow 0.3s ease; position: relative; }
.cutting-edge-tech-section .tech-card::before { content: ''; position: absolute; top: 0; right: 0; width: 100%; height: 100%; border-radius: 12px; background: url(../images/tech-cardbg.png) no-repeat center; background-size: cover; pointer-events: none; }
.tech-cardinner { position: relative; }
.cutting-edge-tech-section .tech-card-inner { display: flex; align-items: center; gap: 1rem; margin-bottom: 1rem; }
.cutting-edge-tech-section .tech-card-icon { flex-shrink: 0; width: 56px; height: 56px; }
.cutting-edge-tech-section .tech-card-icon svg { width: 100%; height: 100%; }
.cutting-edge-tech-section .tech-card-title { font-size: 20px; font-weight: 600; color: #0F172A; margin: 0; letter-spacing: 0.2px; }
.cutting-edge-tech-section .tech-card-text { font-family: 'Inter', sans-serif; font-size: 1rem; color: #475569; line-height: 1.7; margin: 0; letter-spacing: 0.2px; }
.cutting-edge-tech-section .tech-button:focus-visible { outline: 3px solid #f59e0b; outline-offset: 2px; }
/* ========================================
   DEVELOPMENT PROCESS SECTION
   ======================================== */
.development-process-section { padding: 3rem 0; background: #ffffff; }
.development-process-section .process-header { text-align: center; margin-bottom: 4rem; }
.development-process-section .process-title { font-size: 42px; font-weight: 600; color: #0F172A; margin-bottom: 1rem; margin-top: 0; line-height: 1.3; letter-spacing: 0.2px; }
.development-process-section .process-subtitle { font-size: 16px; font-weight: 500; color: #334155; max-width: 900px; margin: 0 auto; line-height: 1.8; letter-spacing: 0.2px; }
.development-process-section .process-steps-container { position: relative; padding-top: 40px; margin-top: 20px; }
/* .development-process-section .process-steps { display: grid; grid-template-columns: repeat(5, 1fr); gap: 20px; position: relative; z-index: 2; } */
.development-process-section .process-steps.grid-5-cols {display: grid;grid-template-columns: repeat(5, 1fr);
    gap: 20px;position: relative;z-index: 2;}
.development-process-section .process-steps.grid-4-cols {display: grid;grid-template-columns: repeat(4, 1fr);
    gap: 20px;position: relative;z-index: 2;}
/* 3 columns */
.development-process-section .process-steps.grid-3-cols {display: grid;grid-template-columns: repeat(3, 1fr);
    gap: 20px;position: relative;z-index: 2;}
.development-process-section .process-step-card { background: #ffffff; border: 1px solid #e5e7eb; border-radius: 12px; padding: 40px 20px 30px; text-align: center; position: relative; transition: all 0.3s ease; }
.development-process-section .process-step-card:before { content: ''; position: absolute; top: -38px; right: 53%; border-top: 2px dashed #d1d5db; border-right: 2px dashed #d1d5db; border-left: 2px dashed #d1d5db; height: 52px; border-radius: 25px; z-index: 1; width: 105%; }
.development-process-section .process-step-card:last-child:after { content: ''; position: absolute; top: -38px; left: 53%; border-top: 2px dashed #d1d5db; border-left: 2px dashed #d1d5db; height: 52px; border-radius: 25px; z-index: 1; width: 50%; border-right: none; border-top-right-radius: 0; }
.development-process-section .process-step-card:first-child:before { width: 50%; border-left: none; border-top-left-radius: 0; }
.development-process-section .process-step-card:hover { box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08); border-color: #cbd5e1; }
.development-process-section .step-number-wrapper { position: absolute; top: -20px; left: 50%; transform: translateX(-50%); z-index: 3; }
.development-process-section .step-number { width: 50px; height: 50px; background: #1A508E; color: #ffffff; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 20px; font-weight: 700; border: 8px solid #ffffff; box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1); }
.development-process-section .step-content { margin-top: 10px; }
.development-process-section .step-title { font-size: 22px; font-weight: 600; color: #0F172A; margin-bottom: 1rem; line-height: 1.4; margin-top: 0; letter-spacing: 0.2px; }
.development-process-section .step-description { font-weight: 500; font-size: 16px; color: #1E293B; line-height: 1.6; margin: 0; letter-spacing: 0.2px; }
/* =====================
   APP SERVICES — Figma exact match
   ===================== */
.app-services-section { padding: 60px 0; background: #F1F5F9; }
.app-services-section .services-header { text-align: center; margin-bottom: 3.5rem; }
.app-services-section .services-title { font-size: 42px; font-weight: 600; color: #0F172A; margin: 0 0 1rem; line-height: 1.3; }
.app-services-section .services-subtitle { font-size: 16px; color: #334155; font-weight: 500; max-width: 800px; margin: 0 auto; line-height: 1.8; }

/* GRID */
.app-services-section .services-grid {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 1rem;
}

/* Card 1 — Android: 8col, 2rows tall */
.app-services-section .service-card-1 { grid-column: span 8; grid-row: span 2; }
/* Card 2 — iOS: 4col, 2rows tall */
.app-services-section .service-card-2 { grid-column: span 4; grid-row: span 3; }
/* Card 3 — Cross: 4col */
.app-services-section .service-card-3 { grid-column: span 4; }
/* Card 4 — Flutter: 8col */
.app-services-section .service-card-4 { grid-column: span 4; }
/* Card 5 — React Native: 8col */
.app-services-section .service-card-5 { grid-column: span 8; }
/* Card 6 — Hybrid: 4col */
.app-services-section .service-card-6 { grid-column: span 4; }

/* BASE CARD */
.app-services-section .service-card {
  background: #fff;
  border-radius: 16px;
  padding: 1.5rem;
  position: relative;
  transition: all 0.3s ease;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  min-height: 200px;
}
.app-services-section .service-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(0,0,0,0.08);
}

/* Icon box */
.icon_boxservice {
  background: linear-gradient(90deg, rgba(138,56,245,0.12) 25%, rgba(245,166,35,0.12) 100%);
  border-radius: 12px;
  width: 56px; height: 56px;
  margin-bottom: 14px;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.icon_boxservice img { width: 28px; height: 28px; object-fit: contain; }

/* Card header */
.app-services-section .service-card-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 10px;
  gap: 0.75rem;
}
.app-services-section .service-title {
  font-size: 20px; font-weight: 600; color: #0F172A;
  margin: 0; line-height: 1.4; flex: 1;
}
.arrow-link {
  flex-shrink: 0; display: none;
  opacity: 0.6; transition: all 0.3s ease;
}
.app-services-section .service-card:hover .arrow-link { opacity: 1; transform: translate(2px,-2px); }

/* Description */
.app-services-section .service-description {
  font-size: 14px; color: #1E293B;
  line-height: 1.65; margin: 0; font-weight: 500;
  max-width: 340px;
}

/* =====================
   ILLUSTRATION — absolute bottom-right
   Used by: Android(1), iOS(2), Flutter(4), ReactNative(5)
   Content stays top-left, image floats bottom-right
   ===================== */
.app-services-section .service-card-1,
.app-services-section .service-card-2,
.app-services-section .service-card-4,
.app-services-section .service-card-5 {
  position: relative;
}

.app-services-section .service-card-1 .service-icons,
.app-services-section .service-card-2 .service-icons,
.app-services-section .service-card-4 .service-icons,
.app-services-section .service-card-5 .service-icons {
  position: absolute;
  bottom: 0;
  right: 0;
  margin: 0;
  padding: 0;
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
}
.app-services-section .service-card-2 .service-icons{align-items:center; justify-content:center;}
.app-services-section .service-card-1 .service-icons img,
.app-services-section .service-card-2 .service-icons img,
.app-services-section .service-card-4 .service-icons img,
.app-services-section .service-card-5 .service-icons img {
  display: block;
  object-fit: contain;
  object-position: bottom right;
}

/* Android — large illustration */
.app-services-section .service-card-1 .service-icons img {
  height: 226px;
  width: auto;
  max-width: 100%;
}

/* iOS — large illustration */
.app-services-section .service-card-2 .service-icons img {
  height: 420px;
  width: auto;
  max-width: 85%;
}

/* Flutter — medium illustration */
.app-services-section .service-card-4 .service-icons img {
  height: 220px;
  width: auto;
  max-width: 55%;
}

/* React Native — large illustration */
.app-services-section .service-card-5 .service-icons img {
  height: 345px;
  width: auto;
  max-width:70%;
}

/* Content max-width so it doesn't overlap image */
.app-services-section .service-card-1 .service-description,
.app-services-section .service-card-5 .service-description { max-width: 46%; }

.app-services-section .service-card-2 .service-description,
.app-services-section .service-card-4 .service-description { max-width: 100%; }
.app-services-section .service-card-2 .service-description{margin-bottom:300px}
/* Variants */
.app-services-section.sass-services .service-card-7,
.app-services-section.sass-services .service-card-8 { grid-column: span 6; }
.app-services-section.erp-services .service-card-1,
.app-services-section.erp-services .service-card-2,
.app-services-section.erp-services .service-card-6 { grid-column: span 3; }
.app-services-section.erp-services .service-card-3,
.app-services-section.erp-services .service-card-5 { grid-column: span 6; }

/* RESPONSIVE */
@media(max-width:992px) {
  .app-services-section .service-card-1,
  .app-services-section .service-card-2 { grid-column: span 12; grid-row: span 1; min-height: 280px; }
  .app-services-section .service-card-3,
  .app-services-section .service-card-6 { grid-column: span 4; }
  .app-services-section .service-card-4,
  .app-services-section .service-card-5 { grid-column: span 8; }
  .app-services-section .service-card-1 .service-description,
  .app-services-section .service-card-5 .service-description { max-width: 50%; }
}
@media (max-width: 768px) {
  .mobilenewapp-custombanner {
    background-image: none;
    background-color: #1A508E;
  }
}
@media(max-width:600px) {
  .app-services-section .services-grid { grid-template-columns: 1fr; }
  .app-services-section [class*="service-card-"] {
    grid-column: span 1 !important;
    grid-row: span 1 !important;
    min-height: 240px;
  }
  .app-services-section .service-card-1 .service-icons img,
  .app-services-section .service-card-5 .service-icons img { height: 180px; }
  .app-services-section .service-card-2 .service-icons img,
  .app-services-section .service-card-4 .service-icons img { height: 160px; }
  .app-services-section .service-card-1 .service-description,
  .app-services-section .service-card-5 .service-description { max-width: 55%; }
  .app-services-section .services-title { font-size: 28px; }
}
/* Industry Solutions Section */
.industry-solutions-section { padding: 4rem 0; background: #0F172A; }
.industry-solutions-section .section-header { text-align: center; margin-bottom: 3.5rem; }
.industry-solutions-section .section-title { font-size: 42px; font-weight: 600; color: #ffffff; margin-bottom: 1rem; line-height: 1.3; margin-top: 0; }
.industry-solutions-section .section-subtitle { font-size: 16px; color: #E2E8F0; max-width: 900px; margin: 0 auto; line-height: 1.7; }
.industry-solutions-section .solutions-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; }
.industry-solutions-section .solution-card { background: rgba(255, 255, 255, 0.03); border: 1px solid rgba(255, 255, 255, 0.1); border-radius: 12px; padding: 2rem; transition: all 0.3s ease; cursor: pointer; }
.industry-solutions-section .solution-card:hover { background: rgba(255, 255, 255, 0.06); border-color: rgba(255, 255, 255, 0.2); transform: translateY(-4px); }
.industry-solutions-section .card-header { display: flex; align-items: center; gap: 1rem; margin-bottom: 1.25rem; }
.industry-solutions-section .card-icon { width: 48px; height: 48px; display: flex; align-items: center; justify-content: center; background: rgba(255, 255, 255, 0.1); border-radius: 10px; color: #ffffff; flex-shrink: 0; }
.industry-solutions-section .card-icon svg { width: 24px; height: 24px; }
.industry-solutions-section .card-title { font-size: 1.25rem; font-weight: 600; color: #ffffff; margin: 0; flex: 1; }
.industry-solutions-section .arrow-icon { width: 40px; height: 40px; color: rgba(255, 255, 255, 0.5); flex-shrink: 0; transition: all 0.3s ease; }
.industry-solutions-section .solution-card:hover .arrow-icon { color: #ffffff; transform: translate(4px, -4px); }
.industry-solutions-section .card-description { font-size: 0.95rem; color: rgba(255, 255, 255, 0.7); line-height: 1.7; margin: 0; }
@keyframes fadeInUp {
    from { opacity: 0; transform: translateY(30px); }
    to { opacity: 1; transform: translateY(0); }
}
.industry-solutions-section .solution-card { animation: fadeInUp 0.6s ease forwards; }
.industry-solutions-section .solution-card:nth-child(1) { animation-delay: 0.1s; }
.industry-solutions-section .solution-card:nth-child(2) { animation-delay: 0.2s; }
.industry-solutions-section .solution-card:nth-child(3) { animation-delay: 0.3s; }
.industry-solutions-section .solution-card:nth-child(4) { animation-delay: 0.4s; }
.industry-solutions-section .solution-card:nth-child(5) { animation-delay: 0.5s; }
.industry-solutions-section .solution-card:nth-child(6) { animation-delay: 0.6s; }
.industry-solutions-section .solution-card:nth-child(7) { animation-delay: 0.7s; }
.industry-solutions-section .solution-card:nth-child(8) { animation-delay: 0.8s; }
.industry-solutions-section .solution-card:nth-child(9) { animation-delay: 0.9s; }
.industry-solutions-section { padding: 3rem 0; background: #0F172A; }

.industry-solutions-section .section-subtitle { font-size: 16px;font-weight: 500; color: #E2E8F0; max-width: 500px; margin: 0 auto; }
.industry-solutions-section .industries-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; }
.industry-solutions-section .industry-card { border-bottom: 1px solid #334155; border-left: 1px solid #334155; padding: 20px; cursor: pointer; transition: all 0.3s ease; }
.industry-solutions-section .card-header { display: flex; align-items: center; gap: 16px; margin-bottom: 20px; }
.industry-solutions-section .icon-wrapper { width: 48px; height: 48px; display: flex; align-items: center; justify-content: center; color: #48caec; }
.industry-solutions-section .industry-title { font-size: 22px; font-weight: 600; color: #ffffff; margin: 0; flex: 1; }
.industry-solutions-section .arrow-icon { color: #94a3b8; opacity: 0; transition: opacity 0.3s ease; }
.industry-solutions-section .industry-card:hover .arrow-icon { opacity: 1; }
.industry-solutions-section .industry-description { font-size: 16px; line-height: 1.6; color: #CBD5E1; font-weight: 500; margin: 0; }
.industry-solutions-section .industries-grid .industry-card:first-child,
.industry-solutions-section .industries-grid .industry-card:nth-child(4),
.industry-solutions-section .industries-grid .industry-card:nth-child(7) { border-left: 0; }
.industry-solutions-section .industries-grid .industry-card:nth-child(7),
.industry-solutions-section .industries-grid .industry-card:nth-child(9),
.industry-solutions-section .industries-grid .industry-card:nth-child(8) { border-bottom: 0; }

.case-study-section { padding: 3rem 0; background: #F1F5F9; }
.case-study-section .cs-header { text-align: center; margin-bottom: 3rem; }
.case-study-section .cs-title { font-size: 32px; font-weight: 500; color: #0F172A; margin-bottom: 14px; margin-top: 0; }
.case-study-section .cs-subtitle { font-size: 16px; color: #1E293B; font-weight: 500; max-width: 600px; margin: 0 auto; line-height: 1.7; }
.case-study-section .cs-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.5rem; }
.case-study-section .cs-card { background: #ffffff; border-radius: 12px; overflow: hidden; transition: box-shadow 0.3s ease; }
.case-study-section .cs-card:hover { box-shadow: 0 8px 30px rgba(0,0,0,0.08); }
.case-study-section .cs-image { width: 100%; height: 320px; overflow: hidden; padding: 15px; padding-bottom: 0; border-radius: 8px; }
.case-study-section .cs-image img { width: 100%; height: 100%; object-fit: cover; border-radius: 8px; }
.case-study-section .cs-body { padding: 1.5rem; }
.case-study-section .cs-tags { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 1rem; }
.case-study-section .cs-tag { display: inline-flex; align-items: center; gap: 5px; padding: 5px 12px; font-size: 15px; font-weight: 500; background: #F1F5F9; color: #475569; border-radius: 8px; }
.case-study-section .cs-tag.industry { background: #F1F5F9; color: #1E293B; }
.case-study-section .cs-tag.industry.healthcare { background: #01C9B51A; color: #01C9B5; }
.case-study-section .cs-tag.industry.manufacturing { background: #F5A6231A; color: #F5A623; }
.case-study-section .cs-tag.industry.travel_hospitality { background: #8A38F51A; color: #8A38F5; }
.case-study-section .cs-desc { font-size: 20px; line-height: 1.7; color: #1E293B; font-weight: 500; margin-bottom: 1.25rem; }
.case-study-section .cs-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-bottom: 1.25rem; }
.case-study-section .cs-stat-num { font-size: 22px; font-weight: 600; color: #0F172A; }
.case-study-section .cs-stat-label { font-size: 18px; color: #334155; font-weight: 500; }
.cs-stat { position: relative; }
.cs-stats .cs-stat:first-child:after { background: #E2E8F0; content: ""; top: 9px; right: 0; height: 40px; width: 1px; position: absolute; }
.case-study-section .cs-link { display: inline-flex; align-items: center; gap: 6px; font-size: 18px; font-weight: 600; color: #0F172A; text-decoration: none; border-bottom: 1.5px solid #0F172A; padding-bottom: 2px; transition: opacity 0.2s ease; }
.case-study-section .cs-link:hover { opacity: 0.7; }

.tech-stack-section { background: #fff; padding:0 0 3rem 0; }
.tech-stack-section.crm-techstack{background:#F1F5F9}
.tech-stack-section .section-header { text-align: center; margin-bottom: 2.5rem; }
.tech-stack-section .section-title { font-size: 42px; font-weight: 600; color: #1E293B; margin-bottom: 10px; margin-top: 0; }
.tech-stack-section .section-subtitle { font-size: 16px; color: #1E293B; max-width: 900px; font-weight: 500; margin: 0 auto; line-height: 1.7; }
.tech-stack-section .tech-card { background: #ffffff; border-radius: 16px; overflow: hidden; }

/* Tabs Container */
.tech-stack-section .tech-tabs { 
    position: relative; 
    border-bottom: 2px solid #F1F5F9; 
    overflow: hidden; 
}

/* Scrollable Track - Centered by default */
.tech-stack-section .tech-tabs-track {
    display: flex;
    overflow-x: auto;
    scroll-behavior: smooth;
    scrollbar-width: none;
    -ms-overflow-style: none;
    padding: 0 40px;
    justify-content: center; /* 👈 Center tabs when space allows */
}
.tech-stack-section.crm-techstack .tech-tabs-track{justify-content: space-between;}
.tech-stack-section .tech-tabs-track.has-scroll {
    justify-content: flex-start; /* 👈 Left-align when overflow detected */
}
.tech-stack-section .tech-tabs-track::-webkit-scrollbar { display: none; }

/* Scroll Buttons */
.tech-stack-section .tab-scroll-btn {
    position: absolute;
    top: 0; bottom: 0;
    width: 40px;
    background: #fff;
    border: none;
    border-bottom: 2px solid #F1F5F9;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 10;
    color: #64748B;
    transition: all 0.2s ease;
    opacity: 0;
    pointer-events: none;
}
.tech-stack-section .tab-scroll-btn.visible { opacity: 1; pointer-events: auto; }
.tech-stack-section .tab-scroll-btn:hover { background: #F8FAFC; color: #0F172A; }
.tech-stack-section .tab-scroll-btn.left { left: 0; }
.tech-stack-section .tab-scroll-btn.right { right: 0; }
.tech-stack-section .tab-scroll-btn svg { width: 20px; height: 20px; }

/* Individual Tab - Centered Content */
.tech-stack-section .tech-tab {
    flex: 0 0 auto;
    min-width: 120px;
    padding: 16px 20px;
    font-size: 15px;
    font-weight: 600;
    color: #64748B;
    background: none;
    border: none;
    border-bottom: 2px solid transparent;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center; /* 👈 Center icon + text */
    gap: 8px;
    white-space: nowrap;
    text-align: center;      /* 👈 Center text alignment */
    transition: all 0.2s ease;
}
.tech-stack-section.saas-techstack .tech-tab { min-width: inherit; }
.tech-stack-section .tech-tab:hover:not(.active) { color: #334155; background: #F8FAFC; }
.tech-stack-section .tech-tab.active { color: #0F172A; border-bottom-color: #1A508E; font-weight: 600; }
.tech-stack-section .tech-tab svg { width: 18px; height: 18px; flex-shrink: 0; }

/* Tab Content */
.tech-stack-section .tech-content { padding: 2rem 2rem 0 2rem; }
.tech-stack-section.crm-techstack .tech-content{padding: 2rem 2rem}
.tech-stack-section .tab-panel { display: none; }
.tech-stack-section .tab-panel.active { display: block; }
.tech-stack-section .tech-grid { display: flex;flex-wrap: wrap;gap: 1.25rem;justify-content: center;align-items: center;
    max-width: 1000px;margin: 0 auto;}
.tech-stack-section .tech-grid > * {flex: 0 0 200px;max-width: 200px;}
.mobileapp-techstack.tech-stack-section .tech-grid,.crm-techstack.tech-stack-section .tech-grid{max-width:100%}
.tech-stack-section .tech-item { border: 1px solid #E2E8F0; border-radius: 12px;padding: 1.5rem 1rem; 
    display: flex; flex-direction: column;align-items: center; gap: 1rem; width:100%;height:100%;cursor: pointer; 
    transition: box-shadow 0.2s, border-color 0.2s;}
.tech-stack-section .tech-item:hover { box-shadow: 0 4px 20px rgba(0,0,0,0.08); border-color: #cbd5e1; }
.tech-stack-section .tech-item img { width: auto; height: 48px; object-fit: contain; }
.tech-stack-section .tech-name { font-size: 17px; font-weight: 600; color: #1E293B; text-align: center; }

.testimonials-section { padding: 3rem 0; background: #F1F5F9; }
.testimonials-section .section-header { text-align: center; margin-bottom: 2.5rem; }
.testimonials-section .section-title { font-size: 32px; font-weight: 500; color: #0F172A; margin: 0 0 1rem 0; }
.testimonials-section .section-subtitle { font-size: 16px; color: #1E293B; font-weight: 500; line-height: 1.7; margin: 0; max-width: 800px; margin: 0 auto; }
.testimonials-section .testimonial-wrapper { display: grid; grid-template-columns: 280px 1fr; gap: 1.5rem; align-items: stretch; }
.testimonials-section .rating-card { background: #ffffff; border-radius: 12px; padding: 1.5rem; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1rem; }
.testimonials-section .rating-number { font-size: 92px; font-weight: 300; color: #334155; line-height: 1; }
.testimonials-section .stars { display: flex; gap: 4px; }
.testimonials-section .stars svg { width: 28px; height: 28px; fill: #F5A623; }
.testimonials-section .review-count { font-size: 18px; color: #64748b; font-weight: 600; }
.testimonials-section .platform-logos { display: flex; align-items: center; gap: 1.25rem; margin-top: .5rem; }
.testimonials-section .platform-logos img { height: 24px; object-fit: contain; }
.testimonials-section .testimonial-card { background: #ffffff; border-radius: 8px; display: grid; padding: 16px; grid-template-columns: 1fr 1fr; overflow: hidden; height: 100%; }
.testimonials-section .video-wrapper { position: relative; overflow: hidden; }
.testimonials-section .video-wrapper img { width: 100%; height: 100%; object-fit: cover; display: block; }
.testimonials-section .play-btn { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 64px; height: 64px; background: rgba(255,255,255,0.4); border-radius: 50%; display: flex; align-items: center; justify-content: center; cursor: pointer; border: none; transition: transform 0.2s, background 0.2s; }
.testimonials-section .play-btn svg { width: 20px; height: 20px; fill: #1A508E; margin-left: 3px; }
.testimonials-section .quote-content { padding-left: 1rem; display: flex; flex-direction: column; justify-content: center; gap: 1rem; }
.testimonials-section .quote-icon svg { width: 32px; height: 32px; fill: #CBD5E1; }
.testimonials-section .quote-text { font-size: 18px; line-height: 1.75; color: #334155; font-weight: 500; margin: 0; }
.testimonials-section .reviewer { display: flex; align-items: center; gap: .75rem; }
.testimonials-section .reviewer img { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; }
.testimonials-section .reviewer-name { font-size: 15px; font-weight: 700; color: #0F172A; margin: 0 0 2px 0; }
.testimonials-section .reviewer-role { font-size: 13px; color: #64748B; font-weight: 500; margin: 0; }
.testimonials-section .testimonial-footer { display: flex; align-items: center; justify-content: space-between; margin-top: 1.25rem; }
.testimonials-section .progress-bar { flex: 1; height: 3px; background: #e2e8f0; border-radius: 999px; margin-right: 2rem; overflow: hidden; }
.testimonials-section .progress-fill { height: 100%; width: 33%; background: #1A508E; border-radius: 999px; transition: width 0.4s ease; }
.testimonials-section .nav-btns { display: flex; gap: .75rem; }
.testimonials-section .nav-btn { width: 44px; height: 44px; border-radius: 50%; border: 1.5px solid #1A508E; background: #fff; display: flex; align-items: center; justify-content: center; cursor: pointer; transition: all 0.2s; color: #1A508E; }
.testimonials-section .nav-btn:hover { border-color: #1A508E; color: #1A508E; }
.testimonials-section .nav-btn svg { width: 18px; height: 18px; }
.video-popup-modal { display: none; position: fixed; z-index: 9999; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.9); align-items: center; justify-content: center; }
.modal-content-wrapper { position: relative; width: 90%; max-width: 900px; aspect-ratio: 16/9; background: #000; }
.modal-content-wrapper video { width: 100%; height: 100%; display: block; }
.close-modal { position: absolute; top: -40px; right: 0; color: #fff; font-size: 30px; font-weight: bold; cursor: pointer; background: none; border: none; }
.close-modal:hover { color: #ccc; }


.hire-section { background: #fff; padding: 3rem 0; }
.hire-section .container { display: flex; align-items: center; gap: 4rem; }
.hire-section .hire-left { flex: 1; }
.hire-section .hire-title { font-size: 32px; font-weight: 500; color: #0F172A; line-height: 1.6; margin-bottom: 1.25rem; margin-top: 0; }
.hire-section .hire-desc { font-size: 16px; color: #1E293B; line-height: 1.7; font-weight: 500; margin-bottom: 2rem; }
.hire-section .hire-avatars { display: flex; align-items: center; }
.hire-section .avatar { width: 50px; height: 50px; border-radius: 50%; margin-left: -20px; overflow: hidden; }
.hire-section .avatar:first-child { margin-left: 0; }
.hire-section .avatar img { width: 100%; height: 100%; object-fit: cover; }
.hire-section .hire-badge { display: inline-flex; align-items: center; gap: 8px; background: #E2E8F0; border: 3px solid #FFF; border-radius: 999px; padding: 10px 16px; font-size: 15px; font-weight: 700; margin-left: -20px; color: #334155; }
.hire-section .badge-dot { width: 20px; height: 20px; background: #22c55e; border-radius: 50%; display: flex; align-items: center; justify-content: center; }
.hire-section .hire-right { flex: 0 0 550px; }
.pricing-card { border-radius: 12px; padding: 1rem; position: relative; border: 1.5px solid #E2E8F0; }
.pricing-card .trial-badge { position: absolute; top: 0; right: 0; background: #F1F5F9; color: #1A508E; font-size: 15px; font-weight: 600; padding: 4px 12px; border-radius: 6px; }
.pricing-card .plan-name { font-size: 22px; font-weight: 600; color: #0F172A; margin-bottom: 4px; }
.pricing-card .plan-rate { font-size: 16px; color: #1E293B; font-weight: 500; margin-bottom: 1.5rem; }
.pricing-card .features-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 1.25rem; }
.pricing-card .feature-item { display: flex; align-items: center; gap: 10px; font-size: 16px; color: #1E293B; font-weight: 500; }
.pricing-card .feature-tick { width: 22px; height: 22px; background: #1A508E; border-radius: 50%; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.pricing-card .feature-tick svg { width: 11px; height: 11px; }
.pricing-card .plan-divider { border: none; border-top: 1px solid #f1f5f9; margin: 1rem 0; }
.pricing-card .plan-footer { display: flex; align-items: center; justify-content: space-between; }
.pricing-card .plan-from { font-size: 14px; color: #1E293B; margin-bottom: 4px; }
.pricing-card .plan-amount { font-size: 30px; font-weight: 600; color: #0F172A; }
.pricing-card .plan-btn { background: #1A508E; color: #ffffff; border: none; border-radius: 8px; padding: 10px 24px; font-size: 15px; font-weight: 600; cursor: pointer; text-decoration: none; display: inline-block; transition: opacity 0.2s; }
.pricing-card .plan-btn:hover { opacity: 0.9; }

.faq-section { padding: 3rem 0; background: #fff; }
.faq-section .section-header { text-align: center; margin-bottom: 2.5rem; }
.faq-section .section-title { font-size:42px; font-weight: 600; color: #0F172A; margin: 0 0 1rem 0; line-height: 1.3; }
.faq-section .section-subtitle { font-size: 16px; color: #1E293B; max-width: 700px; font-weight: 500; margin: 0 auto; line-height: 1.7; }
.faq-section .faq-list { max-width: 900px; margin: 0 auto; display: flex; flex-direction: column; }
.faq-section .faq-item { border-bottom: 1px solid #E2E8F0; transition: all 0.3s ease; margin: 2px 0; }
.faq-section .faq-item.open { background: #F1F5F9; border-bottom: 1px solid transparent; border-radius: 12px; }
.faq-section .faq-question { width: 100%; background: none; border: none; padding: 1.25rem 1.5rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; cursor: pointer; text-align: left; }
.faq-section .faq-item.open .faq-question { padding-bottom: 10px; }
.faq-section .faq-item { border-bottom: 1px solid #E2E8F0; }
.faq-section .faq-item.open { border-radius: 12px; }
.faq-section .faq-item.open .faq-item,
.faq-section .faq-item:last-child { border-bottom: 1px solid transparent; }
.faq-section .faq-item:last-child { border-bottom: none; }
.faq-section .faq-item.open + .faq-item { border-top-color: transparent; border-bottom-color: #E2E8F0; }
.faq-section .faq-item.open { border-bottom: none; margin-bottom: 8px; margin-top: 8px; }
.faq-section .faq-question-text { font-size: 16px; font-weight: 600; color: #0F172A; line-height: 1.4; }
.faq-section .faq-icon { width: 28px; height: 28px; border-radius: 50%; display: flex; align-items: center; justify-content: center; flex-shrink: 0; transition: all 0.3s; color: #475569; }
.faq-section .faq-icon svg { width: 16px; height: 16px; transition: transform 0.3s; }
.faq-section .faq-item.open .faq-icon { background: #fff; color: #0F172A; }
.faq-section .faq-item.open .faq-icon svg { transform: rotate(45deg); }
.faq-section .faq-answer { max-height: 0; overflow: hidden; transition: max-height 0.35s ease, padding 0.3s ease; padding: 0 1.5rem; }
.faq-section .faq-item.open .faq-answer { max-height: 500px; padding: 0 1.5rem 1.25rem; }
.faq-section .faq-answer p { font-size: 15px; color: #334155; font-weight: 500; line-height: 1.75; margin: 0; padding-top: 0; }

.blogs-section { padding:0 0 3rem 0; }
.blogs-section .section-header { text-align: center; margin-bottom: 2.5rem; }
.blogs-section .section-title { font-size: 42px; font-weight: 600; color: #0F172A; margin: 0 0 1rem 0; line-height: 1.3; }
.blogs-section .section-subtitle { font-size: 16px; color: #1E293B; max-width: 650px; margin: 0 auto; font-weight: 500; line-height: 1.7; }
.blogs-section .blogs-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; }
.blogs-section .blog-card { overflow: hidden; cursor: pointer; transition: transform 0.3s ease, box-shadow 0.3s ease; text-decoration: none; display: block; }
.blogs-section .blog-card:hover { transform: translateY(-6px); }
.blogs-section .blog-image { width: 100%; height: 240px; overflow: hidden; border-radius: 12px; }
.blogs-section .blog-image img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.4s ease;border-radius: 12px;  }
.blogs-section .blog-card:hover .blog-image img { transform: scale(1.05); }
.blogs-section .blog-body { padding: 1.25rem 0; }
.blogs-section .blog-tag { display: inline-block; padding: 4px 14px; border-radius: 999px; font-size: 13px; font-weight: 600; margin-bottom: 1rem; background: #D1DCE8; color: #1A508E; border: 1px solid #D1DCE8; }
.blogs-section .blog-card:nth-child(2) .blog-tag { background: #FEF7E9; color: #F5A623; border: 1px solid #FEF7E9; }
.blogs-section .blog-card:nth-child(3) .blog-tag { background: #F4ECFE; color: #8A38F5; border: 1px solid #F4ECFE; }
.blogs-section .blog-title { font-size: 20px; font-weight: 700; color: #0F172A; line-height: 1.45; margin: 0 0 .75rem 0; letter-spacing: 0.5px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.blogs-section .blog-excerpt { font-size: 16px; color: #1E293B; line-height: 1.7; font-weight: 500; margin: 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.blog_morelink{font-weight: 600; font-size: 16px;letter-spacing: 0.5px;color:#475569;display:flex;margin-top:12px;gap:5px;align-items: center;}
.sr-only {position: absolute;width: 1px;height: 1px;padding: 0;margin: -1px;overflow: hidden;
    clip: rect(0, 0, 0, 0);white-space: nowrap;border: 0;}

.cta-banner-section{padding:2.5rem 0;background:#fff;}
.cta-banner-section .cta-banner-inner{background:#1A508E;border-radius:12px;padding:2.5rem 3rem;display:flex;align-items:center;justify-content:space-between;gap:2rem;position:relative;overflow:hidden;}
.cta-banner-section .cta-banner-inner::before{content:'';position:absolute;right:250px;top:50%;transform:translateY(-50%);width:320px;height:320px;background:url('{{ asset("assets/front/base/images/saas-bg-pattern.svg") }}') no-repeat center;background-size:contain;opacity:.15;pointer-events:none;}
.cta-banner-section .cta-content{flex:1;max-width:600px;position:relative;z-index:1;}
.cta-banner-section .cta-title{font-size:28px;font-weight:600;color:#fff;line-height:1.35;margin:0 0 .75rem 0;letter-spacing:.2px;}
.cta-banner-section .cta-subtitle{font-size:15px;color:rgba(255,255,255,.8);line-height:1.7;margin:0;font-weight:400;}
.cta-banner-section .cta-btn-wrap{flex-shrink:0;position:relative;z-index:1;}
.cta-banner-section .cta-btn{display:inline-flex;align-items:center;justify-content:center;padding:14px 28px;background:#fff;color:#1A508E;font-size:15px;font-weight:700;border-radius:10px;text-decoration:none;white-space:nowrap;transition:all .3s ease;box-shadow:0 4px 16px rgba(0,0,0,.12);}
.cta-banner-section .cta-btn:hover{background:#F1F5F9;transform:translateY(-2px);box-shadow:0 6px 20px rgba(0,0,0,.18);}
.expertise-section{padding:3rem 0;background:#F1F5F9;}
.expertise-section .section-header{text-align:center;margin-bottom:2.5rem;}
.expertise-section .section-title{font-size:32px;font-weight:500;color:#0F172A;margin:0 0 1rem 0;}
.expertise-section .section-subtitle{font-size:16px;color:#1E293B;font-weight:500;max-width:700px;margin:0 auto;line-height:1.7;}
.expertise-section .expertise-slider-wrapper{position:relative;overflow:hidden;}
.expertise-section .expertise-track{display:flex;gap:1rem;transition:transform .4s ease;}
.expertise-section .expertise-card{background:#fff;border-radius:8px;padding:2rem;width:33%;flex-shrink:0;display:flex;flex-direction:column;gap:1.25rem;border:1px solid #E2E8F0;transition:box-shadow .3s ease;}
.expertise-section .expertise-card:hover{box-shadow:0 8px 24px rgba(0,0,0,.08);}
.expertise-section .card-icon{width:64px;height:64px;display:flex;align-items:center;justify-content:center;}
.expertise-section .card-icon img{width:100%;height:100%;object-fit:contain;}
.expertise-section .card-title{font-size:20px;font-weight:600;color:#0F172A;margin:0;line-height:1.4;letter-spacing:.2px;}
.expertise-section .card-desc{font-size:15px;color:#1E293B;font-weight:500;line-height:1.7;letter-spacing:.2px;margin:0;}
.expertise-section .slider-footer{display:flex;align-items:center;justify-content:space-between;margin-top:1.5rem;}
.expertise-section .progress-bar{flex:1;height:3px;background:#E2E8F0;border-radius:999px;margin-right:2rem;overflow:hidden;}
.expertise-section .progress-fill{height:100%;background:#1A508E;border-radius:999px;transition:width .4s ease;}
.expertise-section .nav-btns{display:flex;gap:.75rem;}
.expertise-section .nav-btn{width:44px;height:44px;border-radius:50%;border:1.5px solid #1A508E;background:#F1F5F9;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s;color:#1A508E;}
.expertise-section .nav-btn:hover{background:#1A508E;color:#fff;}
.expertise-section .nav-btn svg{width:18px;height:18px;}


.services-split-section { padding: 3rem 0; background: #ffffff; }
.split-layout { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: 4rem; align-items: flex-start; }
.split-content { max-width: 600px; }
.section-headerservicestop{    text-align: center;
    margin-bottom: 2.5rem;}
/* Typography */
.split-title { letter-spacing: 0.2px;     font-size: 32px;
    font-weight: 500;
    color: #1E293B;
    margin-bottom: 10px;
    margin-top: 0; text-align: center;}
.split-subtitle {
    font-size: 16px;
    color: #1E293B;
    max-width: 900px;
    font-weight: 500;
    margin: 0 auto;
    line-height: 1.7;}

.feature-item { padding: 1rem 0 1rem; cursor: pointer; transition: all 0.3s ease; position: relative; }


.feature-title { font-size: 19px; font-weight: 600; color: #0F172A; margin: 0 0 0.5rem 0; position: relative; display: inline-block; transition: color 0.3s; }
.feature-item.active .feature-title { color: #1A508E; }


/* Description Toggle */
.feature-desc { 
  font-size: 16px; font-weight:500; color: #1E293B; line-height: 1.6; 
  opacity: 0; transform: translateY(-8px); transition: all 0.35s ease; 
  pointer-events: none; max-height: 0; overflow: hidden;
}
.feature-item.active .feature-desc { 
  opacity: 1; transform: translateY(0); max-height: 200px; pointer-events: auto; 
}

/* Progress Bar */
.progress-bar { width: 100%; height: 1px; background: #E2E8F0; border-radius: 2px; overflow: hidden; margin-top:20px; }
.progress-fill { height: 100%; width: 0%; background: #1A508E; border-radius: 2px; transition: width 0.8s cubic-bezier(0.4, 0, 0.2, 1);height:4px }
.feature-item.active .progress-fill { width: var(--progress, 0%); }
.feature-item.active .progress-bar{height:4px;background:transparent}
/* Dynamic Image */
.split-image { position: relative; overflow: hidden; border-radius: 16px; height:100% }
.split-image img { 
  width: 100%; height: 100%; border-radius: 12px; object-fit: cover;
  box-shadow: 0 12px 32px rgba(0,0,0,0.12); 
  transition: opacity 0.4s ease, transform 0.4s ease; 
}
.split-image img.fade-out { opacity: 0; transform: scale(0.98); }
.nb-testimonials .nb-section-title h2{margin-bottom:12px}
.nb-testimonials{padding-bottom:0}
/* Responsive */
@media (max-width: 992px) {
  .split-layout { grid-template-columns: 1fr; gap: 2.5rem; }
  .split-image { order: -1; }
}
@media (max-width: 768px) {
  .services-split-section { padding: 3.5rem 0; }
  .split-title { font-size: 26px; }
  .feature-title { font-size: 17px; }
}

/* Responsive */
@media (max-width: 992px) {
  .split-layout { grid-template-columns: 1fr; gap: 2.5rem; }
  .split-image { order: -1; }
}
@media (max-width: 768px) {
  .services-split-section { padding: 3.5rem 0; }
  .split-title { font-size: 26px; }
  .feature-title { font-size: 17px; }
}


@media (min-width: 1280px) {
    .we-offer-section .logos-track { animation-duration: 45s; }
}
@media (min-width: 768px) {

 .cutting-edge-tech-section .tech-grid {grid-template-columns: 1.2fr 1fr;gap: 2rem;}
    .we-offer-section .section-label { font-size: 1rem; }
    .we-offer-section .content-grid { grid-template-columns: 1fr 1fr; gap: 4rem; }
    .we-offer-section .stat-label { font-size: 1.1rem; }
    .we-offer-section .logos-track { gap: 4rem; animation-duration: 35s; }
    .we-offer-section .client-logo { height: 70px; }
    .we-offer-section .logos-wrapper::before,
    .we-offer-section .logos-wrapper::after { width: 200px; }
}
@media (max-width: 1024px) {
.we-offer-section .container { padding: 0; }
.we-offer-section .content-grid { grid-template-columns: 1fr 1.2fr; gap: 5rem; }
.we-offer-section .logos-track { gap: 5rem; animation-duration: 40s; }
.we-offer-section .client-logo { height: 75px; }
.we-offer-section .logos-wrapper::before,
.we-offer-section .logos-wrapper::after { width: 250px; }
.cutting-edge-tech-section .tech-grid { grid-template-columns: 1.2fr 1fr; gap: 2rem; }
.blogs-section .blogs-grid { grid-template-columns: repeat(2, 1fr); }
.testimonials-section .testimonial-wrapper { grid-template-columns: 1fr; }
.testimonials-section .rating-card { flex-direction: row; flex-wrap: wrap; justify-content: center; }
.industry-solutions-section .industries-grid { grid-template-columns: repeat(2, 1fr); }
.expertise-section .expertise-card {min-width: calc((100% - 1.5rem) / 2);}
}
@media (max-width: 1023px) 
{
.development-process-section .process-steps-container::before { display: none; }
.development-process-section .process-steps { grid-template-columns: repeat(3, 1fr); gap: 30px; }
.development-process-section .process-step-card { padding: 50px 20px 30px; }
.app-services-section .services-grid { grid-template-columns: repeat(2, 1fr); }
.service-card:nth-child(n) { grid-column: span 1 !important; }
}
@media (max-width: 992px) {
  .servicesbanner { height: auto; min-height: 500px; padding: 80px 0; } 
  .servicesbanner .banner_headsection h1 { font-size: 2.25rem; } 
  .servicesbanner .banner_headsection p { font-size: 1.1rem; }
    .hire-section .container { flex-direction: column; gap: 2.5rem; }
    .hire-section .hire-right { flex: none; width: 100%; }
    .industry-solutions-section .solutions-grid { grid-template-columns: repeat(2, 1fr); }
    .services-split-section .split-layout { grid-template-columns: 1fr; gap: 2.5rem; }
  .services-split-section .split-content { max-width: 100%; order: 2; }
  .services-split-section .split-image { order: 1; }
}
@media (max-width: 768px) {
    .servicesbanner { min-height: 450px; padding: 30px 0; } 
    .servicesbanner .banner_headsection { padding:0; }
    .servicesbanner .banner_headsection h1 { font-size: 1.75rem; margin-bottom: 20px; } 
    .servicesbanner .banner_headsection p { font-size: 1rem; margin-bottom: 30px; } 
    .servicesbanner .cta-button { padding: 14px 32px; font-size: 0.95rem; } 
    .cta-banner-section .cta-banner-inner {flex-direction: column; align-items: flex-start;padding: 2rem 1.5rem;}
    .cta-banner-section .cta-title { font-size: 22px; }
    .cta-banner-section .cta-btn { width: 100%; text-align: center; }
    .cta-banner-section .cta-banner-inner::before { right: -50px; opacity: 0.08; }
     .tech-stack-section .tech-tab {min-width: 100px;padding: 14px 16px;font-size: 14px;}
    .tech-stack-section .tab-scroll-btn {width: 36px;}
     .services-split-section { padding: 3.5rem 0; }
  .services-split-section .split-title { font-size: 26px; }
  .services-split-section .feature-title { font-size: 17px; }
}
@media (max-width: 480px) { 
  .servicesbanner { min-height: 350px; } 
  .servicesbanner .banner_headsection h1 { font-size: 1.5rem; }
  .servicesbanner .banner_headsection p { font-size: 0.95rem; } 
  .servicesbanner .cta-button { padding: 12px 28px; font-size: 0.9rem; }
  .tech-stack-section.crm-techstack .tech-content{padding:1.5rem 1rem}
.tech-stack-section .tech-grid {display: flex;flex-wrap: wrap;justify-content: center;gap:1rem}
.tech-stack-section .tech-grid > * {flex: 0 0 calc(50% - 1rem);max-width: calc(50% - 1rem);}
.tech-stack-section .tech-name{font-size: 14px;}
  .tech-stack-section .section-title { font-size: 24px; }
  .hire-section .hire-title { font-size: 24px; }
  .pricing-card .features-grid { grid-template-columns: 1fr; }
  .faq-section .section-title { font-size: 24px; }
  .faq-section .faq-question { padding: 1rem; }
  .faq-section .faq-question-text { font-size: 15px; }
  .case-study-section .cs-grid { grid-template-columns: 1fr; }
  .case-study-section .cs-image { height: 200px; }
  .cutting-edge-tech-section .tech-grid { grid-template-columns: 1fr 1fr; gap: 42rem; }
  .cutting-edge-tech-section .tech-left { max-width: 100%; }
  .cutting-edge-tech-section .tech-card { padding: 1.5rem; }
}

@media (max-width: 767px) {
  .we-offer-section { padding: 3rem 0; }
    .we-offer-section .section-label { font-size: 0.875rem; }
    .we-offer-section .content-grid { gap: 0.5rem;grid-template-columns:1fr }
    .we-offer-section .stats-wrapper {  gap: 1.5rem; margin-bottom: 1.5rem; }
    .we-offer-section .stat-item { width: 100%; min-width: unset; padding: 10px 10px; border-left-width: 3px; }
    .we-offer-section .stat-number { font-size: 2.5rem; }
    .we-offer-section .cta-button { width: 100%; padding: 0.875rem 1.5rem; font-size: 0.95rem; }
    .we-offer-section .logos-track { gap: 2rem; animation-duration: 25s; }
    .we-offer-section .client-logo { height: 50px; }
    .we-offer-section .logos-wrapper::before,
    .we-offer-section .logos-wrapper::after { width: 80px; }
    .why-partner-section { padding: 0 0 3rem 0; }
    .why-partner-section .container { padding: 0 }
    .why-partner-section .section-title { font-size: 2rem; }
    .why-partner-section .section-subtitle { font-size: 1rem; }
    .why-partner-section .stats-bar { grid-template-columns: 1fr; padding: 1rem; gap: 1rem; }
    .why-partner-section .stat-box { border-right: none; border-bottom: 1px solid rgba(255, 255, 255, 0.1); padding: 1rem 0; }
    .why-partner-section .stat-box:after { display: none; }
    .why-partner-section .stat-box:last-child { border-bottom: none; }
    .why-partner-section .stat-value { font-size: 2.5rem; }
    .why-partner-section .features-grid { grid-template-columns: 1fr; gap: 0;margin-bottom:20px }
    .cutting-edge-tech-section .tech-title{margin-top:0; font-size: 24px;}
    .why-partner-section .feature-card { padding: 1.5rem; border-left: 0; }
    .why-partner-section .feature-card:nth-child(4),
    .why-partner-section .feature-card:nth-child(5),
    .why-partner-section .feature-card:nth-child(6) { border-bottom: 1px solid #F1F5F9; }
    .why-partner-section .cta-button { width: 100%; padding: 1rem 2rem; }
    .feature-cardtop { margin-bottom: 0.5rem; }
  .cutting-edge-tech-section { padding: 3rem 0; }
  .cutting-edge-tech-section .tech-grid { grid-template-columns: 1fr; gap: 2.5rem; }
  .cutting-edge-tech-section .tech-button { width: 100%; padding: 1rem 2rem; }
  .cutting-edge-tech-section .tech-card { padding: 1.5rem; }
  .cutting-edge-tech-section .tech-card-title { font-size: 1.25rem; }
  .development-process-section { padding:2rem 0; }
    .development-process-section .process-title { font-size: 2rem; }
    .development-process-section .process-steps { grid-template-columns: 1fr!important; gap: 20px; }
    .development-process-section .process-step-card { display: flex; align-items: flex-start; gap: 20px; text-align: left; padding: 20px; }
    .development-process-section .process-header { margin-bottom: 0.5rem; }
    .development-process-section .process-step-card:before,
    .development-process-section .process-step-card:last-child:after { display: none; }
    .development-process-section .step-number-wrapper { position: relative; top: 0; left: 0; transform: none; flex-shrink: 0; }
    .development-process-section .step-content { margin-top: 0; text-align: left; }
    .app-services-section .services-grid { grid-template-columns: 1fr; gap: 1.25rem; }
    .service-card:nth-child(n) { grid-column: span 1 !important; }
    .app-services-section .service-card.has-icons { padding-bottom: 10pxrem; }
    .app-services-section .service-icons { left: 1.5rem; bottom: 1.5rem; }
    .development-process-section .process-steps-container{margin-top:0;padding-top:15px}
    
    
}
@media (max-width: 640px) {
    .testimonials-section .testimonial-card { grid-template-columns: 1fr; }
    .testimonials-section .video-wrapper { height: 220px; }
    .blogs-section .blogs-grid { grid-template-columns: 1fr; }
    .blogs-section .section-title { font-size: 24px; }
    .blogs-section .blog-image { height: 200px; }
    .industry-solutions-section .industries-grid { grid-template-columns: 1fr; }
    .industry-solutions-section .section-title { font-size: 22px; }
    .industry-solutions-section .industry-card { padding: 15px 0; border-left: none; border-bottom: 1px solid #334155; }
    .industry-solutions-section .industries-grid .industry-card:last-child { border-bottom: none; }
    .industry-solutions-section { padding:1.5rem 0; }
    .industry-solutions-section .section-subtitle { font-size: 14px }
    .industry-solutions-section .solutions-grid { grid-template-columns: 1fr; gap: 1.25rem; }
    .industry-solutions-section .solution-card { padding: 1.5rem; }
    .expertise-section .expertise-card {min-width: 100%;}
     .why-partner-section .feature-card { padding:10px 0; }
     .app-services-section .services-title{font-size: 24px;}
     .app-services-section .services-header{margin-bottom:15px}
     .case-study-section{padding:30px 0}
     .hire-section{padding:20px 0}
     .pricing-card .features-grid{gap:0}
     .testimonials-section{padding:20px 0}
     .blogs-section{padding-top:0;padding-bottom:20px}
     .industry-solutions-section .section-header{margin-bottom:15px}
     
}
@media (max-width: 480px) {
    .tech-stack-section .tech-grid { grid-template-columns: repeat(2, 1fr); }
    .we-offer-section { padding: 2.5rem 0 0; }
    .we-offer-section .section-heading { font-size: 20px; }
    .we-offer-section .stat-number { font-size: 2rem; }
    .we-offer-section .logos-track { gap: 1.5rem; animation-duration: 20s; }
    .we-offer-section .client-logo { height: 45px; }
   .why-partner-section .section-title { font-size: 1.75rem; }
    .why-partner-section .stat-value { font-size: 2rem; }
    .why-partner-section .feature-title { font-size: 1.1rem; }
    .why-partner-section .stat-icon{margin-bottom:1rem}
    .cutting-edge-tech-section .tech-card-icon { width: 48px; height: 48px; }
    .why-partner-section .section-header{margin-bottom:15px}
    .why-partner-section .stat-box {text-align: center;justify-content: center;
    align-items: center;display: flex;flex-direction: column;}
}

@media (max-width: 480px) {
  .app-services-section { padding: 30px 16px; }
  .app-services-section .services-title { font-size: 18px; }
  .app-services-section .services-subtitle { font-size: 14px; line-height: 1.6; }
  .app-services-section [class*="service-card-"] { min-height: auto; }
  .app-services-section .service-card { padding: 20px; }
  .app-services-section .service-title { font-size: 16px; }
  
  .app-services-section .service-card-1 .service-description,
  .app-services-section .service-card-2 .service-description,
  .app-services-section .service-card-4 .service-description,
  .app-services-section .service-card-5 .service-description,
  .app-services-section .service-card-6 .service-description {
    max-width: 100%; margin-bottom: 0;  }
  
  .app-services-section .service-icons { display: none; }
  .app-services-section .service-card-1 .service-icons, .app-services-section .service-card-2 .service-icons, .app-services-section .service-card-4 .service-icons, .app-services-section .service-card-5 .service-icons{position:inherit;width:100%;justify-content:center}
  .app-services-section .service-icons{left:0}
  .development-process-section .step-title{font-size:19px;margin-bottom:0.5rem}
  .tech-stack-section .tech-content{padding:2rem 0 0 0}
  .pricing-card .plan-rate{margin-bottom:0.5rem}
  .development-process-section .step-description{font-size:14px}
  .development-process-section .process-title{font-size:22px;}
  .development-process-section .process-subtitle{font-size:14px}
  .industry-solutions-section .industry-title{font-size:18px}
  .industry-solutions-section .industry-title{font-size:16px}
  .industry-solutions-section .industry-description{font-size:14px}
  .industry-solutions-section .industry-card,.industry-solutions-section .industries-grid .industry-card:nth-child(7), .industry-solutions-section .industries-grid .industry-card:nth-child(8){border-bottom:1px solid #334155}
  .industry-solutions-section .card-header{margin-bottom:0.5rem}
}