.banner-carousel { position: relative; width: 100%; min-height: clamp(32rem, 48vw, 47rem); overflow: hidden; color: #fff; background: var(--color-forest); }
.banner-carousel-stage, .banner-slide { min-height: inherit; }
.banner-slide { position: relative; isolation: isolate; display: grid; align-items: end; }
.banner-slide[hidden] { display: none; }
.banner-slide picture, .banner-slide picture img { position: absolute; inset: 0; width: 100%; height: 100%; }
.banner-slide picture { z-index: -2; }
.banner-slide picture img { object-fit: cover; }
.banner-overlay { position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(2, 35, 25, 0.78) 0%, rgba(2, 35, 25, 0.44) 48%, rgba(2, 35, 25, 0.08) 78%); }
.banner-content { width: min(calc(100% - (2 * var(--gutter))), var(--container)); margin-inline: auto; padding: clamp(7rem, 14vw, 11rem) 0 clamp(5.5rem, 9vw, 7.5rem); }
.banner-content > * { max-width: 45rem; }
.banner-align-center .banner-content { text-align: center; }
.banner-align-center .banner-content > * { margin-inline: auto; }
.banner-align-right .banner-content { text-align: right; }
.banner-align-right .banner-content > * { margin-left: auto; }
.banner-align-center .banner-overlay { background: rgba(2, 35, 25, 0.52); }
.banner-align-right .banner-overlay { background: linear-gradient(270deg, rgba(2, 35, 25, 0.78) 0%, rgba(2, 35, 25, 0.4) 48%, rgba(2, 35, 25, 0.06) 78%); }
.banner-event-meta { margin: 0 0 1rem; color: #80e8ae; font-size: 0.74rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; }
.banner-content h2 { margin: 0; color: #fff; font-size: clamp(2.45rem, 5.5vw, 5rem); line-height: 1.01; letter-spacing: -0.05em; text-wrap: balance; }
.banner-subtitle { margin: 1.3rem 0 0; color: #edf6f1; font-size: clamp(1rem, 1.8vw, 1.22rem); line-height: 1.75; text-wrap: balance; }
.banner-cta { display: inline-flex; min-height: 3.2rem; align-items: center; margin-top: 1.8rem; padding: 0.72rem 1.25rem; border: 1px solid #fff; border-radius: 0.72rem; color: var(--color-forest); background: #fff; font-size: 0.84rem; font-weight: 700; text-decoration: none; transition: color var(--transition), background var(--transition), transform var(--transition); }
.banner-cta:hover { color: #fff; background: transparent; transform: translateY(-1px); }
.banner-carousel-controls { position: absolute; bottom: 1.35rem; left: 50%; z-index: 3; display: flex; width: max-content; max-width: calc(100% - (2 * var(--gutter))); justify-content: center; pointer-events: none; transform: translateX(-50%); }
.banner-carousel-controls[hidden] { display: none; }
.banner-carousel-indicators { display: flex; align-items: center; justify-content: center; gap: 0.3rem; pointer-events: auto; }
.banner-carousel-indicators button { position: relative; width: 1.6rem; height: 1.6rem; padding: 0; overflow: hidden; border: 0; border-radius: 50%; color: transparent; background: transparent; cursor: pointer; }
.banner-carousel-indicators button::before { position: absolute; top: 50%; left: 50%; width: 0.42rem; height: 0.42rem; border: 1px solid rgba(255,255,255,.42); border-radius: 50%; background: rgba(255,255,255,.58); content: ""; transform: translate(-50%, -50%); transition: width var(--transition), background var(--transition); }
.banner-carousel-indicators button:hover::before,
.banner-carousel-indicators button:focus-visible::before { background: rgba(255,255,255,.86); }
.banner-carousel-indicators button.is-active::before { width: 0.9rem; border-radius: 999px; background: #fff; }
.banner-carousel-loading, .banner-carousel-error { display: grid; min-height: inherit; place-items: center; margin: 0; padding: 2rem; color: #d9ece2; text-align: center; }

@media (max-width: 48rem) {
    .banner-carousel { min-height: min(130vw, 45rem); }
    .banner-slide { align-items: end; }
    .banner-content { padding: 7rem 0 7rem; text-align: left !important; }
    .banner-content > * { margin-right: auto; margin-left: 0; }
    .banner-overlay, .banner-align-center .banner-overlay, .banner-align-right .banner-overlay { background: linear-gradient(0deg, rgba(2,35,25,.82) 0%, rgba(2,35,25,.38) 58%, rgba(2,35,25,.12) 100%); }
    .banner-carousel-controls { bottom: 0.9rem; }
}
@media (prefers-reduced-motion: reduce) {
    .banner-carousel *, .banner-carousel *::before, .banner-carousel *::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}