/* Public-site variant. Preview retains l8-learn-more.css and its entry module. */
/* Public navigation is outside the exported component's hydration/animation tree. */
[data-framer-name="Btm Bar"]:not(.l8-public-bottom-bar) {
    display: none !important;
}
.l8-public-bottom-bar {
    position: fixed !important;
    z-index: 999;
    font-family: var(--l8-font);
    font-size: 12px;
    line-height: 1.6;
    opacity: 1;
    isolation: isolate;
}
.l8-public-bottom-bar a { text-decoration: none; }
.l8-public-bottom-bar [data-framer-name="Logo"] { white-space: nowrap; }
.l8-public-bottom-bar [data-framer-name="Logo"] a:focus-visible {
    outline: 1px solid #303030;
    outline-offset: 4px;
}
/* The bar stays hidden through hydration until the first visible project enters. */
html:not([data-l8-sticky-visible="true"]) [data-framer-name="Btm Bar"] {
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
    transition: none !important;
}
.l8-bottom-bar {
    grid-template-columns: minmax(0, 1fr) 146px !important;
    width: min(388.2px, calc(100vw - 32px)) !important;
    column-gap: 9px !important;
    padding: 8px 10px 8px 24.2px !important;
    left: 50% !important;
    right: auto !important;
    bottom: max(35px, calc(env(safe-area-inset-bottom, 0px) + 8px)) !important;
    transform: translateX(-50%) !important;
    box-sizing: border-box !important;
}
.l8-bottom-bar .l8-bottom-cta,
.l8-bottom-bar .l8-bottom-cta > div,
.l8-bottom-bar .l8-bottom-cta .l8-bottom-cta__surface {
    width: 146px !important;
    min-width: 0 !important;
    height: 44px !important;
    min-height: 44px !important;
    max-height: none !important;
    box-sizing: border-box !important;
}
.l8-bottom-bar .l8-bottom-cta .l8-bottom-cta__surface {
    justify-content: center !important;
    padding: 10px 12px !important;
}
@media (max-width: 600px) {
    .l8-bottom-bar {
        grid-template-columns: minmax(0, 1fr) 132px !important;
        /* Keep both labels readable on the narrowest screens. */
        width: min(calc(100vw - 32px), max(240px, calc(60vw + 29.1px))) !important;
        column-gap: 6px !important;
        padding: 7px 8px 7px 13.2px !important;
    }
    .l8-bottom-bar .l8-bottom-cta,
    .l8-bottom-bar .l8-bottom-cta > div,
    .l8-bottom-bar .l8-bottom-cta .l8-bottom-cta__surface { width: 132px !important; }
}
@media (max-width: 374px) {
    .l8-bottom-bar { grid-template-columns: minmax(0, 1fr) 122px !important; column-gap: 4px !important; padding-left: 11px !important; }
    .l8-bottom-bar .l8-bottom-cta,
    .l8-bottom-bar .l8-bottom-cta > div,
    .l8-bottom-bar .l8-bottom-cta .l8-bottom-cta__surface { width: 122px !important; }
    .l8-bottom-bar .l8-bottom-cta .l8-bottom-cta__surface { gap: 4px !important; padding: 10px 4px !important; }
    .l8-bottom-bar .l8-bottom-cta__label,
    .l8-bottom-bar .l8-bottom-cta__label-line,
    .l8-bottom-bar .l8-bottom-cta p { font-size: 11px !important; }
}