/* CSS Variables for consistent theming */
        :root {
            --jadara-blue: #6495ED;
			--dark-blue: #043284;
            --jadara-yellow: #FFFACD;
            --tech-teal: #048C7F;
            --dark-gray: #333333;
            --light-gray: #f9fafb;
            --text-color: #374151;
            --font-montserrat: 'Montserrat', sans-serif;
            --font-lato: 'Lato', sans-serif;
        }

        /* General Body Styles */
        body {
            font-family: var(--font-lato);
            background-color: #b9f4f4;
            color: var(--text-color);
            margin: 0;
        }

        .container {
            max-width: 75%;
            margin-left: auto;
            margin-right: auto;
            padding-left: 1.5rem;
            padding-right: 1.5rem;
        }

        /* Header & Navigation */
        .header {
            background-color: white;
            box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
            position: sticky;
            top: 0;
            z-index: 50;
        }

        .navbar {
			display: flex;
			justify-content: space-between;
			align-items: center;
			padding: 0.5rem 1rem;
			background-color: #fff;
			box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
			position: relative;
		}

		.logo img {
			height: 75px;
			width: 150px;
		}

		/* Navigation Links */
		.nav-links {
			display: flex;
			gap: 1.5rem;
		}

		.nav-link {
			text-decoration: none;
			color: #333;
			font-weight: 500;
			padding: 0.5rem 1rem;
			border-radius: 4px;
			transition: all 0.3s ease;
		}

		.nav-link:hover {
			color: #4f46e5;
			background-color: #eef2ff;
		}

		/* Hamburger Menu (Mobile) */
		.hamburger {
			display: none;
			cursor: pointer;
			padding: 10px;
		}

		.bar {
			display: block;
			width: 25px;
			height: 3px;
			margin: 5px auto;
			background-color: #333;
			transition: all 0.3s ease;
		}


		
		.btn {
		  display: inline-flex;
		  align-items: center;
		  justify-content: center;
		  padding: 0.5rem;
		  font-family: 'Segoe UI', Roboto, sans-serif;
		  font-size: 1rem;
		  font-weight: 600;
		  line-height: 1.5;
		  text-decoration: none;
		  text-align: center;
		  border-radius: 0.5rem;
		  cursor: pointer;
		  transition: all 0.3s ease;
		  border: none;
		  position: relative;
		  overflow: hidden;
		  user-select: none;
		}

		/* Primary Button */
		.btn-primary {
		  background-color: #4f46e5;
		  color: #fff;
		  box-shadow: 0 2px 4px rgba(79, 70, 229, 0.3);
		}

		.btn-primary:hover {
		  background-color: #4338ca;
		  transform: translateY(-1px);
		  box-shadow: 0 4px 8px rgba(79, 70, 229, 0.3);
		}

		.btn-primary:active {
		  transform: translateY(0);
		  box-shadow: 0 2px 4px rgba(79, 70, 229, 0.3);
		}

		/* Mobile Responsive Styles */
		@media (max-width: 768px) {
			.hamburger {
				display: block;
			}
			
			.hamburger.active .bar:nth-child(1) {
				transform: translateY(8px) rotate(45deg);
			}
			
			.hamburger.active .bar:nth-child(2) {
				opacity: 0;
			}
			
			.hamburger.active .bar:nth-child(3) {
				transform: translateY(-8px) rotate(-45deg);
			}
			
			.nav-links {
				position: fixed;
				left: -100%;
				top: 80px;
				flex-direction: column;
				background-color: #fff;
				width: 100%;
				text-align: center;
				transition: 0.3s;
				box-shadow: 0 10px 15px rgba(0, 0, 0, 0.1);
				padding: 1rem 0;
				gap: 0;
			}
			
			.nav-links.active {
				left: 0;
			}
			
			.nav-link {
				padding: 1rem 0;
				margin: 0.5rem 0;
			}
		}

        .register-btn {
            background-color: var(--tech-teal);
            color: white;
            font-weight: 700;
            padding: 0.5rem 1rem;
            border-radius: 0.5rem;
            text-decoration: none;
            transition: opacity 0.3s;
        }

        .register-btn:hover {
            opacity: 0.9;
        }
		/* Hero Section with Video Background */
        .hero-section {
            position: relative;
            color: white;
            text-align: center;
            padding: 6rem 1.5rem;
            overflow: hidden; /* Hide video overflow */
        }

        #hero-video {
            position: absolute;
            top: 50%;
            left: 50%;
            min-width: 100%;
            min-height: 100%;
            width: auto;
            height: auto;
            z-index: -2;
            transform: translateX(-50%) translateY(-50%);
            background-size: cover;
        }

        .hero-overlay {
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background-color: rgba(0, 0, 0, 0.6);
            z-index: -1;
        }

        .hero-content {
            position: relative;
            z-index: 1;
        }

        .hero-section h1 {
            font-family: var(--font-montserrat);
            font-size: 2.25rem;
            font-weight: 800;
            line-height: 1.2;
        }

        .hero-section .subtitle {
            font-size: 3rem;
            margin-top: 1rem;
            font-weight: 501;
        }

        .hero-section .date-location {
            margin-top: 1rem;
            font-size: 2.125rem;
            font-weight: 700;
        }

        .hero-section .date-location span {
            color: var(--tech-teal);
        }
		
        /* Countdown Timer */
        .countdown-timer {
            margin-top: 3rem;
            display: flex;
            justify-content: center;
            gap: 1rem;
        }

        .countdown-item {
            text-align: center;
            background-color: rgba(255, 255, 255, 0.2);
            padding: 1rem;
            border-radius: 0.5rem;
            width: 6rem;
        }

        .countdown-item .number {
            font-family: var(--font-montserrat);
            font-size: 2.25rem;
            font-weight: 700;
        }

        .countdown-item .label {
            font-size: 0.875rem;
            text-transform: uppercase;
        }

        /* General Section Styles */
        .section {
            padding: 3rem 0;
        }

        .section-title {
            font-family: var(--font-montserrat);
            font-size: 1.875rem;
            font-weight: 700;
            text-align: center;
            margin-bottom: 3rem;
        }

        /* About Section */
        .about-grid {
            display: grid;
            grid-template-columns: 1fr;
            gap: 3rem;
            align-items: center;
        }

        .about-text, .venue-info p {
            font-size: 1.125rem;
            line-height: 1.75;
            margin-top: 1rem;
			text-align:justify;
        }
        .about-text p:first-child {
            margin-top: 0;
        }

        .about-image img {
            width: 100%;
            height: auto;
            border-radius: 0.5rem;
            box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
        }

        /* Speakers Section */
        .speakers-section {
        /*    background-color: var(--jadara-yellow); */
        }
        
        .speakers-grid {
            display: grid;
            grid-template-columns: 1fr;
            gap: 2rem;
        }

        .speaker-card {
            background-color: white;
            padding: 1.5rem;
            border-radius: 0.5rem;
            box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
            text-align: center;
            transition: transform 0.3s;
        }

        .speaker-card:hover {
            transform: scale(1.05);
        }

        .speaker-card img {
            width: 11rem;
			height: 11rem;
			border-radius: 20%;
            margin: 0 auto 1rem auto;
            border: 4px solid var(--jadara-blue);
        }
        .speaker-card:nth-child(2) img { border-color: var(--tech-teal); }
        .speaker-card:nth-child(3) img { border-color: var(--dark-gray); }

        .speaker-card h3 {
            font-family: var(--font-montserrat);
            font-size: 1.25rem;
            font-weight: 700;
        }

        .speaker-card .affiliation {
            color: #6b7280;
        }

        .speaker-card .bio {
            font-size: 0.875rem;
            margin-top: 0.5rem;
        }
		
		/* Committees Section Redesign */
        .committees-grid {
            display: grid;
            grid-template-columns: 1fr;
            gap: 2rem;
        }

        .committee-card {
            background-color: white;
            border: 1px solid #000;
            border-radius: 0.25rem;
            overflow: hidden;
            box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
        }

        .committee-card-header {
            background-color: var(--jadara-blue);
            padding: 0.75rem 1.5rem;
        }

        .committee-card-header h3 {
            color: white;
            font-family: var(--font-montserrat);
            font-size: 1.25rem;
            font-weight: 700;
            margin: 0;
        }

        .committee-card-body {
            padding: 1.5rem;
        }

        .committee-member-list {
            list-style: none;
            padding: 0;
            margin: 0;
            display: flex;
            flex-direction: column;
            gap: 1rem;
        }

        .committee-member-list li {
            display: flex;
            align-items: flex-start;
        }

        .committee-member-list svg {
            width: 1rem;
            height: 1rem;
            margin-right: 0.75rem;
            margin-top: 0.25rem;
            flex-shrink: 0;
        }
        
        .member-info .name {
            font-weight: 700;
        }
        
        .member-info .role {
            font-size: 0.875rem;
            color: #6b7280;
        }
		
        /* Committees Section */
        .committee-title {
            font-family: var(--font-montserrat);
            font-size: 1.5rem;
            font-weight: 700;
            text-align: center;
            margin-bottom: 2rem;
            color: var(--jadara-blue);
        }

        .organizing-committee-grid {
            display: grid;
            grid-template-columns: 1fr;
            gap: 2rem;
            margin-bottom: 4rem;
        }

        .organizer-card {
            background-color: white;
            padding: 1rem;
            border-radius: 0.5rem;
            box-shadow: 0 2px 4px rgba(0,0,0,0.1);
            text-align: center;
        }
        .organizer-card .name { font-weight: 700; font-size: 1.125rem; }
        .organizer-card .role { font-size: 0.875rem; color: #6b7280; }
        .organizer-card .affiliation { font-size: 0.75rem; color: #9ca3af; }

        /* Committees Section Redesign */
        .committees-grid {
            display: grid;
            grid-template-columns: 1fr;
            gap: 2rem;
        }

        .committee-card {
            background-color: white;
            border: 1px solid #000;
            border-radius: 0.25rem;
            overflow: hidden;
            box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
        }

        .committee-card-header {
            background-color: var(--jadara-blue);
            padding: 0.75rem 1.5rem;
        }

        .committee-card-header h3 {
            color: white;
            font-family: var(--font-montserrat);
            font-size: 1.25rem;
            font-weight: 700;
            margin: 0;
        }

        .committee-card-body {
            padding: 1.5rem;
        }

        .committee-member-list {
            list-style: none;
            padding: 0;
            margin: 0;
            display: flex;
            flex-direction: column;
            gap: 1rem;
        }

        .committee-member-list li {
            display: flex;
            align-items: flex-start;
        }

        .committee-member-list svg {
            width: 1rem;
            height: 1rem;
            margin-right: 0.75rem;
            margin-top: 0.25rem;
            flex-shrink: 0;
        }
        
        .member-info .name {
            font-weight: 700;
        }
        
        .member-info .role {
            font-size: 0.875rem;
            color: #6b7280;
        }
		/* Gallery Slider Section */
        .gallery-section {
            background-color: var(--light-gray);
        }
        .slideshow-container {
            max-width: 1000px;
            position: relative;
            margin: auto;
            box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
            border-radius: 0.5rem;
            overflow: hidden;
        }

        .slide {
            display: none;
        }
        
        .slide img {
            width: 100%;
            vertical-align: middle;
        }

        .prev, .next {
            cursor: pointer;
            position: absolute;
            top: 50%;
            width: auto;
            padding: 16px;
            margin-top: -22px;
            color: white;
            font-weight: bold;
            font-size: 18px;
            transition: 0.6s ease;
            border-radius: 0 3px 3px 0;
            user-select: none;
            background-color: rgba(0,0,0,0.5);
        }

        .next {
            right: 0;
            border-radius: 3px 0 0 3px;
        }

        .prev:hover, .next:hover {
            background-color: rgba(0,0,0,0.8);
        }

        .dots-container {
            text-align: center;
            padding: 1rem 0;
        }

        .dot {
            cursor: pointer;
            height: 15px;
            width: 15px;
            margin: 0 2px;
            background-color: #bbb;
            border-radius: 50%;
            display: inline-block;
            transition: background-color 0.6s ease;
        }

        .active, .dot:hover {
            background-color: #717171;
        }

        .fade {
            animation-name: fade;
            animation-duration: 1.5s;
        }

        @keyframes fade {
            from {opacity: .4} 
            to {opacity: 1}
        }

        /* Sponsors Section */
        .sponsors-section {
        /*    background-color: var(--light-gray); */
        }
        .sponsors-logos {
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
            align-items: center;
            gap: 2rem;
        }
        .sponsor-logo {
            background-color: white;
            padding: 1rem;
            border-radius: 0.5rem;
            box-shadow: 0 2px 4px rgba(0,0,0,0.1);
        }
        .sponsor-logo img {
            height: 5rem;
        }
		/* Fees Section */
        .fees-title {
            color: #c53030;
            font-size: 2.25rem;
        }

        .fees-table-container {
            overflow-x: auto;
        }

        .fees-table {
            width: 100%;
            min-width: 800px;
            border-collapse: collapse;
            box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
            margin: 0 auto;
        }

        .fees-table th, .fees-table td {
            border: 1px solid #e2e8f0;
            padding: 0.75rem 1rem;
            text-align: center;
        }

        .fees-table thead, tbody th {
            background-color: var(--dark-blue);
            color: white;
            font-weight: 700;
        }

        .fees-table thead .category-header {
            background-color: #1a365d;
        }
        
        .fees-table thead .period-header {
            font-size: 0.875rem;
            font-weight: 400;
        }

        .fees-table tbody tr:nth-child(odd) {
            background-color: white;
        }

        .fees-table tbody tr:nth-child(even) {
            background-color: #f7fafc;
        }

        .fees-table .category-cell {
            font-weight: 700;
            background-color: #edf2f7;
        }

        .fees-table .fee-amount {
            color: #2b6cb0;
            font-weight: 700;
        }
        /* Venue Section */
        .venue-grid {
            display: grid;
            grid-template-columns: 1fr;
            gap: 2rem;
            align-items: center;
        }
        .venue-info h3 {
            font-family: var(--font-montserrat);
            font-size: 1.5rem;
            font-weight: 700;
        }
        .venue-info .location {
            font-size: 1.125rem;
            color: var(--jadara-blue);
        }
        .venue-info p {
            margin-top: 1rem;
            line-height: 1.75;
        }
        .venue-image img {
            width: 100%;
            border-radius: 0.5rem;
            box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
        }

        /* Footer */
        .footer {
            background-color: #535659;
            color: white;
        }
        .footer-grid {
            padding: 3rem 0;
            display: grid;
            grid-template-columns: 1fr 3fr;
            gap: 2rem;
            text-align: center;
        }
        .footer-grid h4 {
            font-family: var(--font-montserrat);
            font-size: 1.125rem;
            font-weight: 700;
        }
        .footer-grid p, .footer-grid li {
            font-size: 0.875rem;
            color: #d1d5db;
        }
        .footer-links {
            list-style: none;
            padding: 0;
            margin-top: 0.5rem;
            display: flex;
            flex-direction: column;
            gap: 0.25rem;
        }
        .footer-links a {
            color: #d1d5db;
            text-decoration: none;
            transition: color 0.3s;
        }
        .footer-links a:hover {
            color: white;
        }
        .footer-bottom {
            border-top: 1px solid #4b5563;
            padding: 1.5rem 0;
            text-align: center;
            font-size: 0.875rem;
            color: #9ca3af;
        }

		
        /* Responsive Media Queries */
	
		@media (min-width: 768px) {
            .nav-links {
                display: flex;
                gap: 1.5rem;
            }
            .hero-section h1 {
                font-size: 3.75rem;
            }
            .about-grid {
                grid-template-columns: 1fr 1fr;
            }
            .speakers-grid {
                grid-template-columns: repeat(2, 1fr);
            }
			.organizing-committee-grid {
                grid-template-columns: repeat(4, 1fr);
            }
            .committees-grid {
                grid-template-columns: repeat(2, 1fr);
            }
            .venue-grid {
                grid-template-columns: 1fr 1fr;
            }
            .footer-grid {
                grid-template-columns: 1fr 3fr;
                text-align: left;
            }
        }
        @media (min-width: 1024px) {
            .speakers-grid {
                grid-template-columns: repeat(3, 1fr);
            }
        }