/* theme-bridge.css — aligns the blog (Bootstrap + blog.css) with the 2026-07
   site redesign (home.css palette + Unbounded/JetBrains Mono type) without
   touching the blog's JS (filters, comments, likes). Loads AFTER blog.css. */

@import url('https://fonts.googleapis.com/css2?family=Unbounded:wght@600;800&family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;600&display=swap');

:root {
    --bg-dark: #04060c;
    --primary-color: #00e5ff;
}

body {
    background: #04060c !important;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

h1, h2, h3, .blog-hero-title, .post-card-title, .navbar-brand span {
    font-family: 'Unbounded', sans-serif !important;
}
.post-card-title { font-size: 1.05rem; line-height: 1.35; font-weight: 700 !important; }
.blog-hero-title { font-weight: 800 !important; letter-spacing: -0.01em; }

/* nav + hero surfaces to the deeper ink */
.navbar.fixed-top {
    background: rgba(4, 6, 12, 0.85) !important;
    backdrop-filter: blur(14px);
    border-bottom: 1px solid rgba(140, 170, 220, 0.13);
}
.blog-hero {
    background:
        radial-gradient(900px 420px at 80% 0%, rgba(0, 229, 255, 0.08), transparent 60%),
        radial-gradient(700px 420px at 10% 100%, rgba(124, 92, 255, 0.07), transparent 60%),
        #04060c !important;
    border-bottom: 1px solid rgba(140, 170, 220, 0.13);
}

/* cards */
.post-card, .comment-box, .blog-post-body pre {
    background: linear-gradient(160deg, #0e1628 0%, #0a101d 70%) !important;
    border: 1px solid rgba(140, 170, 220, 0.13) !important;
    border-radius: 20px !important;
}
.post-card { overflow: hidden; transition: transform 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease; }
.post-card:hover {
    transform: translateY(-4px);
    border-color: rgba(0, 229, 255, 0.35) !important;
    box-shadow: 0 18px 50px rgba(0, 0, 0, 0.45), 0 0 40px rgba(0, 229, 255, 0.06);
}

/* meta voice = mono */
.post-date, .post-cat-badge, .cat-pill, .post-card-stats, .back-link {
    font-family: 'JetBrains Mono', monospace !important;
    font-size: 0.74rem !important;
}
.cat-pill {
    border-radius: 999px !important;
    border: 1px solid rgba(140, 170, 220, 0.13) !important;
    background: rgba(10, 16, 29, 0.6) !important;
}
.cat-pill.active {
    background: rgba(0, 229, 255, 0.1) !important;
    border-color: rgba(0, 229, 255, 0.45) !important;
    color: #00e5ff !important;
}

/* buttons to the new gradient */
.btn-primary, .btn-read-more.btn, #commentSubmit {
    background: linear-gradient(100deg, #00c8e0, #7c5cff) !important;
    border: none !important;
}

/* prose inside posts */
.blog-post-body, .post-body { color: #93a1b8; }
.blog-post-body h2, .blog-post-body h3, .post-body h2, .post-body h3 {
    color: #eaf1fb;
    font-family: 'Unbounded', sans-serif !important;
    font-weight: 700 !important;
}
.blog-post-body strong, .post-body strong { color: #eaf1fb; }
.blog-post-body code, .post-body code { font-family: 'JetBrains Mono', monospace; }
.blog-post-body blockquote, .post-body blockquote {
    border-left: 3px solid #00e5ff;
    background: rgba(0, 229, 255, 0.04);
}

.footer { background: #0a101d !important; border-top: 1px solid rgba(140, 170, 220, 0.13); }
