/* html, body {
    overflow-x: hidden;
    width: 100%;
} */

html, body {
  overflow-x: clip; /* Prevents side-scrolling but is more efficient */
  scroll-behavior: smooth;
}

.al-footer-image-wrapper {
	  background-color: #0B214B; /* Matches image background */
	  padding: 0; /* Removes extra spacing */
	  margin: 0; /* Removes any margin */
	  width: 100vw; /* Ensures it spans the full width */
	  text-align: center; /* Ensures the image is centered */
}
ul {
    margin: 0 0 0 0.2rem;
}
#pl-60606 .so-panel {
    margin-bottom: 0 
}

.gridContainer {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

section {
    padding: 0 !important;
}

.al-workshops-section {
    padding: 0 20px !important;
}

.al-register-section {
    padding-left: 20px !important;
    padding-right: 20px !important;
}

.al-workshops-section h2 {
    padding-top: 50px;
}

/* Section Titles */
.al-text-content h2,
.al-workshops-section h2,
.al-sponsors-section h2,
.al-contact-section h2 {
    font-weight: 800 !important;
}

.page-content {
    padding-bottom:0 !important;
}
/* Full-Screen Hero Section */
.al-hero {
    margin-top: 40px;
    width: 100vw;
/*   height: 100vh; */
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    background-color:  #101d44;
}

.al-hero img {
    width: 100%;
/*   height: 100%; */
    object-fit: cover; /* Ensures it fills the space */
}

/* Make sure video fills the hero section */
.al-hero-video {
/*   position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100vw;
    height: 100vh;
    object-fit: cover;
    z-index: 0; */
}

/* General Layout Fixes */
.gridContainer {
    margin: 0;
    padding-right: 0;
    padding-left: 0;
    max-width: 100vw;
    width: 100%;
}

/* Hide Header Wrapper */
.header-wrapper {
    display: none;
}

/* Full-Width Section - General */
.al-full-width-section {
    display: flex;
    width: 100vw;
    min-height: 60vh; /* Ensures it does not shrink too much */
    height: auto; /* Allows it to expand if needed */
    align-items: stretch;
    margin: 0;
    padding: 0;
    flex: 1 0 auto;
}

/* Text Section (Left) */
.al-text-content {
    flex: 3; /* 60% width */
    background-color:  #101d44;
    color: white;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 5vw;
    margin: 0;
}

.al-text-content h2 {
    color: #70AC58;
    font-size: 2.5rem;
    margin-bottom: 1rem;
}

.al-text-content p,
.al-text-content ul {
    font-size: 1.2rem;
    line-height: 1.6;
    list-style-type: none;
    padding: 0;
}

.al-text-content li {
    margin-bottom: 0.8rem;
}

.al-call-to-action {
    margin-top: 1.5rem;
    font-size: 1.2rem;
}

.al-call-to-action a {
    color: #70AC58;
    font-weight: bold;
    text-decoration: underline;
}

/* Image Section (Right) */
.al-image-content {
    flex: 2; /* 40% width */
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.al-image-content img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Full-Image Section (Right) */
.full-image {
    flex: 5 !important;
    display: flex;
    justify-content: flex-end; /* Aligns image fully on the right */
}

.full-image img {
    width: 100%;
    /*! height: 100%; */
    max-height: 1500px !important;
    object-fit: cover;
}

/* Reverse Layout - Image on the Left */
.reverse-layout {
    flex-direction: row-reverse;
}

/* Mobile Responsiveness */
@media (max-width: 900px) {
    .al-full-width-section {
    flex-direction: column;
    height: auto;
    }

    .al-text-content, .al-image-content {
    flex: none;
    width: 100%;
    height: auto;
    }

    .al-image-content img {
    height: auto;
    }
}

/* Add dashed green border only to sections with .with-border */
.al-full-width-section.with-border-blue {
    border-bottom: 2.5px dashed #70AC58;
    background-color:  #101d44;
}

.al-full-width-section.with-border-white {
    border-bottom: 2.5px dashed #70AC58;
    background-color:  #FFFFFF;
}

/* Call-to-action text - Make part of it white */
.al-call-to-action {
    margin-top: 1.5rem;
    font-size: 1.2rem;
    color: #101d44; /* Makes full sentence white */
}

.al-call-to-action a {
    color: #70AC58; /* Keeps the link mint-colored */
    font-weight: bold;
    text-decoration: underline;
}

/* Add mint checkmarks before list items */
.al-text-content ul {
    list-style: none; /* Removes default bullets */
    padding: 0;
}

.al-text-content li {
    margin-bottom: 0.8rem;
    font-size: 1.2rem;
    line-height: 1.6;
    position: relative;
    padding-left: 30px; /* Adds space for the checkmark */
}

/* Mint-colored checkmark icon */
.al-text-content li::before {
    content: "✔"; /* Unicode checkmark */
    position: absolute;
    left: 0;
    top: 0;
    color: #70AC58; /* Mint color */
    font-size: 1.3rem;
    font-weight: bold;
}

#pg-60603-0, #pl-60603 .so-panel {
    margin-bottom: 0;
}

.al-full-image-section {
    max-width: 100vw;
}

/* Full-Image Section (Right) - Ensures Full Image Visibility */
.full-image {
    flex: 2;
    display: flex;
    justify-content: flex-end; /* Aligns image fully to the right */
    align-items: center; /* Centers vertically */
    width: 100%;
    height: 100%;
    overflow: hidden;
}

/* Ensure the image is fully visible and responsive */
.full-image img {
    width: 100%;
    max-height: 500px; /* Prevents cutting off on smaller screens */
    object-fit: contain; /* Ensures the full image is visible without cropping */
    display: block;
}

/* Mobile Responsiveness - Ensure full image visibility */
@media (max-width: 900px) {
    .al-full-width-section {
    flex-direction: column;
    height: auto;
    }

    .al-text-content, .al-image-content, .full-image {
    flex: none;
    width: 100%;
    height: auto;
    }

    .full-image img {
    width: 100%;
    height: auto;
    object-fit: contain; /* Ensures image scales down properly */
    }
}

/* Register Button Container */
.al-register-container {
    text-align: center; /* Centers the button */
    /*! margin-top: 2rem; */ /* Adds spacing above */
}

/* Register Section - Ensures Full-Width Dark Blue Background */
.al-register-section {
    background-color:  #101d44; /* Dark blue */
    padding: 3rem 0; /* Adds vertical spacing */
    display: flex;
    justify-content: center; /* Centers button horizontally */
    align-items: center; /* Centers button vertically */
    width: 100%; /* Full width */
    text-align: center; /* Ensures content stays centered */
}

/* Register Button Styling */
.al-register-button {
    display: inline-block;
    background-color: #70AC58; /* Mint color */
    color: white; /* White text */
    font-size: 1.8rem; /* Further increased font size */
    font-weight: bold;
    text-transform: uppercase;
    text-decoration: none;
    padding: 1.5rem 3rem; /* Increased padding for a larger button */
    border-radius: 12px; /* Makes it rounded */
    transition: background 0.3s ease, transform 0.2s ease;
    text-align: center;
}

/* Button Hover Effect */
.al-register-button:hover {
    /*background-color: #32C9A0; */
    transform: scale(1.05); /* Subtle scaling effect */
    color: white; /* White text */
}

/* Button Click Effect */
.al-register-button:active {
    transform: scale(0.98); /* Slight shrink effect on click */
}

/* Mobile Responsiveness */
@media (max-width: 900px) {
    .al-register-section {
    padding: 2rem 0; /* Adjust padding for smaller screens */
    }

    .al-register-button {
    font-size: 1.4rem; /* Keep large but manageable on mobile */
    padding: 1.2rem 2.5rem; /* Adjusted padding */
    }
}

/* Workshops Section */
.al-workshops-section {
    background-color:  #101d44; /* Dark blue background */
    color: #102A5C; /* White text */
    padding: 2vw 10vw 0;
}

.al-workshops-section h2 {
    text-align: center;
    color: #70AC58; /* Mint-colored title */
    font-size: 2.5rem;
    margin-bottom: 2rem;
}

/* Workshop Container */
.al-workshops-container {
    max-width: 1200px;
    margin: 0 auto;
}

/* Individual Workshop */
.al-workshop {
    margin-bottom: 1rem;
    border-bottom: 2px dashed #70AC58; /* Dashed mint separator */
    padding-bottom: 1rem;
}

/* Workshop Toggle Button - Fully Rounded */
.al-workshop-toggle {
    width: 100%;
    background-color: white;
    color: #70AC58;
    font-size: 1.3rem;
    font-weight: bold;
    padding: 1rem 1.5rem;
    border: 2px solid #70AC58;
    text-align: left;
    cursor: pointer;
    border-radius: 12px;
    transition: background 0.3s ease, transform 0.2s ease, border-color 0.3s ease;
    position: relative;
    z-index: 2;
}

/* Hover and Active State for Buttons */
.al-workshop-toggle:hover,
.al-workshop-toggle:focus {
    transform: scale(1.02);
}

/* Adjust Workshop Toggle Button Size for Narrow Screens */
@media (max-width: 900px) {
    .al-workshop-toggle {
    font-size: 1.1rem; /* Reduce text size for better fit */
    padding: 0.8rem 1.2rem; /* Adjust padding */
    }
}

/* Workshop Content - Make it feel connected */
.al-workshop-content {
    display: none; /* Hidden by default */
    background-color: white; /* Darker blue */
    padding: 1.5rem;
    border-left: 4px solid #70AC58; /* Mint left border */
    margin-top: -10px; /* Move slightly up to blend with toggle */
    border-radius: 25px; /* Rounded corners for smooth transition */
    transition: all 0.3s ease-in-out;
    position: relative;
    z-index: 1; /* Keeps it behind the toggle */
}

/* Opened Workshop Content - Appears seamlessly under the toggle */
.al-workshop.active .al-workshop-content {
    display: block;
}

/* Ensure content feels naturally connected without flattening the toggle */
.al-workshop-content.active {
    border-top-left-radius: 25px;
    border-top-right-radius: 25px;
}

/* Subtitles */
.al-workshop-content h3 {
    color: #70AC58; /* Mint-colored subtitles */
    font-size: 1.4rem;
    margin-top: 1rem;
}

/* Lists */
.al-workshop-content ul {
    list-style: none;
    padding: 0;
}

.al-workshop-content li {
    position: relative;
    padding-left: 30px;
    margin-bottom: 0.8rem;
}

/* Mint-colored checkmarks */
.al-workshop-content li::before {
    content: "✔";
    position: absolute;
    left: 0;
    top: 0;
    color: #70AC58;
    font-size: 1.3rem;
    font-weight: bold;
}

.agenda-list li:before {
    content: ">" !important;
}

/* Lecturer Section - Default Layout */
.al-lecturer {
    display: flex;
    align-items: center;
    background-color:  #101d44;
    padding: 1rem;
    border-radius: 8px;
    margin-top: 1rem;
    max-width: 100%; /* Prevents overflow */
    overflow: hidden; /* Ensures it doesn’t break layout */
    flex-wrap: nowrap; /* Prevents breaking into two rows on larger screens */
}

/* Lecturer Image */
.al-lecturer img {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    object-fit: cover;
    margin-right: 1rem;
    border: 2px solid #70AC58;
    flex-shrink: 0; /* Prevents image from shrinking */
    min-width: 80px; /* Prevents layout breaking */
}

/* Lecturer Text */
.al-lecturer h4 {
    color: #70AC58;
    font-size: 1.3rem;
    flex: 1; /* Allows text to take remaining space */
    word-wrap: break-word; /* Ensures long names wrap instead of breaking layout */
    overflow-wrap: break-word;
}

/* Mobile Responsiveness - Stack Image Above Text */
@media (max-width: 600px) {
    .al-lecturer {
    flex-direction: column;
    text-align: center;
    align-items: center;
    padding: 1rem;
    max-width: 100%;
    flex-wrap: wrap; /* Ensures wrapping if needed */
    }

    .al-lecturer img {
    width: 100px; /* Slightly larger on mobile */
    height: 100px;
    margin-bottom: 0.5rem;
    margin-right: 0; /* Center alignment */
    }

    .al-lecturer h4 {
    font-size: 1.2rem;
    text-align: center; /* Centers text properly */
    }
}

/* Sponsors Section - Full Width with Dark Blue Background */
.al-sponsors-section {
    background-color:  #101d44; /* Dark blue */
    padding: 3rem 10vw; /* Vertical spacing + side padding */
    text-align: center;
}

/* Sponsors Heading */
.al-sponsors-section h2 {
    color: #70AC58; /* Mint color */
    font-size: 2.5rem;
    margin-bottom: 2rem;
}

/* Sponsor Container - Flexbox for alignment */
.al-sponsors-container {
    display: flex;
    justify-content: center;
    flex-wrap: wrap; /* Allows wrapping for multiple sponsors */
    gap: 2rem; /* Spacing between sponsors */
}

/* Individual Sponsor */
.al-sponsor {
    display: flex;
    align-items: center;
    justify-content: center;
    max-width: 250px; /* Prevents huge images */
    flex: 1 1 auto; /* Responsive width */
}

/* Sponsor Logos */
.al-sponsor img {
    max-width: 100%;
    height: auto; /* Keeps aspect ratio */
    object-fit: contain; /* Ensures full visibility */
    border-radius: 8px; /* Optional rounded corners */
}

/* Mobile Adjustments */
@media (max-width: 600px) {
    .al-sponsors-container {
    flex-direction: column; /* Stack images on mobile */
    align-items: center;
    }

    .al-sponsor {
    max-width: 80%; /* Adjusted for small screens */
    }
}

/* Contact Section */
.al-contact-section {
    padding: 4rem 10vw 0; /* Spacious padding */
    text-align: center;
    background-color: white; /* Ensures contrast */
    color:  #101d44; /* Dark blue text */
}

/* Contact Heading */
.al-contact-section h2 {
    color:  #101d44; /* Dark blue */
    font-size: 2.5rem;
    margin-bottom: 1.5rem;
}

/* Contact Paragraph */
.al-contact-section p {
    font-size: 1.2rem;
    line-height: 1.6;
    max-width: 700px;
    margin: 0 auto 2rem auto; /* Center text */
    color:  #101d44; /* Ensures text is dark blue */
}

/* Mobile Adjustments */
@media (max-width: 600px) {
    .al-contact-section {
    padding: 3rem 5vw; /* Reduce padding */
    }

    .al-contact-section h2 {
    font-size: 2rem; /* Slightly smaller on mobile */
    }

    .al-contact-section p {
    font-size: 1.1rem;
    }
}

/* Inverted Color Scheme */
.al-inverted {
    background-color: white !important;
    color: #101d44 !important;
}

.al-lecturer p {
    color: white;
}

li {
    text-align: left;
}

p {
    text-align: justify;
}

.al-contact-section p {
    text-align: center;
}


/* Reduce text size for better readability on smaller screens */
@media (max-width: 900px) {
    .al-text-content h2,
    .al-workshops-section h2,
    .al-sponsors-section h2,
    .al-contact-section h2 {
    font-size: 2rem !important;
    }

    .al-text-content p,
    .al-text-content ul,
    .al-text-content li,
    .al-call-to-action,
    .al-workshop-content p,
    .al-workshop-content li,
    .al-lecturer h4 {
    font-size: 1.1rem !important;
    line-height: 1.5 !important;
    }
}

@media (max-width: 600px) {
    .al-text-content h2,
    .al-workshops-section h2,
    .al-sponsors-section h2,
    .al-contact-section h2 {
    font-size: 1.8rem !important;
    }

    .al-text-content p,
    .al-text-content ul,
    .al-text-content li,
    .al-call-to-action,
    .al-workshop-content p,
    .al-workshop-content li,
    .al-lecturer h4 {
    font-size: 1rem !important;
    line-height: 1.4 !important;
    }
}