   .banner {
    background-color: #18d26e;
    height: 300px; /* Banner ki height aap yahan adjust kar sakti ho */
    display: flex;
    justify-content: center; /* horizontally center */
    align-items: center;    /* vertically center */
    text-align: center;
  }

  .banner h1 {
    color: #fff; /* White text for contrast */
    font-size: 36px; /* Text size adjust kar sakti ho */
    font-weight: bold;
  }

    .mission-card {
    transition: all 0.3s ease-in-out;
    cursor: pointer;
  }
  .mission-card:hover {
    background-color: #18d26e;
    color: #fff;
    box-shadow: 0 6px 18px rgba(0,0,0,0.15);
    transform: translateY(-5px);
  }

    .hover-card {
    transition: all 0.3s ease-in-out;
  }
  .hover-card:hover {
    border-color: #18d26e !important;
    transform: translateY(-5px);
    box-shadow: 0 6px 20px rgba(0,0,0,0.15);
  }


 
  /* Custom green border and hover effect for main cards */
  .custom-card {
    border: 2px solid #28a745;
    /* Bootstrap green */
    transition: transform 0.3s ease, box-shadow 0.3s ease;
  }

  .custom-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 8px 20px rgba(40, 167, 69, 0.6);
    border-color: #218838;
    /* Darker green on hover */
  }

  /* Section heading style */
  h2 {
    color: #28a745;
    margin-bottom: 1rem;
    font-weight: 700;
  }

  /* Key Features point cards: white background, green border, hover green background with white text */
  .kf-card {
    border: 2px solid #28a745;
    background-color: white;
    color: #28a745;
    margin-bottom: 12px;
    padding: 10px 15px;
    border-radius: 5px;
    transition: background-color 0.3s ease, color 0.3s ease;
    cursor: default;
  }

  .kf-card:hover {
    background-color: #28a745;
    color: white;
  }

  /* Applications point cards: green background, white text; hover white background green text */
  .app-card {
    background-color: #28a745;
    color: white;
    padding: 12px 15px;
    border-radius: 5px;
    margin-bottom: 12px;
    cursor: default;
    transition: background-color 0.3s ease, color 0.3s ease;
    border: none;
  }

  .app-card:hover {
    background-color: white;
    color: #28a745;
    border: 2px solid #28a745;
  }

