/* Home: fixed welcome bar + fixed #topnav.
   Keep welcome bar visible ABOVE menu, and keep menu pushed below it to avoid overlap. */
@media (min-width: 576px) {
    .tagline.tagline-sticky {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        width: 100% !important;
        z-index: 1001 !important;
        margin: 0 !important;
    }

    .tagline.tagline-sticky .container {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }

    .tagline.tagline-sticky h6 {
        margin: 0 !important;
        padding: 0.5rem 0 !important;
        line-height: 1.25rem !important;
    }

    /* Keep menu always below welcome bar, even when theme adds .nav-sticky on scroll. */
    #topnav.tagline-height,
    #topnav.tagline-height.nav-sticky,
    #topnav.tagline-height.is-sticky,
    #topnav.tagline-height.defaultscroll.nav-sticky {
        top: var(--home-tagline-h, 2.25rem) !important;
        margin-top: 0 !important;
        z-index: 1000 !important;
    }
}

.min-h-\[420px\] {
    min-height: 420px;
}

.h-\[60vh\] {
    height: 60vh;
}

@media (min-width: 640px) {
    .sm\:h-\[68vh\] {
        height: 68vh;
    }
}

@media (min-width: 768px) {
    .md\:h-\[78vh\] {
        height: 78vh;
    }
}

@media (min-width: 1024px) {
    .lg\:h-\[614\.66px\] {
        height: 614.66px;
    }
}

@media (min-width: 1280px) {
    .xl\:h-\[738\.66px\] {
        height: 738.66px;
    }
}

@media (max-width: 767px) {
    #home.swiper-slider-hero {
        margin-top: 72px;
        height: 60vh;
        min-height: 0;
    }

    #home .hero-media-bg {
        background-size: 100% auto !important;
        background-position: center top !important;
    }

    #home .slide-inner > .container.relative {
        display: none !important;
    }

    #home .swiper-pagination {
        display: none !important;
    }
}

@media (min-width: 768px) {
    #home.swiper-slider-hero {
        margin-top: 0 !important;
        height: 100vh !important;
        min-height: 0 !important;
    }

    #home .hero-media-bg {
        background-size: cover !important;
        background-position: center center !important;
    }

    #home .hero-media-video {
        object-fit: cover !important;
    }

    #home .slide-inner > .container.relative {
        display: block !important;
    }

    #home .swiper-pagination {
        display: block !important;
    }
}

/* Site footer: same brand fill as nav icon buttons (bg-alburaq). */
footer.footer {
    background-color: var(--color-alburaq) !important;
    color: #ffffff !important;
}

.dark footer.footer {
    background-color: var(--color-alburaq) !important;
    color: #ffffff !important;
}

footer.footer p,
footer.footer .footer-list a {
    color: rgba(255, 255, 255, 0.88) !important;
}

footer.footer h5,
footer.footer h6 {
    color: #ffffff !important;
}

footer.footer label.form-label {
    color: rgba(255, 255, 255, 0.92) !important;
}

footer.footer .footer-list a:hover {
    color: #ffffff !important;
}

footer.footer ul.list-none.mt-6 a.size-8 {
    background-color: transparent !important;
    border: 1px solid rgba(255, 255, 255, 0.4) !important;
    color: #ffffff !important;
}

footer.footer ul.list-none.mt-6 a.size-8:hover {
    color: #ffffff !important;
    border-color: rgba(255, 255, 255, 0.75) !important;
}

footer.footer .border-t {
    border-top-color: rgba(255, 255, 255, 0.28) !important;
}

footer.footer input[type="email"] {
    background-color: #ffffff !important;
    border: 0 !important;
    color: #0f172a !important;
}

footer.footer input[type="email"]::placeholder {
    color: #64748b !important;
    opacity: 1;
}

footer.footer .form-icon [data-feather="mail"],
footer.footer .form-icon svg {
    color: #64748b !important;
}

footer.footer .mdi:not(.text-red-600) {
    color: #ffffff !important;
}

footer.footer button[type="submit"],
footer.footer #submitsubscribe {
    background-color: #0f172a !important;
    color: #ffffff !important;
}
