<style>
    body {
        min-height: 100vh;
        display: flex;
        flex-direction: column;
    }
    main {
        flex: 1;
    }
    footer a {
        text-decoration: none;
    }

    h2 {
        color: #63a588;
    }

    .navbar-custom {
        background-color: #77d1a9;
    }

    .homepage-content-one {
        background-color: #e7cc7a;
    }

    .footer-custom {
        background-color: #e9e9e9;
    }

    .custom-carousel-btn {
        width: 48px;
        height: 48px;
        background-color: rgba(0, 0, 0, 0.3);
        border-radius: 50%;
        z-index: 2;
    }

    .carousel-control-prev-icon,
    .carousel-control-next-icon {
        filter: invert(1);
    }

    .custom-carousel-btn:hover {
        background-color: rgba(0, 0, 0, 0.5);
    }

    .carousel-wrapper {
        position: relative;
    }

    /* Desktop: position arrows outside content */
    @media (min-width: 1200px)
    {
        .carousel-control-prev {
            position: absolute;
            top: 25%;
            left: 75px;
            transform: translateY(-50%);
        }

        .carousel-control-next {
            position: absolute;
            top: 25%;
            right: 75px;
            transform: translateY(-50%);
        }
    }

    /* Mobile: horizontal alignment in button row */
    .carousel-button-row {
        gap: 1rem;
    }

</style>