/* Custom font import for Inter (retained for consistency, Bootstrap uses system fonts) */
        @import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');
        body {
            font-family: 'Inter', sans-serif;
            -webkit-font-smoothing: antialiased;
            -moz-osx-font-smoothing: grayscale;
            background-color: #f0f4f8; /* Slightly darker light background for better contrast */
            overflow-x: hidden; /* Prevent horizontal scroll from potential animations */
        }
        /* Custom styles to match the original aesthetic or add specific Bootstrap overrides */
        .gradient-bg {
            background: linear-gradient(to right, #6f42c1, #a76ff0); /* More vibrant purple gradient */
            position: relative;
            overflow: hidden; /* For background pattern */
        }
        /* Subtle background pattern for hero section */
        .gradient-bg::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-image: radial-gradient(circle at 10% 20%, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0.02) 80%);
            background-size: 40px 40px;
            opacity: 0.8;
            z-index: 1;
        }
        .gradient-bg > .container {
            position: relative;
            z-index: 2;
        }

        .rounded-custom {
            border-radius: 0.75rem !important; /* Slightly more rounded corners */
        }
		 .rounded-custom1 {
            border-radius: 0.75rem !important; /* Slightly more rounded corners */
			border:2px solid #4c51bf;
        }
        .rounded-bottom-custom {
            border-bottom-left-radius: 0.75rem !important;
            border-bottom-right-radius: 0.75rem !important;
        }
        .rounded-top-custom {
            border-top-left-radius: 0.75rem !important;
            border-top-right-radius: 0.75rem !important;
        }

        /* Navbar brand and links custom transitions */
        .hover-bg-light:hover {
            background-color: rgba(0, 0, 0, 0.05); /* Lighter hover background for clarity */
        }
        .hover-text-indigo:hover {
            color: #6f42c1 !important; /* Brighter indigo on hover */
        }

        /* Hover effects for cards */
        .card-hover-effect {
            transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
            box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05), 0 10px 15px rgba(0, 0, 0, 0.1); /* Initial subtle shadow */
        }
        .card-hover-effect:hover {
            transform: translateY(-8px); /* More pronounced lift on hover */
            box-shadow: 0 10px 20px rgba(0, 0, 0, 0.15), 0 20px 40px rgba(0, 0, 0, 0.1); /* Stronger shadow on hover */
        }
        /* Icon color on hover for Quick Links (retained from original intent) */
        .card-hover-effect:hover .fa-icon {
            transform: scale(1.1);
            color: #6f42c1 !important; /* Example: Revert to a specific color on hover for visual feedback */
        }

        /* QUICK LINKS Card - Removed animation, reverted to simple styling */
        .quick-links-card-animated {
            background-color: #ffffff; /* Static white background */
        }

        /* Reverted icon color to use the specific colors defined in HTML */
        /* Text color for Quick Links card content */
        .quick-links-card-animated .h5,
        .quick-links-card-animated p {
            color: #2d3748 !important; /* Force a dark gray color for text */
        }

        /* Removed @keyframes quick-link-gradient-shift as the animation is no longer needed */


        /* Button hover and pulse effects */
        .btn-custom-pulse {
            animation: pulse-initial 2s infinite; /* Initial subtle pulse animation */
            transition: background-color 0.3s ease-in-out, transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
        }
        .btn-custom-pulse:hover {
            animation: none; /* Stop pulse on hover for smoother interaction */
            transform: scale(1.05); /* Slight scale up on hover */
            box-shadow: 0 8px 15px rgba(0, 0, 0, 0.2); /* Enhanced shadow on hover */
        }
        @keyframes pulse-initial {
            0% { transform: scale(1); box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.7); }
            70% { transform: scale(1.02); box-shadow: 0 0 0 10px rgba(255, 255, 255, 0); }
            100% { transform: scale(1); box-shadow: 0 0 0 0 rgba(255, 255, 255, 0); }
        }

        /* Section fade-in animation on scroll */
        .section-fade-in {
            opacity: 0;
            transform: translateY(20px);
            transition: opacity 0.6s ease-out, transform 0.6s ease-out;
        }
        .section-fade-in.is-visible {
            opacity: 1;
            transform: translateY(0);
        }

        /* Hover effect for footer links */
        .footer-link-hover:hover {
            color: #fff !important;
            text-decoration: underline !important;
        }

        /* Custom color definitions to align with original Tailwind colors (adjusted for new gradient) */
        .text-indigo-700 { color: #4c51bf !important; }
        .text-gray-600 { color: #4a5568 !important; }
        .text-gray-800 { color: #2d3748 !important; }
        .text-gray-900 { color: #1a202c !important; }
        .text-indigo-500 { color: #6f42c1 !important; } /* Adjusted to match new gradient for consistency */
        .text-purple-500 { color: #a76ff0 !important; } /* Adjusted to match new gradient for consistency */
        .text-pink-500 { color: #ec4899 !important; } /* Example pink */

        /* Styles for the new top header brand section */
        .top-header-brand {
            background-color: #fff;
            padding: 1rem 0.75rem; /* Adjusted padding */
            border-bottom: 1px solid #e2e8f0; /* Subtle separator */
            border-top-left-radius: 0.75rem;
            border-top-right-radius: 0.75rem;
            margin-left: 0.75rem; /* Match mx-3 */
            margin-right: 0.75rem; /* Match mx-3 */
            margin-top: 0.75rem; /* Match mt-3 */
            /* Removed direct animation from here to animate children */
        }
        /* Keyframe for school name text animation */
        @keyframes fade-in-scale-in {
            from {
                opacity: 0;
                transform: translateY(10px) scale(0.95);
            }
            to {
                opacity: 1;
                transform: translateY(0) scale(1);
            }
        }
        /* Keyframe for tagline text animation (slightly different timing/effect) */
        @keyframes fade-in-slide-in {
            from {
                opacity: 0;
                transform: translateY(10px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        .top-header-brand .company-name {
            font-size: 1.8rem; /* Default smaller for mobile-first */
            font-weight: 700;
            color: #312e81; /* Darker indigo for brand */
            margin-bottom: 0;
            line-height: 1;
            opacity: 0; /* Hide initially for animation */
            animation: fade-in-scale-in 1s ease-out forwards; /* Apply the new animation */
            animation-delay: 0.3s; /* Adjusted delay for earlier appearance */
        }
        .top-header-brand .company-tagline { /* New class for the tagline */
            font-size: 1.1rem; /* Smaller for tagline */
            font-weight: 500;
            color: #4a5568; /* Gray color for tagline */
            margin-top: 0.25rem;
            opacity: 0; /* Hide initially for animation */
            animation: fade-in-slide-in 0.8s ease-out forwards;
            animation-delay: 0.8s; /* Appear after company name */
        }
        .top-header-brand .logo-text {
            font-size: 1.1rem; /* Smaller font for logo text */
            font-weight: 600;
            color: #4c51bf;
            display: block; /* Ensure it's on its own line */
        }
        .top-header-brand .logo-container {
             display: flex;
             align-items: center;
             justify-content: center; /* Center logo and text on small screens */
             flex-direction: column; /* Stack logo and text on small screens */
             text-align: center;
        }
		
		.carousel-item img {
  width: 100% !important;       /* Full width force */
  height: 500px !important;     /* Fixed height force */
  object-fit: cover !important; /* Crop properly */
}
        @media (min-width: 576px) { /* Small devices (sm) and up */
            .top-header-brand .logo-container {
                flex-direction: row; /* Row for logo and text on larger screens */
                justify-content: flex-start; /* Align to start */
                text-align: left;
            }
            .top-header-brand .logo-text {
                margin-left: 0.75rem; /* Spacing between logo image and text */
            }
            .top-header-brand .company-name {
                font-size: 2.25rem; /* Larger on small desktops */
            }
            .top-header-brand .company-tagline {
                font-size: 1.25rem;
            }
            .top-header-brand .logo-text {
                font-size: 1.5rem;
            }
        }
        @media (min-width: 768px) { /* Medium devices (md) and up */
            .top-header-brand .company-name {
                font-size: 2.5rem; /* Even larger on desktop */
            }
            .top-header-brand .company-tagline {
                font-size: 1.4rem;
            }
            .top-header-brand .logo-text {
                font-size: 1.5rem;
            }
        }
       

        /* Navbar specific enhancements */
        .navbar-custom {
            background: linear-gradient(to right, #1E90FF, #FF4500, #1E90FF); /* Multi-color gradient: Blue, Red */
            background-size: 200% auto; /* Adjusted size for 2 main colors */
            border-bottom: 2px solid #e0e0e0;
            box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05); /* Initial subtle shadow */
            padding-top: 0.75rem;
            padding-bottom: 0.75rem;
            /* Combine shadow and new background animation */
            animation: navbar-background-shift 10s infinite alternate ease-in-out, /* Adjusted duration for smoother transition */
                       navbar-shadow-glow 5s infinite alternate ease-in-out;
        }

        @keyframes navbar-background-shift {
            0% {
                background-position: 0% center;
            }
            100% {
                background-position: 100% center;
            }
        }

        @keyframes navbar-shadow-glow {
            0% {
                box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05), 0 0 0 0 rgba(111, 66, 193, 0.3); /* Initial state, subtle purple glow */
            }
            50% {
                box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1), 0 0 15px 5px rgba(167, 111, 240, 0.5); /* Brighter purple glow */
            }
            100% {
                box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05), 0 0 0 0 rgba(111, 66, 193, 0.3); /* Return to initial */
            }
        }

        .navbar-custom .nav-link {
            font-size: 1.05rem; /* Slightly larger font */
            padding: 0.75rem 1.25rem; /* More padding for a bolder look */
            margin: 0 0.25rem; /* Small horizontal margin */
            border-radius: 0.5rem; /* Slightly more rounded links */
            color: #ffffff; /* Default text color for gradient background */
            position: relative; /* Needed for pseudo-element animation */
            overflow: hidden; /* Hide overflowing background */
            z-index: 1; /* Ensure link is above pseudo-element */
            transition: color 0.3s ease-in-out; /* Transition for text color */
        }
        .navbar-custom .nav-link::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(255, 255, 255, 0.2); /* Subtle overlay on hover for contrasting effect */
            z-index: -1; /* Behind the text */
            transition: transform 0.3s ease-in-out;
            transform: scaleX(0); /* Start hidden */
            transform-origin: left; /* Expand from left */
        }
        .navbar-custom .nav-link:hover::before,
        .navbar-custom .nav-link.active::before {
            transform: scaleX(1); /* Expand on hover/active */
        }
        .navbar-custom .nav-link:hover,
        .navbar-custom .nav-link.active {
            color: #ffffff !important; /* Text remains white on hover */
            transform: translateY(-2px); /* Subtle lift on hover */
            box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); /* Subtle shadow on hover */
        }
        .navbar-custom .dropdown-menu {
            border: none;
            box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1); /* Enhanced dropdown shadow */
            padding: 0.5rem 0;
        }
        .navbar-custom .dropdown-item {
            padding: 0.75rem 1.5rem;
            transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
        }
        .navbar-custom .dropdown-item:hover {
            background-color: #f0f4f8;
            color: #6f42c1 !important;
        }
        /* Adjust alignment for navbar content */
        .navbar-collapse-start {
            justify-content: flex-start !important; /* Align to left */
        }
        @media (max-width: 991.98px) { /* On small screens, ensure collapse content is full width */
            .navbar-collapse-start {
                justify-content: center !important; /* Center on mobile collapsed menu */
            }
        }

        /* Styles for top-promo-bar content */
        .top-promo-bar-content {
            display: flex;
            justify-content: center;
            align-items: center;
            flex-wrap: wrap; /* Allow content to wrap on small screens */
            gap: 1rem; /* Spacing between items */
        }
        .top-promo-bar-item {
            display: flex;
            align-items: center;
            color: white; /* Ensure text is white */
            text-decoration: none;
            transition: color 0.2s ease-in-out;
        }
        .top-promo-bar-item:hover {
            color: rgba(255, 255, 255, 0.8); /* Slightly dim on hover */
        }
        .top-promo-bar-item .fa-icon { /* Specific styling for FA icons */
            font-size: 1rem; /* Adjust size if needed */
            margin-right: 0.5rem;
            color: currentColor;
        }

        /* Testimonials Section specific styling */
        .testimonial-text {
            font-size: 1.15rem; /* Slightly larger font size for testimonial text */
            line-height: 1.6; /* Improved line spacing */
        }
        .testimonial-carousel-item {
            padding: 2.5rem 1.5rem; /* Increased padding for more space */
        }
        /* Adjusting carousel controls for better visibility */
        .carousel-control-prev-icon,
        .carousel-control-next-icon {
            background-color: #4a5568 !important; /* Darker background for controls */
            border-radius: 50%; /* Ensure they are perfectly round */
            padding: 0.8rem; /* Increased padding */
            opacity: 0.7; /* Slight transparency */
            transition: opacity 0.3s ease-in-out;
        }
        .carousel-control-prev-icon:hover,
        .carousel-control-next-icon:hover {
            opacity: 1; /* Fully opaque on hover */
        }

        /* Testimonials section background (removed #testimonialCarousel and applied to section) */
        .testimonial-section-bg { /* New class for the section background */
            background-color: #f8f9fa; /* A very light grey background for the section */
            border-radius: 0.75rem; /* Match other rounded elements */
            padding: 2rem; /* Consistent padding with other sections */
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.05); /* Subtle shadow */
        }


        /* Styling for general message sections (President, Principal, Manager) */
        .leadership-messages-container {
            /* This is the parent container for all three messages */
            background-color: #f8f9fa; /* Light background for the whole section */
            border-radius: 0.75rem;
            padding: 2rem;
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.05);
            margin-top: 2rem;
            margin-left: 0.75rem;
            margin-right: 0.75rem;
        }

        .leadership-messages-container .message-card-item {
            /* Styles for individual message cards within the grid */
            background-color: #ffffff;
            border-radius: 0.75rem;
            padding: 2rem;
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.05);
            height: 100%; /* Ensure cards are same height in a row */
            display: flex;
            flex-direction: column;
            justify-content: space-between; /* Push button to bottom */
            transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
            text-align: center; /* Center content within each card */
        }

        .leadership-messages-container .message-card-item:hover {
            transform: translateY(-5px);
            box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1);
        }

        .leadership-messages-container .message-card-item h2 {
            color: #2d3748; /* Dark gray for heading */
            font-weight: 700;
            margin-bottom: 1.5rem;
        }
        .leadership-messages-container .message-card-item p {
            color: #4a5568; /* Slightly lighter gray for text */
            line-height: 1.7;
            margin-bottom: 1rem;
            flex-grow: 1; /* Allow paragraph to grow */
        }
        .leadership-messages-container .message-card-item .author-info {
            font-weight: 600;
            color: #6f42c1; /* Purple color for author name */
            margin-top: 1.5rem;
        }
        .leadership-messages-container .message-card-item .author-title {
            font-style: italic;
            color: #4a5568;
            font-size: 0.9rem;
            margin-bottom: 1.5rem; /* Space below title */
        }
        .leadership-messages-container .message-card-item img {
            width: 150px; /* Slightly smaller image for cards */
            height: 150px;
            object-fit: cover;
            border-radius: 50%;
            margin-bottom: 1rem;
            box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
            transition: transform 0.3s ease-in-out;
            display: block; /* Ensure image is a block element for margin auto to work */
            margin-left: auto; /* Center image */
            margin-right: auto; /* Center image */
        }
        .leadership-messages-container .message-card-item img:hover {
            transform: scale(1.03);
        }

        /* Specific styling overrides for President's message */
        .president-card { /* Specific class for President's card */
            /* Removed background gradient, now inherits white from .message-card-item */
            background-color: #ffffff;
        }
        .president-card h2,
        .president-card .author-info {
            color: #2f855a; /* Darker green for heading/author */
        }
        .president-card p,
        .president-card .author-title {
            color: #48bb78; /* Muted green for text/title */
        }
        .president-card .author-image {
            border: 4px solid #4c51bf; /* Medium green border */
            box-shadow: 0 0 0 5px rgba(172, 175, 249, 0.5); /* Subtle glow */
            transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out, border-color 0.3s ease-in-out;
        }
        .president-card .author-image:hover {
            transform: scale(1.05);
            border-color: #4c51bf; /* Darker green on hover */
            box-shadow: 0 0 0 8px rgba(172, 175, 249, 0.2); /* More prominent glow */
        }

        /* Custom "Read More" Button Styles for Leadership Section */
        .btn-leadership-readmore {
            display: inline-block;
            padding: 0.75rem 1.5rem;
            border-radius: 0.5rem;
            text-decoration: none;
            font-weight: 600;
            transition: all 0.3s ease-in-out;
            margin-top: auto; /* Push button to the bottom */
            border: 1px solid transparent; /* Base transparent border */
        }

        /* President's Read More Button */
        .btn-president-readmore {
            background-color: #4c51bf;
            color: white;
            border-color: #2f855a;
        }
        .btn-president-readmore:hover {
            background-color: #383d8e;
            box-shadow: 0 4px 8px rgba(0,0,0,0.2);
            transform: translateY(-2px);
            color: white; /* Ensure text remains white on hover */
        }

        /* Manager's Read More Button */
        .btn-manager-readmore {
            background-color: #4c51bf; /* Matching existing purple gradient */
            color: white;
            border-color: #6f42c1;
        }
        .btn-manager-readmore:hover {
            background-color: #383d8e;
            box-shadow: 0 4px 8px rgba(0,0,0,0.2);
            transform: translateY(-2px);
            color: white; /* Ensure text remains white on hover */
        }

        /* Principal's Read More Button */
        .btn-principal-readmore {
            background-color: #4c51bf; /* Matching existing indigo */
            color: white;
            border-color: #4c51bf;
        }
        .btn-principal-readmore:hover {
            background-color: #383d8e;
            box-shadow: 0 4px 8px rgba(0,0,0,0.2);
            transform: translateY(-2px);
            color: white; /* Ensure text remains white on hover */
        }


        /* News Feed Marquee Styling */
        .news-feed-container {
            background-color: #fff;
            padding: 0.75rem 1rem;
            border-radius: 0.75rem;
            box-shadow: 0 2px 4px rgba(0,0,0,0.05);
            margin: 1.5rem auto; /* Center with auto margins and add vertical space */
            max-width: calc(100% - 1.5rem); /* Account for mx-3 */
            overflow: hidden; /* Ensure marquee content stays within bounds */
            display: flex; /* Use flexbox for alignment of "NEWS" label */
            align-items: center; /* Vertically align items */
            gap: 1rem; /* Space between NEWS label and marquee */
        }

        .news-feed-marquee {
            flex-grow: 1; /* Allow marquee to take up remaining space */
            white-space: nowrap; /* Keep content on a single line */
            overflow: hidden; /* Hide content outside marquee bounds */
            box-sizing: border-box; /* Include padding/border in width */
            margin: 0; /* Remove default margin */
            padding: 0; /* Remove default padding */
        }

        .news-feed-marquee span {
            display: inline-block; /* Essential for marquee content */
            padding-right: 1.5rem; /* Space between news items */
            color: #2d3748; /* Dark text color for news */
        }
        .news-feed-marquee a {
            color: #007bff; /* Link color */
            text-decoration: none;
            transition: color 0.2s ease-in-out;
        }
        .news-feed-marquee a:hover {
            color: #0056b3; /* Darker link color on hover */
            text-decoration: underline;
        }

        /* Topper Section Specific Styling */
        .topper-section {
            background: linear-gradient(to right, #e0f2f7, #c1e7f0); /* Light blue gradient background */
            border-radius: 0.75rem;
            padding: 2rem;
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.05);
            margin-top: 2rem;
            margin-left: 0.75rem;
            margin-right: 0.75rem;
            overflow: hidden; /* Important for marquee content */
        }
        .topper-section h2 {
            color: #1a202c; /* Darker heading for contrast */
            font-weight: 700;
            margin-bottom: 1.5rem;
        }
        .topper-section .lead {
            color: #2d3748; /* Darker lead text */
            margin-bottom: 2rem;
        }
        .topper-card {
            background-color: #ffffff;
            border-radius: 0.75rem;
            padding: 1.5rem; /* Slightly more padding for aesthetics */
            box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15); /* More prominent shadow */
            text-align: center;
            transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
            margin: 0 0.75rem; /* Add horizontal margin for spacing in marquee */
            width: 280px; /* Fixed width for consistent marquee sizing */
            flex-shrink: 0; /* Prevent shrinking in flex container */
            display: inline-flex; /* Changed to inline-flex for marquee compatibility */
            flex-direction: column;
            justify-content: center;
            align-items: center;
            position: relative; /* Needed for pseudo-elements for effects */
            overflow: hidden; /* Hide overflow for background effects */
        }
        /* Adding a subtle overlay effect on hover */
        .topper-card::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(111, 66, 193, 0.1); /* Light purple overlay */
            transform: scaleX(0); /* Hidden by default */
            transform-origin: left;
            transition: transform 0.3s ease-in-out;
            z-index: 0;
        }
        .topper-card:hover::before {
            transform: scaleX(1); /* Reveal on hover */
        }
        .topper-card > * { /* Ensure content is above the pseudo-element */
            position: relative;
            z-index: 1;
        }

        .topper-card:hover {
            transform: translateY(-8px) scale(1.02); /* More pronounced lift and slight scale */
            box-shadow: 0 12px 24px rgba(0, 0, 0, 0.25); /* Even stronger shadow */
        }
        .topper-card img {
            width: 120px;
            height: 120px;
            object-fit: cover;
            border-radius: 50%;
            margin-bottom: 0.75rem;
            border: none; /* Removed border */
            box-shadow: none; /* Removed box-shadow */
            transition: none; /* Removed transition for border/shadow */
        }
        .topper-card:hover img {
            border-color: initial; /* Reset on hover */
            box-shadow: none; /* Reset on hover */
        }
        .topper-card h3 {
            color: #2d3748;
            font-weight: 700; /* Bolder name */
            font-size: 1.4rem; /* Slightly larger name */
            margin-bottom: 0.25rem;
            white-space: normal;
        }
        .topper-card p {
            color: #5a67d8; /* A nice indigo for percentage */
            font-size: 1.05rem; /* Slightly larger percentage */
            font-weight: 500;
            margin-bottom: 0;
            white-space: normal;
        }

        /* Marquee-specific styling for toppers */
        .toppers-marquee-wrapper {
            max-height: 400px; /* Adjust as needed */
            overflow: hidden; /* Hide content that goes beyond bounds */
            white-space: nowrap; /* Keep content on a single line for marquee */
            padding: 1rem 0; /* Add vertical padding if needed */
        }
        .toppers-marquee {
            display: inline-block; /* Essential for marquee effect inside a div */
            animation: marquee-scroll 30s linear infinite; /* Adjust speed (30s) as needed */
            padding-right: 2rem; /* Space at the end for smooth loop */
        }
        .toppers-marquee:hover {
            animation-play-state: paused; /* Pause on hover */
        }

        @keyframes marquee-scroll {
            0% { transform: translateX(0); }
            100% { transform: translateX(-100%); } /* Scrolls one full set of cards */
        }

        /* Responsive adjustments for marquee items */
        @media (max-width: 767.98px) {
            .topper-card {
                width: 250px; /* Slightly smaller width on mobile to fit more */
                margin: 0 0.5rem; /* Smaller margin between cards on mobile */
            }
        }
	/* Mobile: smaller height */
.carousel-item img {
  width: 100% !important;
  height: 300px !important;
  object-fit: cover !important;
}

@media (min-width: 768px) {
  .carousel-item img {
    height: 300px !important;
  }
}

@media (min-width: 1200px) {
  .carousel-item img {
    height: 800px !important;
  }
}
@media (max-width: 480px) {
  .carousel-item img {
    height: 180px !important;   /* Extra small screens */
  }
}
/* Footer Background & Text */
.footer-section {
    background: linear-gradient(135deg, #6f42c1, #805ad5);
    color: #fff;
    border-radius: 15px 15px 0 0;
    position: relative;
    overflow: hidden;
}

/* Footer Divider */
.footer-divider {
    border-top: 1px solid rgba(255,255,255,0.3);
}

/* Footer Headings */
.footer-section h4 {
    font-weight: 600;
    margin-bottom: 15px;
    position: relative;
}

/* Quick Links Hover */
.footer-links li a {
    color: #fff;
    text-decoration: none;
    display: inline-block;
    margin-bottom: 8px;
    transition: all 0.3s ease;
}
.footer-links li a:hover {
    color: #ffd700;
    transform: translateX(5px);
}

/* Footer Bottom Links Hover */
.footer-section .d-flex a {
    color: #fff;
    text-decoration: none;
    transition: all 0.3s ease;
}
.footer-section .d-flex a:hover {
    color: #ffd700;
}

/* Animate Footer Columns */
.animate-footer {
    opacity: 0;
    transform: translateY(30px);
    animation: fadeInUp 1s forwards;
    animation-delay: 0.3s;
}

/* Stagger Animation for Columns */
.footer-columns .col-md-4:nth-child(1) { animation-delay: 0.2s; }
.footer-columns .col-md-4:nth-child(2) { animation-delay: 0.4s; }
.footer-columns .col-md-4:nth-child(3) { animation-delay: 0.6s; }

/* Fade-in Animation */
@keyframes fadeInUp {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Map Responsive */
.map-responsive iframe {
    width: 100%;
    height: 250px;
    border-radius: 10px;
}

/* Optional: Glowing Footer Text Animation */
.footer-section p, .footer-section h4 {
    animation: glowText 2s infinite alternate;
}

@keyframes glowText {
    from { text-shadow: 0 0 5px rgba(255,255,255,0.3); }
    to { text-shadow: 0 0 15px rgba(255,255,255,0.6); }
}
/* Social Icons */
.social-icons a {
    display: inline-block;
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    color: #fff;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 50%;
    margin-right: 10px;
    transition: all 0.3s ease;
    font-size: 16px;
}

.social-icons a:hover {
    color: #fff;
    background: #ffd700;
    transform: translateY(-5px) scale(1.1);
    box-shadow: 0 4px 10px rgba(255, 215, 0, 0.5);
}
.news-feed-container {
    background: linear-gradient(90deg, #ffecd2, #fcb69f);
    padding: 15px 20px;
    position: relative;
    overflow: hidden;
    border-radius: 10px;
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}

.news-label {
    font-weight: bold;
    margin-right: 20px;
    color: #e74c3c;
    font-size: 1.2rem;
    padding: 5px 10px;
    background-color: #fff;
    border-radius: 5px;
    box-shadow: 0 2px 5px rgba(0,0,0,0.2);
}

.news-feed-marquee {
    overflow: hidden;
    white-space: nowrap;
    margin-top: 10px;
}

.news-feed-track {
    display: inline-flex;
    align-items: center;
    padding-left: 100%;
    animation: scroll-left 50s linear infinite;
    list-style: none; /* disable default bullets */
    margin: 0;
}

.news-feed-track li {
    margin-right: 80px; /* spacing between items */
    font-weight: 500;
    color: #333;
    position: relative;
    padding-left: 20px;  /* space for bullet */
    white-space: nowrap;
}

.news-feed-track li::before {
    content: "\2022";   /* solid bullet Unicode */
    position: absolute;
    left: 0;
    color: #e74c3c;     /* bullet color */
    font-size: 1.2rem;
    line-height: 1;
}

.news-feed-track li i {
    margin-right: 5px;
}

.news-feed-track li:hover {
    color: #e74c3c;
}

@keyframes scroll-left {
    0% { transform: translateX(0); }
    100% { transform: translateX(-100%); }
}

/* Pause animation on hover */
.news-feed-marquee:hover .news-feed-track {
    animation-play-state: paused;
}