:root {
  --primary-green: #2f9a57;
  --hover-green: #248047;
  --dark-text: #111111;
  --muted-text: #373737;
  --light-bg: #e6f4ea;
  --main-padding:35px;
  --main-black:#000;

  --brand-green: #eef9f1;
  --brand-border: #d1e7d6;
  --text-dark: #212529;
  --card-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
  --bg-light: #f9f9f9;
  --bg: #f3f3f3;
  --text: #111111;
 --muted: #2f2f2f;
   --green: #339a54;
  --green-dark: #1d5f35;
  --green-soft: #e8f4ea;
  --green-border: #4aa569;
  --btn-shadow: #1b5b31;
  --radius-xl: 2rem;
  --accent-green: #2e9651;
        --text-dark: #000000;
        --text-muted: #4a4a4a;
        --card-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
  --setfontsize:20px;
  --month-bar:#E2F8E9;
}

body {
  margin: 0;
  font-family: "SF Pro Display", sans-serif;
  color: var(--dark-text);
  overflow-x: hidden; /* Prevents horizontal scroll on mobile */
}

    /* --- Shared Components --- */
    .highlight { color: var(--primary-green); }
    
    .btn-main {
      background: var(--primary-green);
      color: #fff;
      border-radius: 12px;
      padding: 16px 40px;
      font-weight: 700;
      text-decoration: none;
      display: inline-block;
      border: none;
      box-shadow: 0 4px 0 #1e6b3c;
      transition: all 0.2s;
    }
    .btn-main:hover { transform: translateY(-2px); color: #fff; background: var(--hover-green); }

    /* --- Navbar --- */
    .navbar-brand { font-weight: 700; font-size: 1.5rem; color: #000; }
    .btn-apply-nav {
      background: var(--primary-green);
      color: #fff;
      border-radius: 10px;
      padding: 8px 20px;
      font-weight: 600;
    }

    /* --- Section 1: Hero --- */

    .hero-section {
      background-color: #e6f4ea; 
      /*min-height: 90vh;*/
      align-items: center;
      padding-top: 60px;
      background-image: url('image/Rectangle.png');
      background-size: cover;
      background-repeat: no-repeat;
      border: none !important;
      background-blend-mode: overlay;
      border-radius: 0;
      opacity: 1;
      position: relative;

    }
    .hero-title {
      font-size: clamp(2.5rem, 5vw, 3.5rem);
      width: 600px;
      line-height: 1.1;
      font-family: "SF Pro Display", -apple-system, BlinkMacSystemFont, sans-serif;
      font-size: 40px;
      font-weight: 700; /* Bold */
      letter-spacing: 0.02em; /* Converted from 2% */
      text-align: left; /* Based on the Alignment icons */
      opacity: 1; /* 100% */
      color: #000000; 
      -webkit-text-stroke: 1px #000000;

    }
    .hero-desc {
      color: var(--muted-text);
      font-weight: 500;
      /* Font Family & Weight */
      font-family: "SF Pro Display", sans-serif;
      
      /* Size & Spacing */
      /* Color & Alignment */
      color: #000000;
      text-align: left;
      
      /* Appearance */
      opacity: 100%;



    }
    .feature-list { list-style: none; padding: 0; margin-bottom: 35px; }
    .feature-list li {
      font-weight: 600;
      margin-bottom: 10px;
      display: flex;
      align-items: center;
      gap: 10px;
    }
    .feature-list i { color: #000; font-weight: 900; }

    .stats-row { display: flex; gap: 30px; margin-bottom: 20px; flex-wrap: wrap; }
    .stat-box {
     display: flex; 
     align-items: center; 
     gap: 5px; 
     max-width: 215px; 
     padding-right: 20px; /* Space before the line */
  border-right: 1.5px solid #000; /* The vertical line */
   }
   .stat-box:last-child {
  border-right: none;
  padding-right: 0;
}
    .stat-text { font-weight: 600;
  font-size: 1rem;
  line-height: 1.2;
  max-width: 200px; /* Keeps text wrapped like your image */ }
    .stat-icon { font-size: 1.5rem;
    width: 40px; /* Adjust based on your icons */
  height: auto;
  margin-right: 10px; }

    .hero-person-img { width: 100%; height: auto; max-width: 650px; }

    /* --- Section 2: Introducing --- */
    .intro-section { padding: var(--section-padding); background: #fff; }
    .intro-img { border-radius: 20px; width: 100%; box-shadow: 0 20px 40px rgba(0,0,0,0.05); }
    .intro-label { font-weight: 800; font-size: 1.8rem; margin-bottom: 5px; }
    .intro-title { font-weight: 800; font-size: 2.2rem; margin-bottom: 25px; }

    /* --- Section 3: Growth --- */
    .growth-section { padding: var(--section-padding); background: #F7F7F7; }


    .growth-section .container {
    max-width: 1200px; /* Adjust this number to control the total width */
    padding-left: 15px;
    padding-right: 15px;
}

 
    .growth-list li { margin-bottom: 12px; font-weight: 500; display: flex; align-items: flex-start; gap: 10px; }
    .growth-list li::before { content: "•"; color: #000; font-weight: bold; }

    /* --- Section 4: Benefits Grid --- */
    .benefits-section { padding: var(--main-padding); background: #fff; }
    .benefit-card {
      background: #f4f4f4;
     
      border-radius: 5px;
      height: 100%;
      transition: transform 0.3s ease;
    }
    .benefit-icon { font-size: 2rem; margin-bottom: 20px; }
    
    .benefit-card p { color: var(--muted-text); font-size: 1rem; margin: 0; }

   

  .problem-box {
  display: flex;
  flex-wrap: wrap; /* Allows wrapping on smaller screens */
  background-color: #d4f9d8; /* Light green background from image */
  border-radius: 10px;
  padding: 20px;
  margin-top: 20px;
  align-items: center;
  justify-content: space-between;
}
    .problem-item {
  display: flex;
  align-items: center;
  font-weight: 500;
  font-size: 1.1rem;
  padding: 0 15px;
  flex: 1;
  position: relative;
}

/* Creating the vertical divider line */
.problem-item:not(:last-child)::after {
  content: "";
  position: absolute;
  right: 0;
  top: 10%;
  height: 80%;
  width: 1px;
  background-color: #333; /* Dark color for the divider */
}


.problem-item i {
  font-size: 2rem; /* Larger icons as per image */
  margin-right: 15px;
  color: #000;
}

/* Responsive fix: remove lines on mobile when items stack */
@media (max-width: 768px) {
  .problem-item:not(:last-child)::after {
    display: none;
  }
  .problem-item {
    flex: 0 0 100%;
    margin-bottom: 15px;
  }
}






    /* --- Income Section (Image 2) --- */
    .income-card {
      border-left: 5px solid var(--primary-green);
      background: #fff;
      box-shadow: 0 10px 30px rgba(0,0,0,0.05);
      padding: 30px;
      border-radius: 15px;
      margin-bottom: 25px;
    }

    /* --- Curriculum Section (Image 3) --- */
  
    
    .placement-support { background: #e8f5e9; padding: 25px; display: flex; align-items: center; gap: 15px; }
    .month-bar {
      background: var(--light-mint);
      padding: 20px 30px;
      border-radius: 10px;
      margin-top: 15px;
      display: flex;
      justify-content: space-between;
      align-items: center;
      font-weight: 600;
      cursor: pointer;
    }

    /* --- Theory Section (Image 4) --- */
    .theory-container {
      background: #fff;
      border-radius: 20px;
      padding: 50px;
      box-shadow: 0 10px 40px rgba(0,0,0,0.05);
    }
    .theory-box {
      border: 1px solid #eee;
      border-radius: 15px;
      padding: 30px;
      text-align: center;
      height: 100%;
    }
    .theory-box img { max-width: 150px; margin-bottom: 20px; }


.stat-icon {
  width: 32px; /* Scaled to match the text height */
  opacity: 1; /* From Appearance panel in image_5a43fa.png */
}





/* Typography based on image_57f27f.jpg */
.intro-label {
  font-size: 28px;
  line-height: normal; /* "Auto" in design tools */
  font-weight: bold;   /* Common for 'HEADING' styles */
  opacity: 1;          /* 100% Opacity */
  border-radius: 0;    /* Corner radius: 0 */
  text-align: left;    /* Based on the active alignment icon */
  vertical-align: top; /* Based on the active vertical alignment icon */

}

.intro-title {
    font-size: 28px;
  line-height: normal; /* "Auto" in design tools */
  font-weight: bold;   /* Common for 'HEADING' styles */
  opacity: 1;          /* 100% Opacity */
  color: #2f9a57; /* Target Green Color */
  text-align: left;    /* Based on the active alignment icon */
  vertical-align: top; /* Based on the active vertical alignment icon */
}


.intro-text p {
  line-height: 1.5;
  margin-bottom: 15px;
}
.intro-text{
  text-align: left;
}
/* The Bold Green Sentence */
.highlight-text {
  color: #2f9a57 !important;
  font-weight: 700;
  font-size: 20px;
  letter-spacing: 0.02;
  margin-top: 20px;
  text-align: left;
}
.set10p{
  font-size: 20px;
}





/* Section Padding */
.growth-section {
  padding: 60px 0;
  background-color: #f9f9f9; /* Light grey background like the image */
  font-family: 'Inter', sans-serif; /* A clean modern font */
}

/* Title Styling */
.growth-title {
  font-weight: 800;
  font-size: 26px;
  color: #111;
  margin-bottom: 25px;
  line-height: normal; /* "Auto" in design tools */
  font-weight: bold;   /* Common for 'HEADING' styles */
  opacity: 1;          /* 100% Opacity */
}

.growth-title .highlight {
  color: #28a745; /* The signature green color */
}

/* Paragraphs */
.description, .footer-text {
  color: #000;
  line-height: 1.3;
  font-size: 1.1rem;
  margin-bottom: 20px;
}

.list-heading {
  font-weight: 700;
  margin-top: 30px;
  margin-bottom: 15px;
}

/* Custom Bullet Points */
.growth-list {
  list-style: none;
  padding-left: 0;
  margin-bottom: 30px;
  line-height: 1;
}

.growth-list li {
  position: relative;
  padding-left: 25px;
  margin-bottom: 10px;
  font-weight: 500;
  font-size: 1.1rem;
}

.growth-list li::before {
  content: "•";
  color: #000;
  font-weight: bold;
  display: inline-block; 
  width: 1em;
  margin-left: -1em;
}

/* Image Spacing & Responsiveness */
.image-container {
  padding: 10px;
}





/* Container for the cards */
.benefits-section {
    padding: 60px 0;
    background-color: #ffffff;
}

/* Base card design */
.benefit-card {
    background-color: #f0f0f0; /* Light gray from your image */
    padding: 18px;
    
   
    
    display: flex;
    flex-direction: column;
    border: none;
}

/* Icon and Heading Alignment */
.benefit-card h4 {
    font-weight: 700;
    font-size: 1.25rem;
}

.benefit-icon {
    font-size: 2rem;
    margin-bottom: 15px;
    color: #333;
}
.seth4line{
  margin-top: 10px;
}

/* Hover Effect: Green background */
.benefit-card:hover {
    background-color: #a3e4b8; /* The green color from your image */
    
}

/* Ensure text stays readable on hover if needed */
.benefit-card:hover h4, 
.benefit-card:hover p, 
.benefit-card:hover i {
    color: #000; 
}



.problem-section{
  background: #E2F8E9;
}


/* toggle section css */

/* Stats Card Styling */
        .curriculum-card {
            align-items: center;
            background: white;
            justify-content: space-between;
            border-radius: 15px;
            box-shadow: 0 4px 15px rgba(0,0,0,0.05);
            text-align: center;
            flex-wrap: wrap;
            gap: 20px;
        }

        .curriculum-stat {
            flex: 1;
            min-width: 100px;
        }

        .placement-support {
            display: flex;
            align-items: center;
            gap: 15px;
            padding-left: 20px;
            border-left: 1px solid #eee;
            text-align: left;
        }

        /* Accordion / Month Bar Styling */
        .month-bar {
            background-color: var(--month-bar);
            border: 1px solid var(--brand-border);
            border-radius: 12px;
            padding: 18px 25px;
            margin-top: 15px;
            cursor: pointer;
            display: flex;
            justify-content: space-between;
            align-items: center;
            transition: all 0.3s ease;
            text-decoration: none !important;
            color: var(--text-dark) !important;
            font-weight: 500;
        }

        .month-bar:not(.collapsed) {
            border-bottom-left-radius: 0;
            border-bottom-right-radius: 0;
        }

        .month-content {
            border: 1px solid #eee;
            border-top: none;
            border-bottom-left-radius: 12px;
            border-bottom-right-radius: 12px;
            padding: 25px;
            background: white;
        }

        /* Icon Rotation */
        .month-bar i {
            transition: transform 0.3s ease;
            font-size: 1.2rem;
        }
        
        .month-bar:not(.collapsed) i {
            transform: rotate(180deg);
        }

        .btn-main {
           
            color: #fff;
            padding: 12px 30px;
            border-radius: 8px;
            font-weight: 600;
            transition: 0.3s;
        }

        .btn-main:hover {
            background: #333;
            color: #fff;
        }

       


        .feature-card {
    background-color: #ffffff;
    border-color: #e9ecef !important;
  }
  
  .card-highlight-header {
    background-color: transparent; /* Adjust if you want the very top to be different */
  }

  .highlight-box {
    background-color: #e8f5e9; /* Light green background from image */
    border: 1px solid rgba(0,0,0,0.05);
  }

  /* Ensuring icons look consistent */
  .bi-check2 {
    font-weight: 700 !important;
  }



.sizepara{
  font-size: 17px;
}
.sizepara1{
  font-size: 18px;
}
.setleftsize{
  padding-left: 32px;
}
.setcheckbold li i{
  /*font-weight: inherit !important;*/
}
.setfontsize{
  font-size: 20px;
}


.bi-check2::before{
  font-weight: bolder !important;
    font-size: 22px;
    color: black;
}

  .team-section { padding: 60px 0; background-color: #F7F7F7; }
        .member-card {
            background: #fff;
            border: 1px solid #eee;
            border-radius: 20px;
            padding: 15px;
            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
            height: 100%;
        }
        .member-img-wrapper {
            width: 100%;
            aspect-ratio: 1 / 1;
            overflow: hidden;
            border-radius: 15px;
            margin-bottom: 15px;
        }
        .member-img-wrapper img { width: 100%; height: 100%; object-fit: cover; }

        /* Experience Section Styles (from image_3b533f.jpg) */
        .experience-section { padding: 40px 0 80px; background-color: #fff; }
        
        .partner-link {
            color: #2d8a4e;
            text-decoration: underline;
            font-size: 0.9rem;
            word-break: break-all;
        }

        .experience-grid-container {
            background-color: #a8e6cf; /* Light green background */
            border-radius: 15px;
            border: 1px solid #95d5bb;
            overflow: hidden;
        }

        .stat-box1 {
            padding: 30px 15px;
            text-align: center;
            border-right: 1px solid #8ecba6;
            height: 100%;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
        }

        .stat-box1:last-child { border-right: none; }

        .stat-box1 i { font-size: 2rem; margin-bottom: 15px; color: #000; }
        .stat-text { font-size: 0.95rem; font-weight: 600; line-height: 1.3; color: #000; }

        .btn-apply {
            background-color: #2d8a4e;
            color: white;
            padding: 12px 40px;
            border-radius: 10px;
            font-weight: 700;
            border: none;
            box-shadow: 0 4px 15px rgba(45, 138, 78, 0.3);
            transition: 0.3s;
        }
        .btn-apply:hover {
            background-color: #246e3e;
            color: white;
            transform: translateY(-2px);
        }

        


        .course-section {
      min-height: 100vh;
      padding: 56px 0 40px;
      display: flex;
      align-items: center;
    }

    .left-panel {
      padding-right: 28px;
      text-align: center;
    }

    .main-title {
      
      font-weight: 600;
      line-height: 1.08;
      max-width: 470px;
      margin-bottom: 40px;
    }

    .brand-wrap {
      max-width: 340px;
      margin: 0 auto 44px;
    }

    .google-ads-logo {
      width: 240px;
      height: 240px;
      margin: 0 auto 10px;
      position: relative;
    }

    .logo-blue,
    .logo-yellow {
      position: absolute;
      border-radius: 999px;
      transform-origin: center;
    }

    .logo-blue {
      width: 80px;
      height: 235px;
      background: #4285f4;
      top: 8px;
      right: 48px;
      transform: rotate(-30deg);
    }

    .logo-yellow {
      width: 72px;
      height: 188px;
      background: #fbbc04;
      left: 56px;
      top: 36px;
      transform: rotate(30deg);
    }

    .logo-green {
      width: 78px;
      height: 78px;
      background: #34a853;
      border-radius: 50%;
      position: absolute;
      left: 30px;
      bottom: 14px;
      z-index: 2;
    }

    .brand-name {
      text-align: center;
      font-size: clamp(2rem, 3vw, 3.7rem);
      line-height: 1;
      font-weight: 400;
      color: #787878;
      letter-spacing: -0.04em;
    }

    .brand-name span {
      color: #7f7f7f;
      font-weight: 300;
    }

    .apply-btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-width: 340px;
      min-height: 78px;
      border-radius: 14px;
      background: var(--green);
      color: #fff;
      text-decoration: none;
      font-size: 1.1rem;
      font-weight: 700;
      box-shadow: 0 4px 0 var(--btn-shadow);
      transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
    }

    .setfontsize{
      font-size: var(--setfontsize);
      font-weight: 500;
    }

    .apply-btn:hover {
      transform: translateY(-2px);
      box-shadow: 0 6px 0 var(--btn-shadow);
      background: #2f8d4d;
      color: #fff;
    }

    .apply-btn:active {
      transform: translateY(2px);
      box-shadow: 0 2px 0 var(--btn-shadow);
    }

    .steps-wrapper {
      position: relative;
      padding-left: 12px;
    }

    .step-card {
      position: relative;
      
      border: 2px dashed var(--green-border);
      border-radius: 30px;
      padding: 26px 34px 22px;
      max-width: 780px;
      margin-bottom: -2px;
    }

    .step-card:nth-child(odd) {
      margin-right: 110px;
      background: linear-gradient(to right, #f0f9f4, #ffffff);
      border-right: none;
  border-top-right-radius: 0;
  z-index: 999;
  border-bottom-right-radius: 0;
  margin-right: 50px; /* Gap for the next curve */
    }

    .step-card:nth-child(even) {
      margin-left: 56px;
      background: linear-gradient(to left, #f0f9f4, #ffffff);
      border-left: none;

  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  margin-left: 50px; /* Gap for the previous curve */
    }

  

    .step-card::after {
      content: "";
      position: absolute;
      width: 0;
      height: 0;
      border-top: 12px solid transparent;
      border-bottom: 12px solid transparent;
      right: 50%;
      transform: translateX(50%);
      bottom: -14px;
      border-left: 12px solid #111;
      z-index: 9999;
    }

    .step-card:last-child::after {
      display: none;
    }

    .step-top {
      display: flex;
      align-items: flex-start;
      gap: 20px;
    }

    .icon-box {
      width: 56px;
      min-width: 56px;
      display: flex;
      align-items: center;
      justify-content: center;
      color: #000;
      margin-top: 2px;
    }

    .icon-box svg {
      width: 40px;
      height: 40px;
      fill: currentColor;
    }

    .step-content h3 {
      margin: 0 0 8px;
      line-height: 1.1;
      font-weight: 600;
      color: #000;
    }

    .step-content p {
      margin: 0;
      font-size: clamp(1rem, 1.2vw, 1.25rem);
      line-height: 1.35;
      color: #161616;
      max-width: 580px;
    }

    













   

        .section-title {
            font-weight: 800;
            color: var(--text-dark);
            font-size: 2rem;
        }

        .section-subtitle {
            max-width: 700px;
            margin: 0 auto;
            color: var(--text-dark);
            font-size: 1.05rem;
            line-height: 1.5;
        }

        /* Testimonial Card Styling */
        .story-card {
            background: #fff;
            border-radius: 20px;
            overflow: hidden;
            box-shadow: var(--card-shadow);
            border: none;
            border-bottom: 4px solid var(--accent-green); /* The green accent at bottom */
            display: flex;
                height: 350px;
            transition: transform 0.3s ease;
        }

        .story-card:hover {
            transform: translateY(-5px);
        }

        .story-image-wrapper {
            width: 40%;
            min-height: 350px;
            overflow: hidden;
        }

        .story-image-wrapper img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            object-position: center;
        }

        .story-text-wrapper {
            width: 60%;
            padding: 35px 30px;
            display: flex;
            flex-direction: column;
            justify-content: center;
        }

        .person-name {
            font-weight: 800;
            font-size: 1.5rem;
            margin-bottom: 15px;
            color: var(--text-dark);
        }

        .person-bio {
            font-size: 16px;
            line-height: 1.6;
            margin-bottom: 0;
        }

       









        .flex-schedule-area {
            background-color: #ffffff;
            padding: 80px 0;
            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
        }

      

        .flex-description-top {
            font-size: 17px;
            line-height: 1.5;
            margin-bottom: 30px;
        }

        /* Custom Checklist Styling */
        .flex-checklist {
            list-style: none;
            padding: 0;
            margin-bottom: 30px;
        }

        .flex-checklist-item {
            display: flex;
            align-items: center;
            font-weight: 600;
            font-size: 1.1rem;
            margin-bottom: 12px;
            color: #000;
        }

        .flex-checklist-item i {
            color: #000;
            font-size: 0.9rem;
            margin-right: 15px;
        }

        .flex-description-bottom {
            
            font-size: 1.1rem;
           
        }

        /* Call to Action Button */
        .flex-btn-apply {
            background-color: #2e9651;
            color: white;
            border: none;
            padding: 12px 35px;
            border-radius: 10px;
            font-weight: 700;
            font-size: 1.1rem;
            transition: all 0.3s ease;
            box-shadow: 0 4px 6px rgba(0,0,0,0.1);
        }

        .flex-btn-apply:hover {
            background-color: #247a41;
            color: white;
            transform: translateY(-2px);
            box-shadow: 0 6px 12px rgba(0,0,0,0.15);
        }

        /* Image Responsiveness */
        .flex-illustration-wrap img {
            max-width: 100%;
            height: auto;
        }

        









        .career-section {
      padding: 70px 0 80px;
      background: #F7F7F7;
    }

    .career-title {
     
      font-weight: 700;
      color: #111;
     
    }

    .career-subtitle {
      font-size: 18px;
      color: #222;
      max-width: 760px;
      margin: 18px auto 0;
      line-height: 1.7;
    }

    .concern-row {
      margin-top: 70px;
      row-gap: 35px;
    }

    .concern-item {
      display: flex;
      align-items: flex-start;
      gap: 18px;
      max-width: 100%;
    }

    .question-icon {
      min-width: 48px;
      width: 48px;
      height: 48px;
      border-radius: 50%;
      background: #2e9b56;
      color: #fff;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 28px;
      font-weight: 700;
      box-shadow: 0 0 0 4px #d8f3df;
      line-height: 1;
      margin-top: 3px;
    }

    .concern-text {
      font-size: 18px;
      color: #111;
      line-height: 1.5;
      margin: 0;
    }

    .valid-concerns {
      text-align: center;
      font-size: 28px;
      font-weight: 500;
      color: #111;
      margin-top: 55px;
      margin-bottom: 45px;
    }

    .info-box {
      background: #E2F8E9;
      padding: 34px 38px;
      border-radius: 2px;
      max-width: 1150px;
      margin: 0 auto;
    }

    .info-box p {
      margin: 0;
      text-align: center;
      font-size: 18px;
      line-height: 1.7;
      color: #111;
    }

    .apply-btn-wrap {
      text-align: center;
      margin-top: 42px;
    }

    .apply-btn {
      background-color: #2e9650;
      color: #fff;
      font-size: 20px;
      font-weight: 700;
      border: none;
      padding: 18px 42px;
      border-radius: 12px;
      min-width: 300px;
      transition: 0.3s ease;
      box-shadow: 0 4px 0 #1f6d39;
    }

    .apply-btn:hover {
      background-color: #257b42;
      color: #fff;
      transform: translateY(-2px);
    }

    .apply-btn:active {
      transform: translateY(0);
    }





/*student use skill*/
/* Unique Custom Styles */
        .skill-paths-section {
            padding: 80px 0;
            background-color: #ffffff;
        }

        .path-main-title {
            
            color: #000;
        }

        .path-sub-text {
            font-size: 1.1rem;
            color: #333;
            max-width: 700px;
            margin: 0 auto 50px auto;
        }

        /* The Light Green Cards */
        .skill-path-card {
            background-color: #f0f9f1; /* Light green background from image */
            border-radius: 16px;
            padding: 20px;
            border: none;
            transition: transform 0.3s ease;
            height: -webkit-fill-available;
            border: 1px solid #E6E4E4;
        }

        .skill-path-card:hover {
            transform: translateY(-5px);
        }

        .path-label {
            font-weight: 700;
            font-size: 1.25rem;
            margin-bottom: 12px;
            display: block;
        }

        .path-description {
            font-size: 1.05rem;
            line-height: 1.5;
            color: #222;
            margin-bottom: 0;
        }

        /* Bottom List Section */
        .path-notes-list {
            list-style: none;
            padding-left: 0;
            margin-top: 40px;
        }

        .path-notes-list li {
            position: relative;
            padding-left: 25px;
            margin-bottom: 15px;
            font-weight: 700; /* As seen in image */
            font-size: 1rem;
            line-height: 1.4;
        }

        /* Custom Bullet Points */
        .path-notes-list li::before {
            content: "•";
            position: absolute;
            left: 0;
            font-size: 1.5rem;
            line-height: 1;
            color: #000;
        }

       /* Custom Unique Design Classes */
        .theory-p-section {
          
            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
            border-top: 1px solid #E6E4E4;
            border-bottom: 1px solid #E6E4E4;
        }

        .theory-p-illustration {
            max-width: 100%;
            height: auto;
            display: block;
            margin: 0 auto;
        }

        .theory-p-content-box {
            padding-left: 20px;
        }

        .theory-p-feature-title {
           
            color: #000;
            margin-bottom: 25px;
        }

        .theory-p-list {
            list-style: none;
            padding-left: 0;
            margin-bottom: 25px;
        }

        .theory-p-list li {
            position: relative;
            padding-left: 25px;
            margin-bottom: 6px;
            font-size: 1.1rem;
          
            line-height: 1.4;
        }

        /* Custom Bullet Point Styling */
        .theory-p-list li::before {
            content: "•";
            position: absolute;
            left: 0;
            font-weight: bold;
            font-size: 1.5rem;
            line-height: 1;
            color: #000;
        }

        .theory-p-goal-text {
            font-size: 1.15rem;
            color: #000;
            margin-bottom: 30px;
        }

        /* Call To Action Button */
        .theory-p-btn-apply {
            background-color: #3ea05d; /* Green color from image */
            color: white;
            padding: 12px 35px;
            font-size: 1.1rem;
            font-weight: 600;
            border-radius: 8px;
            border: 2px solid #2d7a46;
            text-decoration: none;
            display: inline-block;
            transition: all 0.3s ease;
        }

        .theory-p-btn-apply:hover {
            background-color: #2d7a46;
            color: white;
            transform: translateY(-2px);
            box-shadow: 0 4px 12px rgba(0,0,0,0.15);
        }

        /* Unique Custom Styles */
        .program-target-section {
            padding: 60px 0;
            background-color: #F7F7F7;
            font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
        }

        .program-target-title {
            font-size: 2rem;
            color: #000000;
        }

        .program-target-subtitle {
            font-size: 1.1rem;
           
            margin: 0 auto 40px auto;
        }

        /* Card Styling */
        .program-target-card {
            background-color: #f0fbf4; /* Light green tint from image */
            border: 1px solid #e0eee5;
            border-radius: 12px;
            padding: 24px;
            height: 100%;
            display: flex;
            align-items: flex-start;
            transition: transform 0.2s ease;
        }

        .program-target-card:hover {
            transform: translateY(-3px);
            box-shadow: 0 4px 15px rgba(0,0,0,0.05);
        }

        .program-target-icon {
            font-size: 1.4rem;
            color: #000000;
            margin-right: 15px;
            line-height: 1;
        }

        .program-target-text {
            font-size: 1.05rem;
            line-height: 1.4;
            color: #000000;
            margin: 0;
            font-weight: 500;
        }

        /* Footer Elements */
        .program-target-footer-text {
            font-size: 1.1rem;
            font-weight: 500;
            margin-top: 40px;
        }

        .program-target-btn {
            background-color: #34a853; /* Success green */
            color: white;
            padding: 14px 40px;
            font-size: 1.2rem;
            font-weight: 600;
            border: none;
            border-radius: 8px;
            margin-top: 25px;
            transition: background 0.3s ease;
        }

        .program-target-btn:hover {
            background-color: #2d8e47;
            color: white;
        }
/* Main Section & Background */
        .batch-promo-section {
            background-color: #e8f7ee; /* Fallback light green */
            background-image: url('image/Rectangle.png'); /* Your Grid/Square image */
            background-repeat: repeat;
            padding: 80px 0;
            font-family: 'Inter', sans-serif;
            background-size: cover;
    background-blend-mode: overlay;
        }

        /* Left Pricing Card */
        .batch-promo-pricing-card {
            background: #ffffff;
            border: 2px dotted #000000;
            border-radius: 25px;
            padding: 40px;
            height: 100%;
        }

        .batch-promo-regular-price {
            font-size: 1.1rem;
            color: #333;
            margin-bottom: 20px;
        }

        .batch-promo-launch-title {
            font-size: 2.2rem;
            font-weight: 800;
            margin-bottom: 5px;
        }

        .batch-promo-launch-price {
            font-size: 2.5rem;
            font-weight: 800;
            color: #000;
        }

        .batch-promo-strike {
            text-decoration: line-through;
            color: #444;
            font-size: 1.8rem;
            margin-left: 10px;
        }

        .batch-promo-btn {
            background-color: #2d9453;
            color: white;
            border: none;
            border-radius: 10px;
            padding: 15px 30px;
            font-weight: 700;
            width: 100%;
            font-size: 1.2rem;
            margin-top: 25px;
            transition: transform 0.2s ease;
        }

        .batch-promo-btn:hover {
            background-color: #247a44;
            color: white;
            transform: scale(1.02);
        }

        /* Right Content Column */
        .batch-promo-feature-title {
            font-size: 26px;
    font-weight: 600;
        }

        .batch-promo-item {
            background: #ffffff;
            border-radius: 12px;
            padding: 15px 20px;
            display: flex;
            align-items: center;
            margin-bottom: 15px;
            border: 1px solid #e0e0e0;
        }

        .batch-promo-icon-box {
            width: 40px;
            font-size: 1.5rem;
            margin-right: 15px;
            text-align: center;
        }

        /* Countdown Timer */
        .batch-promo-timer-container {
            display: flex;
            gap: 15px;
            margin-top: 20px;
        }

        .batch-promo-timer-box {
            background: white;
            border: 1px solid #333;
            border-radius: 10px;
            width: 70px;
            height: 70px;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
        }

        .batch-promo-timer-num {
            font-size: 1.5rem;
            font-weight: 800;
            line-height: 1;
        }

        .batch-promo-timer-label {
            font-size: 0.8rem;
            font-weight: 600;
        }

        /* Footer Text */
        .batch-promo-footer-text {
            font-size: 1.2rem;
            margin-top: 30px;
        }

    .setboxspace{
      justify-content: space-between;
    }

    .font-box-size{
      width: 85%;
    }

/* Unique Custom Styles */
        .step-flow-section {
            padding: 80px 0;
            background-color: #F7F7F7; /* Very light background tint */
        }

        .step-flow-title {
            font-size: 2rem;
            color: #000;
            margin-bottom: 50px;
        }

        /* Connecting Dashed Line */
        .step-flow-container {
            position: relative;
        }

        /* The blue dashed line - only visible on desktop (lg and up) */
        @media (min-width: 992px) {
            .step-flow-line {
                position: absolute;
                top: 50%;
                left: 10%;
                right: 10%;
                border-top: 2px dashed #1a237e; /* Dark blue dashed line */
                z-index: 1;
                transform: translateY(-50%);
            }
        }

        /* Card Styling */
        .step-flow-card {
            background: #ffffff;
            border-radius: 16px;
            padding: 25px 20px;
            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
            display: flex;
            align-items: center;
            position: relative;
            z-index: 2; /* Sits above the dashed line */
            height: 100%;
            transition: transform 0.3s ease;
            border: 1px solid #f0f0f0;
        }

        .step-flow-card:hover {
            transform: translateY(-5px);
        }

        /* Circular Number Styling */
        .step-flow-number {
            background-color: #eaf8ef; /* Light green circle */
            color: #000;
            font-weight: 800;
            font-size: 1.5rem;
            width: 60px;
            height: 60px;
            min-width: 60px;
            display: flex;
            align-items: center;
            justify-content: center;
            border-radius: 50%;
            margin-right: 20px;
        }

        .step-flow-text {
            font-size: 1.1rem;
            font-weight: 500;
            color: #333;
            margin: 0;
            line-height: 1.3;
        }

        /* Bottom Section Styles */
        .step-flow-info-text {
            font-size: 1.1rem;
            color: #111;
            margin-top: 50px;
            margin-left: auto;
            margin-right: auto;
        }

        /* Green CTA Button */
        .step-flow-btn {
            background-color: #3ea05d; /* Specific green from image */
            color: #ffffff;
            font-weight: 700;
            padding: 14px 40px;
            border-radius: 10px;
            border: none;
            font-size: 1.1rem;
            margin-top: 30px;
            box-shadow: 0 4px 0 #2d7a46; /* Subtle bottom depth */
            transition: all 0.2s ease;
        }

        .step-flow-btn:hover {
            background-color: #358d51;
            color: white;
            transform: translateY(2px);
            box-shadow: 0 2px 0 #2d7a46;
        }

      

        /* Unique Custom Styles */
        .career-restart-section {
            background: linear-gradient(180deg, #FFFFFF 0%, #EEFBF2 100%);
           
            overflow: hidden;
        }

        .career-restart-title {
           font-size: 27px;
    font-weight: 600;
            margin-bottom: 30px;
            color: #000;
        }

        /* The Letter Box Styling */
        .career-restart-letter-box {
            background-color: #ffffff;
            border: 1.5px solid #a8d5ba;
            border-radius: 12px;
           
            position: relative;
            /* Crumpled paper effect simulation */
            background-image:
                url('image/white-crumpled-paper-texture-background 1.png'); 
            box-shadow: 0 10px 30px rgba(0,0,0,0.03);
                background-repeat: no-repeat;
        }

        .career-restart-letter-content {
           /* font-size: 1.05rem;
            line-height: 1.6;
            color: #333;*/
        }
        .textareabox{
          padding: 30px;
        }

        .career-restart-quote {
            font-style: italic;
            font-weight: 700;
            color: #111;
            margin: 15px 0;
        }

        .career-restart-list {
            list-style: none;
            padding-left: 0;
           
        }

        .career-restart-list li {
            position: relative;
            padding-left: 20px;
        }

        .career-restart-list li::before {
            content: "•";
            position: absolute;
            left: 0;
            font-weight: bold;
        }

        /* Image Styling */
        .career-restart-image-wrapper {
            position: relative;
            display: flex;
            align-items: flex-end;
            justify-content: center;
            height: 100%;
        }

        .career-restart-woman-img {
            max-width: 100%;
            height: auto;
            z-index: 2;
        }

      


/* Unique Custom Styles */
        .restart-cta-section {
            /* Background setup: Solid green fallback + the dotted pattern image */
            background-color: #3ea05d; 
            background-image: url('image/Rectangle 1485.png'); 
            background-repeat: repeat;
            padding: 30px 0;
            color: #ffffff;
            text-align: center;
        }

        .restart-cta-title {
           
            font-weight: 700;
            margin-bottom: 20px;
        }

        .restart-cta-subtitle {
            font-size: 1.1rem;
           
            margin: 0 auto 30px auto;
            opacity: 0.95;
            line-height: 1.6;
        }

        /* Pill Badge Styling */
        .restart-cta-badge {
            background-color: #eaf8ef; /* Light mint green from image */
            color: #000000;
            display: inline-block;
            padding: 10px 25px;
            border-radius: 50px;
            font-weight: 700;
            font-size: 1rem;
            margin-bottom: 30px;
            box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
        }

        /* Main White Button */
        .restart-cta-btn {
            background-color: #ffffff;
            color: #2d7a46; /* Green text to match theme */
            font-weight: 700;
            padding: 12px 26px;
            border-radius: 12px;
            border: none;
            font-size: 1.2rem;
            text-decoration: none;
            display: inline-block;
            transition: all 0.3s ease;
            box-shadow: 0 4px 15px rgba(0, 0, 0, 0.15);
        }

        .restart-cta-btn:hover {
            background-color: #f8f9fa;
            color: #246338;
            transform: translateY(-3px);
            box-shadow: 0 6px 20px rgba(0, 0, 0, 0.2);
        }

        /* Mobile Optimization */
        @media (max-width: 768px) {
            .restart-cta-section { padding: 60px 20px; }
            .restart-cta-title { font-size: 1.8rem; }
            .restart-cta-subtitle { font-size: 1rem; }
            .restart-cta-btn { width: 100%; padding: 14px 20px; }
        }









        .custom-border-box {
    border: 1px solid #e0e0e0;
    border-radius: 20px;
    padding: 30px;
  }
  
  .highlight-green-box {
    background-color: #e8f7ef; /* Light green background */
    border-radius: 15px;
    padding: 20px;
  }

  .text-success-dark {
    color: #198754 !important;
    font-weight: 700;
  }



  /* Alignment fix for image and content */
  .align-top-content {
    padding-top: 10px;
  }












        /* The Main Grid Design Banner */
        .experience-grid-banner {
            background-color: #9FE4B7; /* Light mint-green background */
            border-radius: 20px; /* Rounded corners */
            width: 100%;
            display: flex; /* Flex layout for columns */
            justify-content: space-between;
            align-items: stretch; /* Stretch to same height */
            margin: 0 auto 50px;
           
            box-shadow: 0 10px 20px rgba(0,0,0,0.05); /* Subtle shadow */
        }

        /* Individual columns */
        .stat-column {
            flex: 1; /* Equal width for all columns */
            display: flex;
            flex-direction: column;
            align-items: center; /* Center-align items vertically and horizontally */
            justify-content: space-between; /* Space icon and text */
            text-align: center;
            border-right: 1px solid #000; /* Thin black vertical separator */
            padding: 20px 20px; /* Internal column padding */

        }

        .stat-column:last-child {
            border-right: none; /* No separator on the last column */
        }

        /* The icons are detailed vector art, not simple standard icons.
           Below, I describe these detailed icons as SVGs or vector emblems. */
        .stat-icon2 {
            width: 30px;
            height: 70px;
            
            display: flex;
            align-items: center;
            justify-content: center;
        }

        /* Placeholders for the sophisticated icons. Description for generator. */
        /* [GENERATOR] Recreate the specific vector icons from image_6.png. */
        .stat-icon2.award {
            /* [GENERATOR] Detailed vector award ribbon with a star, two dots above the star, and a decorative ribbon below (image_b28e45.png). */
            background-size: contain;
            background-position: center;
            background-repeat: no-repeat;
            background-image: url('image/icon/expertise 1.png');
        }

        .stat-icon2.spend {
            /* [GENERATOR] Vector-illustrated emblem containing a framed illustration of money bill symbols and gear mechanism (image_b28b7a.png). */
            background-size: contain;
            background-position: center;
            background-repeat: no-repeat;
            background-image: url('image/icon/time-is-money_17228705 1.png');
        }

        .stat-icon2.revenue {
            /* [GENERATOR] Vector-illustrated framed emblem of a bar chart with an upward-trending arrow and a dollar sign. */
            background-size: contain;
            background-position: center;
            background-repeat: no-repeat;
            background-image: url('image/icon/increase 1.png');
        }

        .stat-icon2.partner {
            /* [GENERATOR] Stylized, modern, sleek vector illustration of a group of three human silhouettes. */
            background-size: contain;
            background-position: center;
            background-repeat: no-repeat;
            background-image: url('image/icon/group 1.png');
        }

        .stat-icon2.team {
            /* [GENERATOR] A clean, stylized modern vector Google 'G' icon. */
            background-size: contain;
            background-position: center;
            background-repeat: no-repeat;
            background-image: url('image/icon/Vector (4).png');
        }

        /* The text must be multi-line and centered, and color is black. */
        .stat-text2 {
            color: #000;
            font-size: 15px;
            font-weight: normal;
            word-wrap: break-word;
            line-height: 1.4;
            margin: 0 auto;
        }

        .cta-container {
            margin-top: 50px;
        }

  

        /* Responsive adjustments as per original HTML */
        @media (max-width: 991px) {
            .experience-grid-banner {
                flex-wrap: wrap; /* Allow columns to wrap on smaller screens */
            }
            .stat-column {
                flex: 0 0 33.333%; /* Three columns per row */
                border-right: 1px solid #000;
                margin-bottom: 20px;
            }
            /* Reset borders properly after wrapping */
            .stat-column:nth-child(3n) {
                border-right: none;
            }
            .stat-column:last-child {
                border-right: none;
            }
        }

        @media (max-width: 767px) {
            .stat-column {
                flex: 0 0 50%; /* Two columns per row */
            }
            /* Reset borders properly after wrapping */
            .stat-column:nth-child(2n) {
                border-right: none;
            }
            .stat-column:last-child {
                border-right: none;
            }
        }