.hero-section {
margin-top: 60px;
padding: 60px 20px;
background: #ededed;
border-radius: 20px;
}
.hero-title {
font-size: 3rem;
font-weight: 700;
}
.hero-subtitle {
font-size: 1.3rem;
margin-top: 10px;
}
.featured-title {
margin-top: 60px;
font-weight: 700;
}
.btn-rainbow {
background: linear-gradient(
270deg,
red, red, purple, blue, green, yellow, orange, red
);
background-size: 1600% 100%;
color: white;
font-weight: 600;
border: none;
transition: transform 0.2s;
animation: rainbowBG 5s linear infinite;
}

.btn-rainbow:hover {
transform: scale(1.02);
}
.info-btn {
background: linear-gradient(
270deg,
red, purple, blue, green, yellow, orange, red
);
background-size: 1600% 100%;
color: white;
border: none;
animation: rainbowBG 5s linear infinite;
font-weight: 600;
}

.info-btn:hover {
transform: scale(1.02);
}
.subject-btn {
background: #ededed !important;
color: black !important;
border: 2px solid #ededed !important;
}

.subject-btn:hover {
background: #c5c5c5 !important;
border-color: #c5c5c5 !important;
color: black !important;
}

@keyframes rainbowBG {
0% { background-position: 0% 0%; }
100% { background-position: 100% 0%; }
}

@media (max-width: 576px) {
  footer {
    font-size: 0.75rem;
    margin-top: 2rem;
  }

  footer img {
    width: 20px;
  }
}