/* HERO SECTION */
.hero-section {
    height: 80vh;
    background: linear-gradient(
        rgba(0, 0, 0, 0.6),
        rgba(0, 0, 0, 0.6)
    ),
    url("../images/hero.jpg");
    background-size: cover;
    background-position: center;
}
.vision-images img {
    width: 100%;
    height: 180px;        /* Fixed uniform height */
    object-fit: cover;   /* Crops images proportionally */
    border-radius: 8px;
}
.governance-card img {
    height: 220px;
    object-fit: cover;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
}

.governance-card {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.governance-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 20px rgba(0,0,0,0.12);
}
:root {
    --primary-color: #0d6efd;   /* Bootstrap blue */
    --secondary-color: #198754; /* Green/teal */
    --light-bg: #f8f9fa;
    --dark-text: #212529;
    --muted-text: #6c757d;
}
.page-header {
    background: linear-gradient(
        rgba(13,110,253,0.9),
        rgba(13,110,253,0.9)
    ),
    url("../images/header-bg.jpg");
    background-size: cover;
    color: white;
    padding: 60px 0;
}.section-padding {
    padding: 60px 0;
}

.section-light {
    background-color: var(--light-bg);
}

.section-white {
    background-color: #ffffff;
}

.page-header {
    background-color: #0d6efd;
    color: white;
    padding: 60px 0;
}

.section-padding {
    padding: 60px 0;
}

.section-light {
    background-color: #f8f9fa;
}

.custom-card {
    border: none;
    border-radius: 10px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.08);
}

.img-frame {
    height: 220px;
    width: 100%;
    object-fit: cover;
}
/* Blinking Apply Button */
.blink-btn {
  animation: blink 1.5s infinite;
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0.4;
  }
  100% {
    opacity: 1;
  }
}



  /* Custom button color */
  .btn-apply {
    background-color: #ff5722;  /* Orange */
    color: white;
    font-weight: bold;
    transition: background-color 0.3s, transform 0.2s;
  }

  .btn-apply:hover {
    background-color: #e64a19;  /* Darker orange on hover */
    transform: scale(1.05);
  }

.navbar {
    padding: 0.25rem 0;
}

.navbar-nav .nav-link {
    font-size: 17px;
    font-weight: 500;
    padding: 0.5rem 0.9rem;
}