/* ======================================
   BANNER HOME - BOURBON STREET
   ====================================== */
.banner-home {
    margin: 30px auto 0 auto;
    overflow: hidden; /* prevent any horizontal bleed from decorations/zoom */
}

.banner-home .swiper-container {
    margin-top: 50px;
}

.banner-home .dancing-roof-characters {
    margin-bottom: 0px;
}

.banner-home .swiper {
    height: 450px;
}

/* style like a h3 */
.banner-home .pre-title {
    font-family: Crimson Pro;
    font-size: 43px;
	font-weight: 600;
    line-height: 1.1;
    text-wrap: balance;
}

.banner-home .pre-title-desktop {
    display: inline-block;
}

/* Mobile-only titles: hidden on desktop */
.banner-home .pre-title-mobile {
    display: none;
}

/* Container for top dancing characters and headings */
.banner-home .banner-titles {
    width: 100%;
    padding: 0 16px; /* mobile friendly side padding */
    box-sizing: border-box;
    text-align: center;
    overflow: hidden; /* clip decorative caps safely */
}

/* Decorative title inherits global styles from decorative-elements.css */

.agenda-slide-card::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image: var(--bg-image);
    background-size: cover;
    background-position: center;
    border-radius: 2px;
}

.agenda-slide-card {
    height: 100%;
    width: 100%;
    transition: all 300ms;
    border-radius: 4px;
    display: block;
}

.agenda-slide-card::after {
    content: "";
    position: absolute;
    inset: -6px;
    border: 2px solid var(--primary-700);
    border-radius: 4px;
    opacity: 0;
    transition: all 300ms ease;
    pointer-events: none;
    z-index: -1;
}

/* Hover animation */
.agenda-slide-card:hover::after {
    border-color: var(--primary-500);
}
.agenda-slide-card:hover .content {
    color: var(--white-transparent);
}
.agenda-slide-card:hover .overlay::before {
    opacity: 1;
}

/*  active slide */
.swiper-slide-active .agenda-slide-card {
    transform: scale(1.2);
}

.swiper-slide-active .agenda-slide-card::after {
    opacity: 1;
}

.agenda-slide-card .overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.8) -5%, transparent 65%);
    overflow: hidden;
}

.agenda-slide-card .overlay::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.35) 0%, transparent 70%);
    opacity: 0;
    transition: opacity 300ms ease;
    pointer-events: none;
}

.agenda-slide-card .content {
    position: absolute;
    bottom: 0;
    display: flex;
    flex-direction: column;
    padding: 32px;
    color: var(--white);
}

.agenda-slide-card .today-label {
    font-family: Crimson Text;
    font-weight: 600;
    display: inline-block;
    font-size: 24px;
    width: fit-content;
    color: #939D62;
    font-weight: 600;
    line-height: 1;
    text-transform: uppercase;
    background: var(--secondary-900);
    padding: 0 16px;
    clip-path: polygon(8px 0, 100% 0, calc(100% - 8px) 100%, 0 100%);
}

.agenda-slide-card .artist {
    margin-top: 3px;
    text-transform: uppercase;
    line-height: normal;
}

.agenda-slide-card .date {
    font-family: Crimson Pro;
    font-weight: 300;
    font-size: 15px;
    text-transform: uppercase;
    line-height: normal;
}

/* Footer text */
.swiper-footer-text {
    text-align: center;
    color: var(--white);
    font-size: 20px;
    font-weight: 300;
    text-transform: uppercase;
}

.swiper-footer-text span {
    font-weight: 700;
}


/* Responsive adjustments */
@media (max-width: 1200px) {
    .banner-home .swiper {
        height: 400px;
    }
}

@media (max-width: 768px) {
    .banner-home .swiper-container {
        margin: 10px 0;
    }

    .banner-home .swiper {
        height: 350px;
    }

    .banner-home .banner-titles {
        padding: 0 32px;
    }

    .banner-home .pre-title {
        font-size: 29px;
    }

    .banner-home .pre-title-desktop {
        display: none;
    }

    .banner-home .pre-title-mobile {
        display: inline-block;
    }

    .agenda-slide-card .content {
        padding: 16px;
    }

    .agenda-slide-card .today-label {
        font-size: 16px;
    }
    
    /* Hide swiper navigation on mobile */
    .swiper-navigation {
        display: none;
    }
}

@media (max-width: 480px) {
    .banner-home .swiper {
        height: 300px;
    }
}