 /* --- Reset --- */
 * {margin:0;
    padding:0;
    box-sizing:border-box;}
 body {font-family:'Segoe UI',Arial,sans-serif;
    line-height:1.6;
    color:#333;
    background:#f9f9f9;
    scroll-behavior:smooth;}
 a {text-decoration:none;
    color:inherit;}
 .container {width:100%;
    max-width:1200px;
    margin:auto;}

 /* --- Navbar --- */
 nav {
   background:#fff;
   padding:15px 18.5%;
   position:sticky;top:0;z-index:1000;
   display:flex;justify-content:space-between;align-items:center;
   box-shadow:0 2px 10px rgba(0,0,0,0.05);
 }
 .logo {
height: 50px;   /* adjust size */
width: auto;    /* keeps proportions */
display: block;
}
 .nav-links {display:flex;gap:20px;}
 .nav-links a {font-weight:500;color:#333;transition:0.3s;}
 .nav-links a:hover {color:#3c308c;}
 .cta-btn {
   background: linear-gradient(135deg, #3c308c, #2575fc);
    padding: 8px 16px;
    border-radius: 6px;
    color: #fff !important;   /* Ensures text stays white */
    font-weight: bold;
    transition: 0.3s;
    display: inline-block;    /* Keeps button shape consistent */
    text-align: center;
}
 .cta-btn:hover {opacity:0.85;}

 /* --- Hamburger --- */
 .hamburger {
   display:none;
   font-size:1.8rem;
   background:none;
   border:none;
   cursor:pointer;
   color:#333;
 }

 #modalTitle{
   color:#FFF;
 }
 .text-left{
   text-align:left;
 }

/* floting button */
 .floating-icons {
  position: fixed;
  right: 20px;
  bottom: 80px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  z-index: 9999;
}

.floating-icons a img {
    width: 40px;
    height: 40px;
    transition: 0.3s ease;
    object-fit: fill;
  }

.floating-icons a img:hover {
  transform: scale(1.1);
}
/* Send floting button */




/* --- Hero Responsive Design --- */
@media (max-width: 1024px) {
  .hero-content {
    grid-template-columns: 1fr;
    gap: 40px;
    text-align: center;
  }
  
  .hero-visual {
    height: 300px;
    order: -1;
  }
  
  .floating-card {
    padding: 16px;
  }
  
  .card-content h4 {
    font-size: 1rem;
  }
  
  .card-content p {
    font-size: 0.8rem;
  }
}
/* --- Mobile Menu --- */
@media (max-width: 768px) {
  .nav-links {
    display:none;
    position:absolute;
    top:74px;left:0;width:100%;
    flex-direction:column;
    background:#fff;
    padding:20px 0;
    text-align:center;
    box-shadow:0 4px 15px rgba(0,0,0,0.1);
  }
  
  .nav-links.active {display:flex;}
  .cta-btn {margin:10px auto;}
  .hamburger {display:block;}
}

@media (max-width: 768px) {
  .hero {
    min-height: 90vh;
    padding: 60px 0;
  }
  
  .hero-content {
    padding: 0 15px;
    gap: 30px;
  }
  
  .hero-title {
    font-size: clamp(2rem, 8vw, 3rem);
    margin-bottom: 20px;
  }
  
  .hero-subtitle {
    font-size: 1rem;
    margin-bottom: 30px;
  }
  
  .hero-buttons {
    flex-direction: column;
    gap: 15px;
    margin-bottom: 40px;
  }
  
  .btn {
    padding: 14px 28px;
    font-size: 0.95rem;
  }
  
  .hero-stats {
    gap: 30px;
    justify-content: center;
  }
  
  .stat-number {
    font-size: 2rem;
  }
  
  .hero-visual {
    height: 250px;
  }
  
  .floating-card {
    padding: 12px;
  }
  
  .card-icon {
    font-size: 1.5rem;
  }
  
  .scroll-indicator {
    bottom: 20px;
  }
}

@media (max-width: 480px) {
  .hero-stats {
    gap: 20px;
  }
  .hero-content{
    gap: 0px !important;
    grid-template-columns: 0fr 0fr !important;
    justify-content: center !important;
  }
  .hero-visual{
    display: none !important;
  }
  .pb-80{
    padding-left: 20px;
    padding-right: 20px;
  }
  
  .stat-number {
    font-size: 1.8rem;
  }
  
  .stat-label {
    font-size: 0.8rem;
  }
  
  .hero-visual {
    height: 200px;
  }
  
  .floating-card {
    padding: 10px;
  }
  
  .card-content h4 {
    font-size: 0.9rem;
  }
  
  .card-content p {
    font-size: 0.75rem;
  }
}

/* --- Hero Section --- */
.hero {
  position: relative;
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
}

.hero-background {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url("img/background.jpg") no-repeat center center;
  background-size: cover;
  z-index: 1;
}

.hero-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, rgba(60, 48, 140, 0.8) 0%, rgba(37, 117, 252, 0.6) 50%, rgba(102, 126, 234, 0.4) 100%);
  z-index: 2;
}

.hero-particles {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: 
    radial-gradient(circle at 20% 50%, rgba(255, 255, 255, 0.1) 1px, transparent 1px),
    radial-gradient(circle at 80% 20%, rgba(255, 255, 255, 0.1) 1px, transparent 1px),
    radial-gradient(circle at 40% 80%, rgba(255, 255, 255, 0.1) 1px, transparent 1px);
  background-size: 50px 50px, 80px 80px, 60px 60px;
  animation: float 20s ease-in-out infinite;
  z-index: 3;
}

@keyframes float {
  0%, 100% { transform: translateY(0px) rotate(0deg); }
  50% { transform: translateY(-20px) rotate(180deg); }
}

.hero-content {
  position: relative;
  z-index: 4;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 60px;
  align-items: center;
  max-width: 1400px;
  padding: 0 20px;
}

.hero-text {
  animation: slideInLeft 1s ease-out;
}

.hero-title {
  font-size: clamp(2.5rem, 5vw, 4.5rem);
  font-weight: 800;
  line-height: 1.1;
  margin-bottom: 24px;
  color: #fff;
  text-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
}

.title-line-1 {
  display: block;
  animation: fadeInUp 0.8s ease-out 0.2s both;
}

.title-line-2 {
  display: block;
  animation: fadeInUp 0.8s ease-out 0.4s both;
}

.title-line-3 {
  display: block;
  background: linear-gradient(135deg, #fff 0%, #f0f8ff 50%, #e6f3ff 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  animation: fadeInUp 0.8s ease-out 0.6s both;
}

.hero-subtitle {
  font-size: clamp(1rem, 2vw, 1.3rem);
  line-height: 1.6;
  margin-bottom: 40px;
  color: rgba(255, 255, 255, 0.9);
  max-width: 500px;
  animation: fadeInUp 0.8s ease-out 0.8s both;
}

.hero-buttons {
  display: flex;
  gap: 20px;
  margin-bottom: 60px;
  animation: fadeInUp 0.8s ease-out 1s both;
}

.btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 16px 32px;
  border-radius: 50px;
  font-weight: 600;
  font-size: 1rem;
  text-decoration: none;
  transition: all 0.3s ease;
  position: relative;
  overflow: hidden;
}

.btn-primary {
  background: linear-gradient(135deg, #fff 0%, #f8f9ff 100%);
  color: #3c308c;
  box-shadow: 0 8px 25px rgba(255, 255, 255, 0.2);
}

.btn-primary:hover {
  transform: translateY(-3px);
  box-shadow: 0 12px 35px rgba(255, 255, 255, 0.3);
}

.btn-secondary {
  background: transparent;
  color: #fff;
  border: 2px solid rgba(255, 255, 255, 0.3);
  backdrop-filter: blur(10px);
}

.btn-secondary:hover {
  background: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0.6);
  transform: translateY(-3px);
}

.btn-icon {
  width: 18px;
  height: 18px;
  transition: transform 0.3s ease;
}

.btn:hover .btn-icon {
  transform: translateX(3px);
}

.hero-stats {
  display: flex;
  gap: 40px;
  animation: fadeInUp 0.8s ease-out 1.2s both;
}

.stat-item {
  text-align: center;
}

.stat-number {
  display: block;
  font-size: 2.5rem;
  font-weight: 800;
  color: #fff;
  line-height: 1;
  margin-bottom: 8px;
}

.stat-label {
  font-size: 0.9rem;
  color: rgba(255, 255, 255, 0.8);
  text-transform: uppercase;
  letter-spacing: 1px;
}

.hero-visual {
  position: relative;
  height: 500px;
  animation: slideInRight 1s ease-out;
}

.floating-card {
  position: absolute;
  background: rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(20px);
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 20px;
  padding: 24px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
  transition: all 0.3s ease;
}

.floating-card:hover {
  transform: translateY(-10px) scale(1.05);
  background: rgba(255, 255, 255, 0.15);
}

.card-1 {
  top: 20%;
  left: 10%;
  animation: floatCard 6s ease-in-out infinite;
}

.card-2 {
  top: 50%;
  right: 20%;
  animation: floatCard 6s ease-in-out infinite 2s;
}

.card-3 {
  bottom: 20%;
  left: 30%;
  animation: floatCard 6s ease-in-out infinite 4s;
}

@keyframes floatCard {
  0%, 100% { transform: translateY(0px) rotate(0deg); }
  50% { transform: translateY(-15px) rotate(2deg); }
}

.card-content {
  text-align: center;
  color: #fff;
}

.card-icon {
  font-size: 2rem;
  margin-bottom: 12px;
}

.card-content h4 {
  font-size: 1.1rem;
  font-weight: 600;
  margin-bottom: 8px;
}

.card-content p {
  font-size: 0.9rem;
  opacity: 0.8;
}

.scroll-indicator {
  position: absolute;
  bottom: 30px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  color: rgba(255, 255, 255, 0.7);
  font-size: 0.9rem;
  animation: bounce 2s ease-in-out infinite;
  z-index: 4;
}

.scroll-arrow {
  width: 2px;
  height: 30px;
  background: rgba(255, 255, 255, 0.5);
  position: relative;
}

.scroll-arrow::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: -3px;
  width: 8px;
  height: 8px;
  border-right: 2px solid rgba(255, 255, 255, 0.5);
  border-bottom: 2px solid rgba(255, 255, 255, 0.5);
  transform: rotate(45deg);
}

@keyframes bounce {
  0%, 20%, 50%, 80%, 100% { transform: translateX(-50%) translateY(0); }
  40% { transform: translateX(-50%) translateY(-10px); }
  60% { transform: translateX(-50%) translateY(-5px); }
}

@keyframes slideInLeft {
  from {
    opacity: 0;
    transform: translateX(-50px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes slideInRight {
  from {
    opacity: 0;
    transform: translateX(50px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

 /* --- Sections --- */
 section h2 {text-align:center;font-size:2.2rem;margin-bottom:15px;color:#3c308c;}
 section p.section-intro {text-align:center;margin-bottom:40px;color:#222;}

/* About Section */
.about {
background: #fff;
margin: 80px auto;
padding: 40px;
border-radius: 12px;
box-shadow: 0 4px 20px rgba(0,0,0,0.1);
display: flex;
align-items: center;
gap: 30px;
flex-wrap: wrap;
}

.about-text {
flex: 1;
min-width: 300px; /* smaller, so it can shrink on tablets */
}

.about-text h2 {
margin-bottom: 15px;
font-size: 2rem;
color: #3c308c;
text-align:left;
}

.about-text p {
margin-bottom: 15px;
font-size: 1rem;
color: #555;
text-align: justify;
}

.about img {
flex: 1;
max-width: 400px;
border-radius: 10px;
box-shadow: 0 4px 12px rgba(0,0,0,0.1);
width: 100%;
height: auto;
}
/* Portfoilio Category */	  
:root{
 --bg:#0f1724;
 --card:#0b1220;
 --accent:#06b6d4;
 --muted:#94a3b8;
 --glass: rgba(255,255,255,0.04);
 --radius:12px;
}

h1{margin:0 0 10px;font-size:22px;}
p.lead{color:var(--muted);margin:0 0 22px;}

/* Tabs */
.tabs{
 display:flex;
 flex-wrap:wrap;
 gap:20px;
 margin: 0px auto 25px;
 justify-content: center; 
 background: #081327;
 color: #ffffff;
 padding: 12px 20px 8px;
 border-radius: 5px;
 max-width: 600px;
 cursor: pointer;
 font-weight: 600;
 font-size: 14px;
 border: 1px solid #15274b;
 box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
 transition: all .18s ease;}
.tab{
 gap:20px;
 background: transparent;
 color: #ffffff;
 padding: 8px 20px;
 border-radius:5px;
 cursor:pointer;
 font-weight:600;
 font-size:14px;
 border:1px solid transparent;
 transition:all .18s ease;
}
.tab:hover{
background:linear-gradient(90deg,var(--accent),#60a5fa);
color:#022235; 
transition-duration: .3s;
}
.tab[aria-pressed="true"]{
 background:linear-gradient(90deg,var(--accent),#60a5fa);
 color:#022235;
 transform:translateY(-2px);
}

/* Full-Width Card (Our Philosophy) */
.card-full {
  grid-column: 1 / -1;
  background: #1d3557;
  color: white;
  text-align: center;
  padding: 50px 30px;
  border-radius:15px;
  margin-top:40px;
}
.card-full h3 {
  color: #fff;
  font-size: 1.6rem;
  margin-bottom: 15px;
}
.card-full p {
  color: #f1f1f1;
  font-size: 1rem;
  max-width: 700px;
  margin: 0 auto;
}
.why-savvy-content .check-icon{
  font-size: 16px;
  color: #06b6d4;
  font-weight:700;
}
.pb-80{
  padding-bottom: 80px;
}

/* Grid */
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
@media(max-width:1000px){.grid{grid-template-columns:repeat(3,1fr);}}
@media(max-width:700px){.grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:420px){.grid{grid-template-columns:1fr; padding: 0px 20px; justify-content: center;}.tabs{margin: 0px 20px 25px;} .tab{padding: 5px 10px;} .hero h1 {
 font-size: 2rem;} .hero p{font-size: 1rem;}} 

.card{
 position:relative;overflow:hidden;
 border-radius:var(--radius);
 background:rgba(255,255,255,0.03);
 border:1px solid rgba(255,255,255,0.05);
 cursor:pointer;
 width: 100%;
}
.card img, .card video{
 width:100%;height: 100%;object-fit:cover;display:block;
 transition:transform .4s ease;
}
.card:hover img, .card:hover video{transform:scale(1.05);}

.overlay{
 position:absolute;inset:0;
 display:flex;flex-direction:column;
 justify-content:flex-end;
 padding:12px;gap:8px;
 background:linear-gradient(180deg,transparent 40%,rgba(0,0,0,0.55));
}

.title{font-weight:700;font-size:15px;opacity:0;transform:translateY(6px);
 transition:all .2s ease; color: #FFF;}
/* .icons{display:flex;gap:8px;justify-content:flex-end;opacity:0;transform:translateY(12px);
 transition:all .18s ease;} */
 .icons {
  display: flex;
  gap: 8px;
  opacity: 0;
  transform: translateY(12px);
  justify-content: center;
  align-items: center;
  height: 100%;
  transition: all .18s ease;
}
.card:hover .title, .card:hover .icons{
 opacity:1;transform:none;
}

.icon-btn{
 width:40px;height:40px;border-radius:10px;
 border:1px solid #000;
 background: rgb(0 0 0 / 40%);
 color:#fff;display:flex;align-items:center;justify-content:center;
 cursor:pointer;
}
.icon-btn svg{width:18px;height:18px;fill:currentColor;}

.btn-showmore{
  background: transparent;
  border: 1px solid #3c308c;
  color: #3c308c;
}
.btn-showmore:hover{
  background: #3c308c;
  border: 1px solid #3c308c;
  color: #FFF;
}


/* Modal */
.modal{
 position:fixed;inset:0;background:rgba(2,6,23,0.8);
 display:none;align-items:center;justify-content:center;
 z-index:1000;padding:20px;
}
.modal.open{display:flex;}
.modal-inner{background:transparent;border-radius:12px;overflow:hidden;max-width:100%;width:100%; height: 100%;}
.modal-top{display:flex;justify-content:space-between;align-items:center;padding:10px 12px;}
.modal-close{background:none;border:none;color:#94a3b8;font-size:40px;cursor:pointer;}
.modal-body img,.modal-body iframe{width:100%;height:700px;display:block; object-fit: contain;}
.modal-body{height: 100%; display: flex;  width: 100%; justify-content: center; align-items: center;}


/* ✅ Mobile optimization */
@media (max-width: 768px) {
.about {
 flex-direction: column;   /* stack text above image */
 text-align: center;
 padding: 20px;
}

.about-text {
 min-width: auto;          /* allow full shrink */
}

.about-text h2 {
 font-size: 1.6rem;
}
section h2{
  font-size: 1.6rem;
}


.about-text p {
 font-size: 0.95rem;
}

.about img {
 max-width: 100%;          /* make image scale to screen */
 margin-top: 20px;
}
}    
/* Services new Design start */
.services-section {
padding: 80px 20px;
background:#FFF;
}
.services-section p{
color: #000 !important;
text-align:left;
color:#FFF;
margin-bottom:40px;
}

.container-services {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
gap: 40px;
max-width: 1200px;
margin: 0 auto;
}

.service-card {
 background: #f9f9f9;
 text-align: left;
 padding: 30px 30px;
 border-radius: 20px;
 box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
 transition: all 0.3s ease;
 cursor: pointer;
 border: 1px solid #ddd;
}

.service-card:hover {
transform: translateY(-8px);
box-shadow: 0 6px 25px rgba(0, 0, 0, 0.1);
background: #f9f8ff;
}

.icon {
width: 80px;
height: 80px;
margin: 0 0 20px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
}

.icon img {
width: 35px;
height: 35px;
}

.service-card h3 {
font-size: 20px;
font-weight: 600;
color: #231b56ff;
margin-bottom: 15px;
}

.service-card p {
font-size: 15px;
line-height: 1.6;
color: #000;
}
/* Client Logo Start */
.logo-section {
text-align: center;
    padding: 80px 20px 120px;
 margin: auto;
 background: #FFF;
}

.logo-section h2 {
font-size: 2.2rem;
margin-bottom: 30px;
color: #3c308c;
}

.carousel-container {
position: relative;
width: 100%;
overflow: hidden;
border-radius: 12px;
background: #fff;
padding: 20px 0;
box-shadow: 0 6px 15px rgba(0, 0, 0, 0.1);
}

.carousel-track {
display: flex;
align-items: center;
gap: 60px;
}

.carousel-track img {
height: 80px;
object-fit: contain;
filter: grayscale(100%);
opacity: 0.8;
transition: transform 0.3s ease, filter 0.3s ease, opacity 0.3s ease;
}

.carousel-track img:hover {
filter: grayscale(0);
transform: scale(1.1);
opacity: 1;
}

/* Responsive */
@media (max-width: 768px) {
.carousel-track img {
 height: 60px;
}
}


/* End Client logo */



/* End New Services */



 /* --- Services --- */
 /* .services {padding:60px 0;background:#fff;}
 .service-grid {display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:30px;} */
 /* .service-card {background:#f1f1f1;padding:30px;border-radius:12px;text-align:center;transition:0.3s;} */
 /* .service-card:hover {background:#eaeaea;transform:translateY(-5px);} */
 /* .service-card h3 {margin-bottom:15px;color:#333;} */

 /* --- Portfolio --- */
 .portfolio {padding:80px 0; background:#f9f9f9;}
 .portfolio-grid {display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;}
 .portfolio-item {background:#fff;border-radius:10px;overflow:hidden;box-shadow:0 4px 12px rgba(0,0,0,0.1);}
 .portfolio-item img {width:100%;height:200px;object-fit:cover;}
 .portfolio-item p {padding:15px;font-size:0.95rem;color:#555;}

 
 /* --- Testimonials --- */
 .testimonials {padding:60px 0;background:#f1f1f1;}
 .testimonial-grid {display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:25px;}
 .testimonial {background:#fff;padding:25px;border-radius:10px;box-shadow:0 4px 12px rgba(0,0,0,0.08);}
 .testimonial p {font-size:0.95rem;color:#444;margin-bottom:15px;}
 .testimonial h4 {color:#6a11cb;}

 /* --- Contact --- */
 .contact {padding:80px 20px; background: #FFF;}
 form {max-width:600px;margin:auto;background: #f9f9f9;padding:30px;border-radius:10px;box-shadow:0 4px 20px rgba(0,0,0,0.1);}
 form input, form textarea {width:100%;padding:12px;margin-bottom:15px;border:1px solid #ccc;border-radius:6px;font-size:1rem;}
 form button {background:linear-gradient(135deg,#6a11cb,#2575fc);color:#fff;border:none;padding:12px 20px;border-radius:6px;font-weight:bold;cursor:pointer;transition:0.3s;}
 form button:hover {opacity:0.85;}
/* social icon */
.social{
  display:flex; 
  align-items:center; 
  gap:14px; 
  margin-top: 8px;
}
.social-icon{
  width: 50px;
  height: 50px;
  background:transparent;
  border: 1px solid #3c308c;
  border-radius: 50px;
}
.social-icon img{
  width: 20px;
  text-align: center;

}
.social-icon:hover{
  width: 50px;
  height: 50px;
  background:#3c308c;
  color: #FFF;  
  transition: cubic-bezier(0.075, 0.82, 0.165, 1);
}
/* End social icon*/



 /* --- Footer --- */
 footer {background:#3c308c;color:#ddd;padding:5px 0 5px;margin-top:0px;}
 .footer-container {display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:40px;}
 .footer-col h3 {color:#fff;margin-bottom:15px;}
 .footer-col ul {list-style:none;}
 .footer-col ul li {margin-bottom:10px;}
 .footer-col ul li a {color:#aaa;font-size:0.95rem;transition:0.3s;}
 .footer-col ul li a:hover {color:#fff;}
 .social-icons {margin-top:20px;}
 .social-icons a {margin-right:10px;font-size:1.2rem;color:#aaa;transition:0.3s;}
 .social-icons a:hover {color:#fff;}
 .footer-bottom {text-align:center;margin-top:0px;font-size:0.9rem;color:#FFF; background: #3c308c;}

/* download pdf start */
/* Responsive for the 2 columns — stacks on mobile */
.pdf-download-section {
    gap: 40px;
  }
  @media (max-width: 900px) {
    .pdf-download-section {
      flex-direction: column;
      gap: 24px;
    }
    .pdf-card {
      max-width: 100% !important;
    }
  }
  .btn:hover {
    opacity: 0.94;
    box-shadow: 0 2px 8px #3c308c13;
  }
  /* download pdf end */

  /* contact info start */
  @media (max-width: 800px) {
    .contact-flex {
      flex-direction: column;
      gap: 0 !important;
    }
    .contact-info, .contact-form-holder {
      max-width: 100% !important;
      min-width: 0 !important;
      flex: 1 1 100%;
      margin-bottom: 22px;
    }
  }
  @media (max-width: 500px) {
    .contact-info div { font-size: 15px !important; }
    .contact-info strong { font-size: 1em !important; }
  }

  /* End contact info */

 
  



/* Testimonails Start */
 :root {
--primary-text: #192a4e;
--secondary-text: #d4b754;
--white-text-white: #ffffff;
--black-text-black: #000000;
/* --gray-text: #464646;
 --light-white: #c8c8c8; */
}

/* .container {
width: 100%;

max-width: 1240px;
margin-left: auto;
margin-right: auto;
padding: 0 15px;
} */

.section-title {
color: var(--primary-text);
text-align: center;
font-family:'Segoe UI',Arial,sans-serif;
font-size: 40px;
font-weight: bold;
font-style: normal;
line-height: 48px;
position: relative;
margin-bottom: 52px;
}

.section-title::before,
.section-title::after {
content: "";
position: absolute;
left: 25%;
top: 22px;
width: 45px;
height: 2px;
background-color: var(--secondary-text);
}
.section-title::after {
left: unset;
right: 25%;
}
.testimonial-section {
background: #f1f1f1;
padding-top: 82px;
padding-bottom: 72px;
}

.swiper {
width: 100%;
height: 100%;
margin-left: auto;
margin-right: auto;
}

.swiper-slide {
text-align: center;
border-radius: 40px;
padding: 30px 23px;
background: var(--primary-text);
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
}

.swiper-slide img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
}

.swiper-pagination-bullet {
width: var(
 --swiper-pagination-bullet-width,
 var(--swiper-pagination-bullet-size, 15px)
);
height: var(
 --swiper-pagination-bullet-height,
 var(--swiper-pagination-bullet-size, 15px)
);
background: #d9d9d9;
background: #504b4b;
}

.swiper-horizontal > .swiper-pagination-bullets,
.swiper-pagination-bullets.swiper-pagination-horizontal,
.swiper-pagination-custom,
.swiper-pagination-fraction {
bottom: var(--swiper-pagination-bottom, -4px);
}

.swiper-pagination-bullet-active {
background: var(--primary-text);
}

.swiper.testimonial-wrapper {
padding-top: 59px;
padding-bottom: 60px;
}

.testimonial-items .testimonial-text {
color: var(--white-text-white);
text-align: center;
font-size: 16px;
font-family: "Outfit";
font-weight: normal;
font-style: normal;
max-width: 330px;
margin-bottom: 45px;
overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
line-clamp: 4;
-webkit-line-clamp: 4;
}

.testimonial-items .testimonial-title {
color: var(--white-text-white);
text-align: center;
font-size: 16px;
font-family: "Outfit";
font-weight: bold;
font-style: normal;
margin-bottom: 35px;
position: relative;
}

.testimonial-items .testimonial-title::before {
content: "";
position: absolute;
left: -23px;
top: 9px;
width: 20px;
height: 1px;
background-color: var(--white-text-white);
}

.testimonial-img {
position: relative;
width: 100px;
height: 100px;
height: 70px;
}

.testimonial-img::before {
content: "";
position: absolute;
left: 50%;
top: -50%;
transform: translate(-50%, -50%);
width: 100px;
height: 100px;
border-radius: 50%;
background-repeat: no-repeat;
background-position: center;
background-size: cover;
}

.testimonial-img.tm-img-1::before {
background-image: url(https://w7.pngwing.com/pngs/646/829/png-transparent-avatar-man-ico-icon-cartoon-little-boy-avatar-cartoon-character-png-material-child-thumbnail.png);
}

.testimonial-img.tm-img-2::before {
background-image: url(https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcS2IYhSn8Y9S9_HF3tVaYOepJBcrYcd809pBA&s);
}

.testimonial-img.tm-img-3::before {
background-image: url(https://png.pngtree.com/element_our/png/20181206/female-avatar-vector-icon-png_262142.jpg);
}

/* media query  */
@media screen and (min-width: 768px) {
.swiper-pagination-bullet {
 width: var(
   --swiper-pagination-bullet-width,
   var(--swiper-pagination-bullet-size, 24px)
 );
 height: var(
   --swiper-pagination-bullet-height,
   var(--swiper-pagination-bullet-size, 24px)
 );
}
.section-title::before,
.section-title::after {
 width: 141px;
}

/*   .section-title::before,
.section-title::after {
 left: 25%;
}
.section-title::after {
 right: 25%;
} */
}

 /* End Testimonails */




 /* --- Scroll to top --- */
 #topBtn {position:fixed;bottom:20px;right:20px;background:#3c308c;color:#fff;border:none;padding:10px 15px;border-radius:50%;font-size:18px;cursor:pointer;display:none;box-shadow:0 4px 10px rgba(0,0,0,0.2);}