/* Contextual account benefits and stable mobile app chrome. */
.member-conversion-card {
    display: grid;
    gap: 1rem;
    padding: 1rem;
    border: 1px solid #c9ddd5;
    border-radius: 8px;
    background: linear-gradient(135deg, #fff 0%, #f3faf7 100%);
    box-shadow: 0 8px 24px rgba(11, 47, 51, .055);
}
.member-conversion-heading { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: .75rem; }
.member-conversion-heading > div { min-width: 0; }
.member-conversion-heading h2 { margin: .12rem 0 .3rem; color: #092126; font-size: 1.25rem; line-height: 1.15; }
.member-conversion-heading p { max-width: 52rem; margin: 0; color: #58706c; font-size: .84rem; line-height: 1.5; }
.member-conversion-icon, .leaderboard-guest-icon {
    display: grid;
    width: 2.75rem;
    height: 2.75rem;
    flex: 0 0 auto;
    place-items: center;
    color: #08705a;
    border-radius: 8px;
    background: #dff3e9;
    font-size: 1.15rem;
}
.member-conversion-benefits { display: grid; gap: .5rem; }
.member-conversion-benefits > span { display: grid; grid-template-columns: 2rem minmax(0, 1fr); align-items: center; gap: .6rem; min-width: 0; padding: .65rem; border: 1px solid #dce8e3; border-radius: 7px; background: rgba(255, 255, 255, .82); }
.member-conversion-benefits > span > i { display: grid; width: 2rem; height: 2rem; place-items: center; color: #08705a; border-radius: 7px; background: #edf8f3; }
.member-conversion-benefits > span > span { display: grid; min-width: 0; gap: .08rem; }
.member-conversion-benefits strong { color: #153b36; font-size: .82rem; }
.member-conversion-benefits small { color: #687c78; font-size: .75rem; line-height: 1.35; }
.member-conversion-actions { display: grid; gap: .55rem; text-align: center; }
.member-conversion-actions > a:not(.btn) { align-self: center; color: #176958; font-size: .76rem; font-weight: 800; }
.member-conversion-actions > a:not(.btn):hover { text-decoration: underline; }

.ride-member-guest-v2 { display: grid; gap: .85rem; }
.ride-member-guest-v2 .ride-member-guest-copy { align-items: flex-start; }
.ride-guest-benefits { display: grid; gap: .4rem; }
.ride-guest-benefits > span { display: flex; min-height: 2.35rem; align-items: center; gap: .45rem; padding: .45rem .6rem; color: #315751; border: 1px solid #d8e7e1; border-radius: 7px; background: #f8fbfa; font-size: .75rem; font-weight: 750; }
.ride-guest-benefits i { color: #08705a; }
.ride-member-guest-v2 .ride-member-guest-actions { display: grid; gap: .45rem; }

.leaderboard-guest-cta { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: .75rem; padding: .9rem; border: 1px solid #bcd9cf; border-radius: 8px; background: #eef8f4; }
.leaderboard-guest-cta > div:nth-child(2) { display: grid; min-width: 0; gap: .12rem; }
.leaderboard-guest-cta > div:nth-child(2) > small { color: #08705a; font-size: .75rem; font-weight: 850; text-transform: uppercase; }
.leaderboard-guest-cta > div:nth-child(2) > strong { color: #092126; font-size: .95rem; }
.leaderboard-guest-cta p { margin: .15rem 0 0; color: #58706c; font-size: .75rem; line-height: 1.45; }
.leaderboard-guest-cta > div:last-child { display: grid; grid-column: 1 / -1; gap: .45rem; text-align: center; }
.leaderboard-guest-cta > div:last-child > a:not(.btn) { color: #176958; font-size: .75rem; font-weight: 800; }
.blog-account-hint { display: block; color: #667d78; font-size: .75rem; text-align: center; }
.blog-account-hint a { color: #176958; font-weight: 800; }

@media (max-width: 991.98px) {
    html { scroll-padding-top: calc(var(--wc-topbar-height) + env(safe-area-inset-top) + .75rem); }
    body { overscroll-behavior-y: none; }
    .app-stage { padding-top: calc(var(--wc-topbar-height) + env(safe-area-inset-top)); }
    .app-topbar {
        position: fixed;
        z-index: 1055;
        top: 0;
        right: 0;
        left: 0;
        width: 100%;
        padding-top: env(safe-area-inset-top);
        transform: translateZ(0);
        backface-visibility: hidden;
    }
    .mobile-app-nav {
        transform: translateZ(0);
        backface-visibility: hidden;
        contain: layout paint;
    }
}

@media (min-width: 576px) {
    .member-conversion-actions { grid-template-columns: auto auto; align-items: center; justify-content: start; text-align: left; }
    .ride-guest-benefits { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .ride-member-guest-v2 .ride-member-guest-actions { grid-template-columns: auto auto; justify-content: start; }
}

@media (min-width: 768px) {
    .member-conversion-card { padding: 1.15rem; }
    .member-conversion-home .member-conversion-benefits { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .member-conversion-park .member-conversion-benefits { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .leaderboard-guest-cta { grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; padding: 1rem; }
    .leaderboard-guest-cta > div:last-child { grid-column: auto; min-width: 10.5rem; }
}

@media (min-width: 992px) {
    .app-stage { padding-top: 0; }
}

@media (min-width: 1200px) {
    .member-conversion-home { grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); align-items: center; }
    .member-conversion-home .member-conversion-actions { grid-column: 1 / -1; }
}

@media (min-width: 1400px) {
    .member-conversion-park { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr) auto; align-items: center; }
    .member-conversion-park .member-conversion-actions { grid-template-columns: 1fr; justify-items: stretch; min-width: 10rem; }
}
