/* Bootstrap 5 carousel behavior with the existing Bootstrap 3 theme and item classes. */
#myCarousel .carousel-item { position: relative; float: left; width: 100%; margin-right: -100%; backface-visibility: hidden; transition: transform .6s ease-in-out; }
#myCarousel .carousel-item-next, #myCarousel .carousel-item-prev { display: block; }
#myCarousel .carousel-item-next:not(.carousel-item-start), #myCarousel .active.carousel-item-end { transform: translateX(100%); }
#myCarousel .carousel-item-prev:not(.carousel-item-end), #myCarousel .active.carousel-item-start { transform: translateX(-100%); }
#myCarousel .carousel-item-next.carousel-item-start, #myCarousel .carousel-item-prev.carousel-item-end { transform: translateX(0); }
@media (prefers-reduced-motion: reduce) { #myCarousel .carousel-item { transition: none; } }

/* Keep the homepage banner below its fixed, responsive contact/navigation header. */
.fnh-performance-home { margin-top: var(--fnh-navbar-height, 120px) !important; }
@media (max-width: 767px) { .fnh-performance-home { margin-top: var(--fnh-navbar-height, 196px) !important; } }