/* ==========================================================================
   Header / top-nav overrides
   Loaded globally after style.css so these rules win by source order.
   Purpose: reset the legacy 2-item header nav layout so it can hold 3+ items
   stacked directly below the logo (no overlap with the logo).
   ========================================================================== */

#top-nav {
    /* Remove negative pull-up so the nav sits below the logo in normal flow */
    margin-top: 0;
}

/* Neutralize the per-item paddings that were hard-coded for a 2-item layout */
#top-nav li,
#top-nav li:first-child,
#top-nav li:last-child,
#top-nav li:nth-child(1),
#top-nav li:nth-child(2) {
    width: auto;
    padding-left: 0;
    padding-right: 0;
    justify-content: center;
}

/* Comfortable horizontal spacing between the 3 nav items */
#top-nav > li + li {
    margin-left: 1rem;
}

@media print, screen and (min-width: 1024px) {
    #top-nav > li + li {
        margin-left: 1.5rem;
    }
}

/* ==========================================================================
   Offers: Passport Program link
   ========================================================================== */

/* Card uses a "stretched link" overlay so the whole cell is clickable while
   still allowing the passport link inside to be independently clickable
   (avoids invalid nested <a> tags). */
#offers-content .cell {
    position: relative;
}

#offers-content .entry-link {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1;
}

/* Keep the CTA arrow hover animation now that .cta is no longer inside .entry-link.
   The CTA carries its own link and sits above the card overlay so it is the
   direct hover/click target for "View Website". */
#offers-content .cta {
    position: relative;
    z-index: 2;
}

#offers-content .cta a {
    color: inherit;
}

#offers-content .cta svg {
    transition: transform .5s ease;
}

#offers-content .cta:hover svg {
    transform: translateX(.5rem);
}

.passport-program {
    position: relative;
    z-index: 2;
    margin-bottom:1rem;
}

.passport-program-link {
    color: #006265;
    font-weight: 600;
    font-style: italic;
    
}