body {
    
    font-family: Georgia, 'Times New Roman', Times, serif;
    text-align: justify;
    
    
  }

  /* Navbar Hover Button Effect */
    .navbar .nav-link {
      position: relative;
      padding: 8px 15px;
      border-radius: 20px;
      transition: all 0.3s ease;
    }

    .navbar .nav-link:hover {
      background-color: #0d27f0;
      color: white !important;
    }

    /* Flip Card CSS */
    .flip-card {
      background-color: transparent;
      width: 100%;
      height: 350px;
      perspective: 1000px;
    }

    .flip-card-inner {
      position: relative;
      width: 100%;
      height: 100%;
      transition: transform 0.6s;
      transform-style: preserve-3d;
    }

    .flip-card:hover .flip-card-inner {
      transform: rotateY(180deg);
    }

    .flip-card-front,
    .flip-card-back {
      position: absolute;
      width: 100%;
      height: 100%;
      -webkit-backface-visibility: hidden;
      backface-visibility: hidden;
      border-radius: 10px;
      overflow: hidden;
      border: 2px solid #0dcaf0;
      box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
    }

    .flip-card-front {
      background: #fff;
    }

    .flip-card-front img {
      width: 100%;
      height: 200px;
      object-fit: cover;
    }

    .flip-card-back {
      background-color: blue;
      color: white;
      transform: rotateY(180deg);
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      padding: 15px;
      text-align: center;
    }

    /* Navbar Hover Button Effect */
    .navbar .nav-link {
      position: relative;
      padding: 8px 15px;
      border-radius: 20px;
      transition: all 0.3s ease;
    }

    .navbar .nav-link:hover {
      background-color: #0d27f0;
      color: white !important;
    }

    /* Transparent Button */
    .btn-transparent-black {
      background-color: transparent;
      color: black;
      border: 1px solid black;
      transition: all 0.3s ease;
    }

    .btn-transparent-black:hover {
      background-color: black;
      color: white;
    }

    .section-heading-left {
      padding-left: 15px;
      font-weight: bold;
      margin-top: 40px;
      margin-bottom: 20px;
    }

    .social-icon {
      padding: 10px;
      border-radius: 50%;
      transition: all 0.3s ease;
    }

    .social-icon:hover {
      background-color: blue;
      transform: translateY(-5px);
      color: white !important;
    }

    /* Back to Top */
    .back-to-top {
      position: fixed;
      bottom: 20px;
      right: 20px;
      z-index: 999;
      transition: all 0.3s ease;
    }

    .back-to-top:hover {
      transform: translateY(-5px);
      background-color: #0dcaf0;
    }

    /* Card hover animation */
    .card {
      height: 100%;
      transition: transform 0.3s ease, box-shadow 0.3s ease;
    }

    .card:hover {
      transform: translateY(-10px) scale(1.03);
      box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
    }

    /* Flip Card Container */
.flip-card {
  background-color: transparent;
  width: 100%;
  height: 350px;
  perspective: 1000px; /* 3D effect */
}

/* Inner wrapper */
.flip-card-inner {
  position: relative;
  width: 100%;
  height: 100%;
  text-align: center;
  transition: transform 0.8s;
  transform-style: preserve-3d;
}

/* Flip on hover */
.flip-card:hover .flip-card-inner {
  transform: rotateY(180deg);
}

/* Front and back faces */
.flip-card-front, .flip-card-back {
  position: absolute;
  width: 100%;
  height: 100%;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 4px 10px rgba(0,0,0,0.2);
}

/* Front face */
.flip-card-front img {
  width: 100%;
  height: 200px;
  object-fit: cover;
  border-bottom: 3px solid #ddd;
}
.flip-card-front {
  background: #fff;
}

/* Back face */
.flip-card-back {
  background: #0077b6;
  color: white;
  transform: rotateY(180deg);
  padding: 20px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

    .section-title {
      display: inline-block;
      border-bottom: 3px solid #0d6efd;
      padding-bottom: 5px;
      margin-bottom: 30px;
    }