.blur-upgrade {
    filter: blur(5px);
    pointer-events: none;
    user-select: none;
}

/* Empty table cells: subtle blur so missing data looks intentional */
.blur-empty {
    filter: blur(2px);
    opacity: 0.6;
    display: inline-block;
}

/* Scroll reveal */
.reveal {
    opacity: 0;
    transform: translateY(32px);
    transition: opacity 0.7s cubic-bezier(0.16, 1, 0.3, 1),
                transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
}
.reveal.revealed {
    opacity: 1;
    transform: translateY(0);
}

/* While the mobile drawer is open, hide the homepage hero search so it cannot show through (stacking / compositing). */
@media (max-width: 1023px) {
    body.mobile-menu-open #hero-search-wrap {
        visibility: hidden;
        pointer-events: none;
    }
}

/* Navbar states */
.nav-glass {
    background: rgba(255, 255, 255, 0.96);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}
.nav-transparent {
    background: transparent;
    border-bottom: 1px solid transparent;
}
.nav-solid {
    background: #fff;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

/* Border beam animation for search bar */
@property --angle {
    syntax: '<angle>';
    initial-value: 0deg;
    inherits: false;
}
@keyframes border-beam {
    0% { --angle: 0deg; }
    100% { --angle: 360deg; }
}
.border-beam {
    animation: border-beam 4s linear infinite;
    background: conic-gradient(from var(--angle), transparent 80%, rgba(0, 0, 0, 0.15) 90%, transparent 100%);
}

/* FAQ accordion */
.faq-item .faq-answer {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease;
}
.faq-item.open .faq-answer {
    max-height: 500px;
}
.faq-item .faq-chevron {
    transition: transform 0.2s ease;
}
.faq-item.open .faq-chevron {
    transform: rotate(180deg);
}

/* Inner page header spacing for fixed nav */
.page-content {
    padding-top: 5.5rem;
}

/* Testimonial scroll animations (homepage) */
@keyframes scrollLeft { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@keyframes scrollRight { from { transform: translateX(-50%); } to { transform: translateX(0); } }
.testimonial-scroll-left { animation: scrollLeft 60s linear infinite; }
.testimonial-scroll-right { animation: scrollRight 55s linear infinite; }
.testimonial-scroll-left:hover, .testimonial-scroll-right:hover { animation-play-state: paused; }

/* Blog post code blocks: copy button */
.blog-code-wrapper { position: relative; }
.blog-code-wrapper pre { padding-top: 3rem !important; }

/* Blog prose code block overrides — prevent double-border and font issues */
.prose pre {
    background: #0a0a0a !important;
    color: #e5e5e5 !important;
    border-radius: 0.75rem !important;
    padding: 1.25rem 1.5rem !important;
    overflow-x: auto !important;
    font-size: 0.8125rem !important;
    line-height: 1.7 !important;
    tab-size: 2;
}
.prose pre code {
    background: transparent !important;
    color: inherit !important;
    padding: 0 !important;
    border-radius: 0 !important;
    font-size: inherit !important;
    white-space: pre !important;
}
/* Inline code (not inside pre) */
.prose :not(pre) > code {
    background: #f5f5f5 !important;
    color: #111 !important;
    padding: 0.15em 0.4em !important;
    border-radius: 0.25rem !important;
    font-size: 0.85em !important;
}
.blog-copy-btn { position: absolute; top: 0.75rem; right: 0.75rem; z-index: 5; cursor: pointer; }