/* =========================================================
   V54 - 2026-08-28 website feedback
   Loaded after styles.css so these decisions remain consistent on every page.
   ========================================================= */

/* Keep the active Dealer Portal location visible while its submenu is open. */
.dealer-menu__location:hover .dealer-menu__location-trigger,
.dealer-menu__location:focus-within .dealer-menu__location-trigger,
.dealer-menu__location.is-open .dealer-menu__location-trigger {
    color: #ffffff;
    background: var(--navy-900);
    box-shadow: 0 8px 20px rgba(8, 23, 40, 0.18);
}

.dealer-menu__location:hover .dealer-menu__location-trigger span,
.dealer-menu__location:focus-within .dealer-menu__location-trigger span,
.dealer-menu__location.is-open .dealer-menu__location-trigger span {
    color: var(--gold-400);
}

/* The floating navigation and homepage cover use one shared corner radius. */
.nav-shell,
.hero {
    border-radius: 34px;
}

@media (max-width: 1080px) {
    .nav-shell,
    .hero {
        border-radius: 28px;
    }
}

/* Keep the gold cover labels but remove the AI-style leading dash. */
.hero .eyebrow::before,
.page-hero .eyebrow::before {
    display: none;
    content: none;
}

/* Remove the vertical Discover decoration from every homepage slide. */
.hero__scroll {
    display: none;
}

/* Use one headline scale for all standard and campaign carousel slides. */
.hero__content .display-title,
.hero__content--campaign .display-title,
.hero__content--responsive-campaign .display-title {
    max-width: 760px;
    font-size: clamp(3.75rem, 5vw, 5.8rem);
    line-height: 0.98;
    letter-spacing: -0.035em;
}

/* Keep light mobile campaign copy readable over detailed photography. */
@media (max-width: 820px) {
    .hero__slide--responsive-campaign.hero__slide--light-copy::before {
        background: linear-gradient(
            180deg,
            rgba(250, 248, 243, 0.99) 0%,
            rgba(250, 248, 243, 0.94) 34%,
            rgba(250, 248, 243, 0.64) 56%,
            rgba(250, 248, 243, 0.12) 76%,
            transparent 88%
        );
    }

    .hero__content .display-title,
    .hero__content--campaign .display-title,
    .hero__content--responsive-campaign .display-title {
        max-width: 100%;
        font-size: clamp(2.65rem, 12.2vw, 4rem);
    }

    .hero__content--responsive-campaign.hero__content--light-copy .display-title,
    .hero__content--responsive-campaign.hero__content--light-copy p {
        text-shadow: 0 1px 16px rgba(255, 255, 255, 0.9);
    }
}

@media (max-width: 390px) {
    .hero__content .display-title,
    .hero__content--campaign .display-title,
    .hero__content--responsive-campaign .display-title {
        font-size: clamp(2.35rem, 11.6vw, 3.15rem);
    }
}

/* Prevent small source-edge artifacts from appearing around product cutouts. */
.catalog-card__media img {
    clip-path: inset(2px);
}

/* Keep the footer call-to-action aligned on one line. */
.footer-intro__contact {
    white-space: nowrap;
}

/* Make the newsletter prompt visible on the warm-white input background. */
.site-footer .footer-newsletter input {
    color: var(--navy-900);
}

.site-footer .footer-newsletter input::placeholder {
    color: rgba(16, 43, 68, 0.58);
    opacity: 1;
}

/*
   The Contact map source is 2880 x 1618. On wide screens the hero keeps the
   source ratio and scales with the page width, eliminating side gaps.
*/
@media (min-width: 1081px) {
    .page-hero--contact {
        width: 100%;
        min-height: 0;
        aspect-ratio: 2880 / 1618;
        background: #f4efe7;
    }

    .page-hero--contact .page-hero__media {
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        transform: none;
    }

    .page-hero--contact:hover .page-hero__media {
        transform: none;
    }
}

/*
   Keep the desktop Dealer Portal panel at its final two-column width from the
   moment it opens. The previous 230px-to-460px width animation repeatedly
   changed the hover boundary and could make the menu flicker under the cursor.
*/
@media (min-width: 1081px) {
    .dealer-menu::after {
        width: 460px;
        height: 16px;
    }

    .dealer-menu__panel,
    .dealer-menu__panel:has(.dealer-menu__location:hover),
    .dealer-menu__panel:has(.dealer-menu__location:focus-within),
    .dealer-menu__panel:has(.dealer-menu__location.is-open) {
        width: 460px;
        transition: opacity 160ms ease, visibility 160ms ease,
            transform 180ms var(--ease-out);
    }

    .dealer-menu__submenu {
        transform: none;
        transition: opacity 140ms ease, visibility 140ms ease;
    }

    /* A more compact active location keeps the menu familiar and lightweight. */
    .dealer-menu__location-trigger {
        width: 198px;
        min-height: 42px;
        margin: 3px 6px;
        padding: 7px 11px;
        border-radius: 9px;
    }

    .dealer-menu__submenu a {
        min-height: 48px;
        padding-block: 9px;
    }

    .dealer-menu__location:hover .dealer-menu__submenu,
    .dealer-menu__location:focus-within .dealer-menu__submenu,
    .dealer-menu__location.is-open .dealer-menu__submenu {
        transform: none;
    }
}