:root {
    --gp-route-ease: cubic-bezier(0.4, 0, 0.2, 1);
    --gp-route-ease-out: cubic-bezier(0.22, 1, 0.36, 1);
    --gp-route-duration: 0.2s;
}

/* ─── Login button press ─── */
[data-gp-login].gp-login-press {
    transform: translate3d(0, 2px, 0) scale(0.97) !important;
    transition-duration: 0.08s !important;
}

[data-gp-login].gp-login-active {
    pointer-events: none;
}

/* ─── Landing page exit ─── */
body.landing-page.landing-exit .landing-bg,
body.landing-page.landing-exit .landing-navbar,
body.landing-page.landing-exit .landing-hero,
body.landing-page.landing-exit .landing-section,
body.landing-page.landing-exit .landing-footer {
    opacity: 0;
    transform: translate3d(0, -10px, 0);
    transition:
        opacity var(--gp-route-duration) var(--gp-route-ease),
        transform var(--gp-route-duration) var(--gp-route-ease-out);
}

body.landing-page.landing-exit {
    overflow: hidden;
}

/* ─── Login page entrance (transition only — no layout changes) ─── */
html.gp-route-boot body.login-page {
    opacity: 0;
}

body.login-page.gp-route-enter {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    transition:
        opacity var(--gp-route-duration) var(--gp-route-ease-out),
        transform var(--gp-route-duration) var(--gp-route-ease-out);
}

html.gp-route-boot body.login-page.gp-route-enter-pending {
    opacity: 0;
    transform: translate3d(0, 12px, 0);
}

@media (prefers-reduced-motion: reduce) {
    body.landing-page.landing-exit .landing-bg,
    body.landing-page.landing-exit .landing-navbar,
    body.landing-page.landing-exit .landing-hero,
    body.landing-page.landing-exit .landing-section,
    body.landing-page.landing-exit .landing-footer,
    body.login-page.gp-route-enter,
    html.gp-route-boot body.login-page.gp-route-enter-pending {
        transition: none !important;
        transform: none !important;
    }

    html.gp-route-boot body.login-page {
        opacity: 1;
    }
}