/* ==========================================================================
   Homepage reskin — design tokens & shared component overrides.
   Loaded after landing/css/custom.css so it wins the cascade against the
   legacy stylesheets without needing !important everywhere.

   Global rules here (header, footer, popup, cookie banner, nav drawer) are
   intentionally site-wide since layouts/landing/app.blade.php is shared by
   every frontend page. Section-specific rules (promo banner, car grid,
   content rows, etc.) are scoped under their own component wrapper classes,
   which only ever render on the homepage, so they can't leak elsewhere.
   ========================================================================== */

:root {
    --navy: #0e1c30;
    --navy-soft: #14273f;
    --red: #e8433b;
    --cream: #f4f1ea;
    --radius-sm: 8px;
    --radius-md: 14px;
    --radius-lg: 22px;
    --shadow-card: 0 20px 40px -12px rgba(16, 24, 40, .18);
    --shadow-float: 0 30px 60px -20px rgba(16, 24, 40, .35);
}

/* ---------------------------------------------------------------------- */
/* Header / nav                                                            */
/* ---------------------------------------------------------------------- */

.is-current-page {
    padding: 6px 14px !important;
    border-bottom: none !important;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.14);
}

.mob_div .d-none.d-xl-flex a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.14);
    color: #fff;
}

.first_sle .dropdown.language-bar > .dropdown-toggle {
    display: inline-flex;
    align-items: center;
    padding: 8px 14px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.14);
}

.first_sle .dropdown.language-bar > .dropdown-toggle::after {
    top: 50% !important;
    transform: translateY(-50%);
}

@media (max-width: 1199px) {
    .mh_right {
        width: min(340px, 82vw);
        padding: 32px 28px;
        background: var(--navy);
    }

    .mh_right ul.main-menu-list {
        min-width: unset !important;
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
    }

    .mh_right ul.main-menu-list > li {
        width: 100%;
        padding-left: 0 !important;
    }

    .mh_right ul li a {
        display: block;
        width: 100%;
        padding: 14px 4px;
        font-size: 1.05rem;
        border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    }

    .mh_right ul li a:hover {
        border-bottom: 1px solid rgba(255, 255, 255, 0.08);
        color: var(--color-a2b-blue);
        padding-bottom: 14px;
    }

    .mh_right .extra_nav__icon {
        display: none;
    }

    .mh_right ul.dropdown-menu-custom {
        padding-left: 16px;
    }

    .mh_right ul.dropdown-menu-custom li a {
        color: rgba(255, 255, 255, 0.75) !important;
        border-bottom: none;
        padding: 10px 4px;
    }

    #closeMenu {
        color: #fff;
        font-size: 1.4rem;
    }
}

/* ---------------------------------------------------------------------- */
/* Footer                                                                   */
/* ---------------------------------------------------------------------- */

.my_footer hr {
    border-color: rgba(255, 255, 255, 0.15);
    opacity: 1;
}

.my_footer .logo_color {
    color: var(--color-a2b-blue);
}

.my_footer a {
    color: rgba(255, 255, 255, 0.75);
}

.my_footer a:hover {
    color: var(--color-a2b-blue);
}

.footer-hours-box {
    background: rgba(255, 255, 255, 0.06);
    border-radius: var(--radius-sm);
    padding: 12px 16px;
    margin-bottom: 12px;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.footer-hours-label {
    font-weight: 600;
    color: #fff;
    font-size: 0.9rem;
}

.footer-hours-value {
    font-size: 0.85rem;
    color: rgba(255, 255, 255, 0.75);
}

.footer_btn1 {
    background: var(--color-a2b-blue) !important;
    border-radius: 999px !important;
    padding: 10px 24px !important;
}

/* ---------------------------------------------------------------------- */
/* Misc                                                                     */
/* ---------------------------------------------------------------------- */

.collection_header {
    font-weight: 700;
}
