/* body { font-family: 'Poppins', sans-serif; margin:0; background:#f7fafc; } */
 /* Button Base */
.b_effect {
  position: relative;
  padding: 14px 40px;
  background: transparent;
  color: green;
  border: 2px solid green;
  font-size: 16px;
  letter-spacing: 1px;
  font-weight: 600;
  cursor: pointer;
  overflow: hidden;
  text-transform: uppercase;
  transition: color 0.3s ease;
}

/* Liquid overlay */
.b_effect::before {
  content: "";
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, rgb(115, 247, 115), green);
  z-index: -1;
  transition: all 0.4s ease;
}

/* Hover effect — liquid rises */
.b_effect:hover::before {
  top: 0;
}

/* Text turns dark when filled */
.b_effect:hover {
  color: white;
  border:2px solid green;
  font-weight: 700;
}
  /* Hero Section */
  .hero-section {
    position: relative;
    background: url('../images/career.png') center/cover no-repeat;
    height: 400px;
         background-position-y: 40%; 

    display: flex; align-items: center; justify-content: center; text-align: center;
    color: white;
    overflow: hidden;
  }
  .hero-section::before {
    content:"";
    position:absolute; top:0; left:0; right:0; bottom:0;
    background: rgba(0,0,0,0.5);
  }
  .hero-content {
    position: relative; z-index:2;
    max-width: 800px; padding: 0 20px;
    animation: fadeUp 1s ease forwards;
  }
  .hero-content h2 { font-size: 48px; font-weight:700; margin-bottom:15px; }
  .hero-content p { font-size: 18px; line-height:1.6; color:#f0f0f0; }

  @keyframes fadeUp {
    0% { opacity:0; transform:translateY(20px);}
    100% { opacity:1; transform:translateY(0);}
  }

  /* Intro Section */
  .career-intro { text-align:center; max-width:900px; margin:50px auto; padding:0 20px; position:relative; }
  .career-intro h3 { font-size:32px; font-weight:700; color:green; margin-bottom:20px; }
  .career-intro p { font-size:16px; color:black; line-height:1.6; }

  /* Decorative shapes */
  .shape-circle { position:absolute; border-radius:50%; opacity:0.1; z-index:0; }
  .shape-circle.one { width:150px; height:150px;background-color: rgb(161, 250, 161); top:-50px; left:-50px; }

  /* Job Section */
  .job-section { max-width:1200px; margin:50px auto; padding:0 20px; }
  .job-section h3 { font-size:32px; font-weight:700; text-align:center; color:green; margin-bottom:40px; }
  .job-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:30px; }

  .job-card { background:#fff; border-radius:15px; padding:25px; box-shadow:0 6px 15px rgba(0,0,0,0.1); transition:0.3s; position:relative; overflow:hidden; }
  .job-card:hover { transform:translateY(-5px); box-shadow:0 12px 25px rgba(0,0,0,0.15);}
  .job-card i { font-size:28px; color:green; margin-bottom:10px; display:block; }
  .job-card h4 { font-size:20px; font-weight:600; color:black; margin-bottom:10px; }
  .job-card p { font-size:15px; color:#4a5568; margin-bottom:15px; }
  .job-card a { text-decoration:none; font-weight:600; color:green; transition:0.3s; }

  /* Application Form Section */
  .application-section { max-width:700px; margin:50px auto; padding:40px; text-align:center; background:#fff; border-radius:20px; box-shadow:0 8px 25px rgba(0,0,0,0.1); }
  .application-section h3 { font-size:32px; font-weight:700; color:green; margin-bottom:20px; }
  .application-section p { font-size:16px; color:black; margin-bottom:30px; }
  .application-section form { display:flex; flex-direction:column; gap:20px; }
  .application-section input,
  .application-section textarea { padding:15px 20px; border-radius:12px; border:1px solid green; font-size:15px; width:100%; }
  .application-section input:focus,
  .application-section textarea:focus { outline:none; border-color:green; box-shadow:0 0 5px rgb(86, 248, 86); }
  .application-section button { padding:15px 30px;  border:2px solid green; background-color:transparent; color:green; font-weight:600; cursor:pointer; transition:0.3s; }
  .application-section button:hover { background-color:green;color:white;}

  /* Newsletter Section */
  .newsletter-section { background-color:green; color:#fff; padding:60px 20px; text-align:center; border-radius:20px; margin:50px 20px; }
  .newsletter-section h3 { font-size:32px; font-weight:700; margin-bottom:20px; }
  .newsletter-section p { margin-bottom:30px; font-size:16px; }
  .newsletter-section form { display:flex; flex-wrap:wrap; justify-content:center; gap:10px; }
  .newsletter-section input[type="email"] { padding:12px 20px; border-radius:10px; border:none; flex:1 1 250px; max-width:400px; font-size:14px; }
  .newsletter-section button { padding:12px 25px;  border:none; background-color:transparent;color:white;border:2px solid white; font-weight:600; cursor:pointer; transition:0.3s; }
  .newsletter-section button:hover { background-color:white;color:green;border:2px solid green; }