.container{max-width:1200px}
.slick-dots{position:relative;bottom:-15px;display:flex!important;justify-content:center;align-items:center;gap:5px;margin-top:20px;padding-left:0;list-style:none}
.slick-dots li button{width:12px;height:12px;border:none;background:0 0;padding:0}
.slick-dots li button:before{content:'';display:block;width:12px;height:12px;border-radius:50%;background-color:#f1d90d;transition:all .3s ease}
.slick-dots li.slick-active button:before{width:28px;height:12px;border-radius:8px;background-color:#ec2024}
h2{color:#000;font-size:29px;font-weight:900}
/* ========= HERO SECTION ========= */
.hero-section {
  background-color: #f1f9fc;
 padding: 20px 0;
}

.hero-section .swiper-container {
  width: 100%;
  max-width: 100%;
  margin: 0 auto;
}

.hero-section .swiper-slide {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px 60px;
}

.hero-section .slide-content {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}

.hero-section .slide-content .slide-text {
  flex: 1;
  max-width: 50%;
  padding-right: 20px;
}

.hero-section .slide-content .slide-text h1 {
  font-size: 31px;
  color: #333;
  margin-bottom: 10px;
}

.hero-section .slide-content .slide-text p {
  margin: 10px 0;
  color: #555;
  font-size: 1.2rem;
}

.hero-section .slide-content .image {
  flex: 1;
  max-width: 50%;
  text-align: center;
}

.hero-section .slide-content .image img {
  max-width: 100%;
  height: auto;
  max-height: 400px;
  border-radius: 10px;
}

.hero-section .swiper-button-next,
.hero-section .swiper-button-prev {
  color: #000;
}

/* ========= FEATURES SECTION ========= */
.features {
  padding: 60px 20px 80px;
  background: #fff;
}

.features-row {
  position: absolute;
  bottom: -80px;
  left: 0;
  right: 0;
  display: flex;
  justify-content: center;
  gap: 20px;
  flex-wrap: wrap;
  z-index: 10;
}

.custom-card {
  padding: 20px;
  border-radius: 8px;
  transition: 0.3s ease-in-out;
  background: #fff;
  flex: 0 1 calc(25% - 20px); /* 4 cards on desktop */
  box-sizing: border-box;
}

.custom-card:hover {
  box-shadow: 0 6px 25px rgba(0, 0, 0, 0.12);
  transform: translateY(-4px);
}

.custom-card .feature-icon {
  font-size: 20px;
  color: #000;
  background: #fff;
  width: 30px;
  height: 30px;
  margin-bottom: 10px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.custom-card .custom-title {
  font-size: 15px;
  color: #000;
  font-family: Merriweather, serif;
  font-weight: 700;
  margin-bottom: 5px;
}

.custom-card p {
  font-size: 13px;
  line-height: 1.3;
}

.bg-blue {
  background-color: #eaf5ff;
  border-left: 5px solid #1a73e8;
}

.bg-yellow {
  background-color: #fff6e9;
  border-left: 5px solid #f4b400;
}

.bg-orange {
  background-color: #fff0e6;
  border-left: 5px solid #f57c00;
}

.bg-lightblue {
  background-color: #e6f7ff;
  border-left: 5px solid #00bcd4;
}

.btn-orange {
  background-color: #f5a623;
  color: #fff;
  padding: 10px 25px;
  border-radius: 8px;
  font-weight: 600;
  text-decoration: none;
}

.btn-orange:hover {
  background-color: #d48806;
  color: #fff;
}

/* ========= RESPONSIVE MEDIA QUERIES ========= */

/* Tablet (≤991px) */
@media (max-width: 991px) {
  .hero-section .swiper-slide {
    flex-direction: column;
    text-align: center;
    padding: 30px 20px;
  }

  .hero-section .slide-content {
    flex-direction: column;
    align-items: center;
  }

  .hero-section .slide-content .slide-text,
  .hero-section .slide-content .image {
    max-width: 100%;
    padding: 0;
  }

  .hero-section .slide-content .slide-text h1 {
    font-size: 26px;
  }

  .hero-section .slide-content .slide-text p {
    font-size: 1rem;
  }

  .features-row {
    position: relative;
    bottom: 0;
    justify-content: center;
    gap: 20px;
  }

  .custom-card {
    flex: 0 1 calc(50% - 20px); /* 2 cards per row */
  }
}

@media (max-width: 575px) {
  /* Hero Section Text Adjustments */
  .hero-section .slide-content .slide-text h1 {
    font-size: 18px; /* reduced heading size */
  }

  .hero-section .slide-content .slide-text p {
    font-size: 0.85rem; /* reduced paragraph size */
  }

  /* Hero Section Image Adjustments */
  .hero-section .slide-content .image img {
    max-height: 200px; /* reduced image height */
    border-radius: 8px;
  }

  .custom-card {
    flex: 0 1 100%; /* 1 card per row */
  }

  .features {
    padding: 40px 10px;
  }

  .hero-section .swiper-slide {
    padding: 20px 10px;
  }
}
.course-btn { 
  background-color: #fff;
  color: #ec2024;
  border: 2px solid #ec2024;
  padding: 10px 25px;
  font-size: 15px;
  font-weight: 600;
  text-transform: none;
  border-radius: 4px;
  text-decoration: none;
  transition: all 0.3s ease-in-out;
  max-width: 180px;
  display: inline-block;
  text-align: center;
}

/* Mobile Optimization */
@media (max-width: 767px) {
  .btn-group{margin-bottom: 20px;}
  .course-btn {
    padding: 5px 12px;
    font-size: 12px;
    max-width: 150px;
    
  }
}

.about-section{padding:60px 20px;background:#fff}
.about-section .about-row{display:flex;flex-wrap:wrap;gap:40px;align-items:center}
.about-right,.about-section .about-left{flex:1;min-width:200px}
.about-right p,.about-section .about-left{font-size:15px}
.about-section .img-stack{text-align:center}
.about-section .img-main{width:100%}
.about-section h2.title{text-transform:capitalize;color:#000;margin-bottom:25px;font-weight:900}
.about-section .subheading{font-size:17px;font-weight:700;margin-bottom:10px;color:#000}
.about-section .belief-icons{display:flex;gap:20px;font-size:15px;list-style:none;padding:0;margin-bottom:20px;border-bottom:1px solid #ccc;padding-bottom:10px}
.about-section .belief-icons li{color:#000;font-weight:500}
.about-section .expertise-title{margin-top:20px;font-weight:600;color:#0c0c0c}
.about-section .expertise-grid{display:flex;flex-wrap:wrap;gap:40px;margin-top:10px}
.about-section .expertise-grid ul{list-style:none;padding:0}
.about-section .expertise-grid li{font-size:14px;margin-bottom:7px;position:relative;padding-left:21px;color:#03c;font-weight:500}
.about-section .expertise-grid li::before{content:'✔';position:absolute;left:0;top:0;color:#ec2024;font-weight:700;font-size:16px;line-height:1}
@media (max-width:768px){
.about-section .about-row{flex-direction:column}
.about-section .img-main{transform:none;max-width:100%}
.about-section .belief-icons{flex-wrap:wrap}
}
.online-courses{padding:60px 20px;background:#fff}
.online-courses .course-card{border:1px solid #ddd;border-radius:10px;padding:10px;overflow:hidden;background-color:#fff;box-shadow:0 2px 8px rgba(0,0,0,.05);transition:.3s;text-decoration:none;margin:5px;display:block}
.online-courses .course-card:hover{box-shadow:0 4px 16px rgba(0,0,0,.1)}
.online-courses .course-card img{width:100%;height:220px;object-fit:cover;border-radius:12px}
.online-courses .course-tags{position:absolute;top:10px;left:0;right:0;display:flex;justify-content:space-between;padding:0 5px;z-index:3}
.online-courses .course-tag{background:#ffc107;color:#000;padding:2px 6px;font-size:11px;font-weight:600;border-radius:12px}
.online-courses .bg-dark.text-white{font-size:11px;background:#343a40!important;color:#fff!important}
.online-courses .course-body{padding:15px 0}
.online-courses .institution{font-size:11px;font-weight:600;color:#fff;background-color:#03c;display:inline-block;padding:2px 8px;border-radius:0 12px 12px 0;position:absolute;top:205px;left:-10px;z-index:2}
.online-courses .course-title-rating{display:flex;justify-content:space-between;align-items:center;margin-bottom:5px}
.online-courses .course-title{font-size:14px;font-weight:800;color:#000;flex:1;margin-right:10px;font-family:Merriweather,serif}
.online-courses .course-meta{font-size:14px;color:#222;margin-top:20px}
.online-courses .rating{font-size:.85rem;font-weight:500;color:#212529;white-space:nowrap}
.online-courses .rating span{background:#f1f3f5;border-radius:50px;padding:4px 10px;display:inline-block}
.online-courses .course-meta img{width:12px;height:12px;vertical-align:middle;margin-right:4px}
.online-courses .course-meta div{display:flex;align-items:center;gap:5px}
.online-courses .course-meta{justify-content:flex-start!important;gap:20px}
.explore-course{padding:60px 20px;background:#fff}
.explore-course .explore-nav{height:auto;display:flex;flex-direction:column;padding:20px 10px;border-radius:8px;background:#fff;box-shadow:0 10px 28px 0 rgba(0,0,0,.16),0 0 0 1px rgba(0,0,0,.06);border-bottom:4px solid #e89e26}
.explore-course .explore-nav .nav-pills .nav-link{color:#222;border-radius:5px;margin-bottom:5px;text-align:left;padding:10px 1px 10px 10px;font-weight:700;font-style:normal;font-size:15px;cursor:pointer;text-align:left;transition:background-color .3s ease}
.explore-course .explore-nav .nav-pills .nav-link.active{background-color:#03c;color:#fff}
.explore-course .explore-nav .nav-pills .nav-link:hover{background-color:#03c;color:#fff}
.explore-course .course-card{background:#fff;border-radius:.5rem;box-shadow:0 2px 8px rgb(0 0 0 / .1);overflow:hidden;text-align:center;transition:transform .3s ease;height:100%;display:flex;flex-direction:column;justify-content:space-between}
.explore-course .course-card:hover{transform:translateY(-5px);box-shadow:0 8px 20px rgb(13 59 115 / .3)}
.explore-course .course-card img{border-radius:15px;padding:10px;width:100%;height:120px;object-fit:cover}
.explore-course .course-card-body{padding:5px 0;flex-grow:1}
.explore-course .course-card-body .course-name{font-weight:800;margin-bottom:5px;color:#000;font-size:14px}
.explore-course .course-card-body .duration{color:#222;font-weight:600;font-size:11px}
.explore-course .read-more{background-color:#03c;color:#fff;padding:.4rem 0;font-weight:600;border-radius:0 0 .5rem .5rem;cursor:pointer;user-select:none;transition:background-color .3s ease;font-size:11px}
.explore-course .read-more:hover{background-color:#03c}
@media (max-width:767px){
.explore-course .explore-nav .nav-pills{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch}
.explore-course .explore-nav .nav-pills .nav-link{white-space:nowrap;margin-right:10px;margin-bottom:0;border-radius:1rem;padding:.5rem 1rem}
.explore-course .explore-nav{border-bottom:none;padding:10px}
}
.yangpoo-represents{padding:60px 20px;background:#fff}
.yangpoo-represents .logo-slider img{height:auto;max-width:100%;border:none;border-radius:0;box-shadow:none;margin:auto;display:block;padding:10px;object-fit:contain}
.experts-section{width:100vw;margin:0;padding:60px 20px;background-color:#062f57;background-image:url(../images/rightGuidence.webp);background-size:contain;background-repeat:no-repeat;background-position:right center;box-sizing:border-box;overflow-x:hidden;position:relative}
.expert-card{background-color:#fff;border-radius:16px;overflow:hidden;box-shadow:0 0 15px rgba(0,0,0,.08);height:100%;margin:5px;display:flex;flex-direction:column;justify-content:space-between}
.expert-card__image{position:relative;background-color:#fff;padding:10px}
.expert-card__image img{border-radius:15px;width:100%;height:auto;flex-shrink:0}
.expert-card__rating{position:absolute;top:10px;left:10px;background-color:#000;color:#fff;font-size:14px;font-weight:600;padding:4px 8px;border-top-left-radius:8px;border-bottom-left-radius:8px;display:flex;align-items:center}
.expert-card__rating svg{margin-right:4px}
.card-body{padding:19px;float:left;background-color:#fff}
.card-body h5{font-size:16px;font-weight:700;color:#0c0c0c;margin-bottom:6px;text-align:left}
.card-body p{color:#0c0c0c;text-align:left;font-size:14px;font-weight:400;margin-bottom:10px}
.card-body .badge{background:#cbe0ff;border-radius:16px;padding:7px 12px;margin-bottom:6px;color:#0c0c0c;font-weight:500;font-size:14px;float:left}
.media-box{border:1px solid #eee;border-radius:5px;background-color:#fff;transition:transform .3s,box-shadow .3s;height:100%;display:flex;align-items:center;justify-content:center}
.media-box:hover{transform:scale(1.05);box-shadow:0 4px 12px rgba(0,0,0,.1)}
.media-logo{max-height:105px;object-fit:contain}
@media (min-width:768px){
.col-md-2-4{flex:0 0 auto;width:20%}
}