/* Filesie Blogs — frontend */
.filesie-blog-page{color:#191919;background:#fff;padding-bottom:70px}
.filesie-container{width:min(1280px,calc(100% - 48px));margin:0 auto}
.filesie-breadcrumb{display:flex;flex-wrap:wrap;align-items:center;gap:12px;padding:28px 0 42px;font:500 14px/1.5 'Onest',sans-serif;color:#777}
.filesie-breadcrumb a{color:#191919;text-decoration:none}
.filesie-breadcrumb a:hover{color:var(--filesie-accent)}
.filesie-breadcrumb span{color:#a0a0a0}
.filesie-breadcrumb .filesie-current-crumb{max-width:420px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.filesie-blog-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:36px;align-items:stretch;padding:0 0 36px;background-position:center;background-size:cover}
.filesie-hero-copy{display:flex;flex-direction:column;justify-content:center;min-width:0;padding:8px 0}
.filesie-blog-category{margin-bottom:18px;color:var(--filesie-accent);font:700 15px/1.3 'Onest',sans-serif;text-transform:uppercase;letter-spacing:.02em}
.filesie-hero-copy h1{margin:0 0 24px;color:var(--filesie-hero-text,#191919);font:700 clamp(34px,4vw,52px)/1.12 'Space Grotesk',sans-serif;letter-spacing:-1.8px}
.filesie-blog-meta{display:flex;align-items:center;flex-wrap:wrap;gap:14px;color:#555;font:400 15px/1.5 'Onest',sans-serif;margin-bottom:24px}
.filesie-blog-meta strong{color:#191919;font-weight:700}
.filesie-author-avatar{width:52px;height:52px;border-radius:50%;object-fit:cover}
.filesie-blog-meta i{height:26px;width:1px;background:#cfcfcf;margin:0 8px}
.filesie-hero-image{min-height:390px;overflow:hidden;border-radius:16px;background:#f3f3f3}
.filesie-hero-image img{display:block;width:100%;height:100%;min-height:390px;max-height:520px;object-fit:cover}
.filesie-no-image{min-height:390px;display:grid;place-items:center;color:#777;font:500 15px 'Onest',sans-serif}
.filesie-promo-box{display:flex;align-items:center;gap:22px;padding:24px 26px;margin-top:0;background:#fff1e9;border-radius:16px}
.filesie-promo-media{flex:0 0 82px;width:82px;height:82px;display:grid;place-items:center;border-right:1px solid #f0d4c6;padding-right:18px;box-sizing:content-box}
.filesie-promo-media img{max-width:68px;max-height:68px;object-fit:contain}
.filesie-promo-content h2{font:700 22px/1.25 'Space Grotesk',sans-serif;margin:0 0 8px;color:#191919}
.filesie-promo-content p{font:400 16px/1.55 'Onest',sans-serif;margin:0 0 14px;color:#555}
.filesie-promo-button{display:inline-flex;align-items:center;gap:12px;padding:13px 22px;border-radius:9px;background:var(--filesie-accent);color:#fff!important;text-decoration:none!important;font:600 15px 'Onest',sans-serif;transition:transform .2s,background .2s}
.filesie-promo-button:hover{background:#d94f20;transform:translateY(-2px)}
.filesie-article-layout{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:64px;border-top:1px solid #e8e8e8;padding-top:38px;align-items:start}
.filesie-article-content{min-width:0;max-width:var(--filesie-content-width);font:400 18px/1.75 'Onest',sans-serif;color:#333}
.filesie-article-content>*:first-child{margin-top:0}
.filesie-article-content h2,.filesie-article-content h3,.filesie-article-content h4{font-family:'Space Grotesk',sans-serif;line-height:1.25;color:#191919;letter-spacing:-.5px}
.filesie-article-content h2{font-size:34px;margin:34px 0 14px}
.filesie-article-content h3{font-size:26px;margin:28px 0 12px}
.filesie-article-content a{color:var(--filesie-accent)}
.filesie-article-content img{max-width:100%;height:auto;border-radius:8px}
.filesie-article-content blockquote{border-left:4px solid var(--filesie-accent);padding:8px 22px;margin:28px 0;background:#fff7f2}
.filesie-toc{position:sticky;top:110px;padding:24px;border:1px solid #e0e0e0;border-radius:12px;background:#fff}
.filesie-toc h2{font:700 21px/1.3 'Space Grotesk',sans-serif;margin:0 0 16px;color:#191919}
.filesie-toc-links{display:flex;flex-direction:column;gap:4px}
.filesie-toc-links a{display:block;padding:9px 12px;border-left:3px solid transparent;border-radius:0 7px 7px 0;color:#333;text-decoration:none;font:500 14px/1.4 'Onest',sans-serif}
.filesie-toc-links a:hover,.filesie-toc-links a.is-active{background:#fff1e9;border-left-color:var(--filesie-accent);color:#191919}
.filesie-toc-links a.level-3{padding-left:24px;font-size:13px}
.filesie-reading-progress{position:fixed;z-index:99999;top:0;left:0;width:100%;height:5px;background:rgba(0,0,0,.12);pointer-events:none}
.filesie-reading-progress span{display:block;width:0;height:100%;background:var(--filesie-accent);transition:width .08s linear}
@media(max-width:1024px){.filesie-container{width:min(100% - 40px,900px)}.filesie-blog-hero{gap:26px}.filesie-hero-copy h1{font-size:38px}.filesie-hero-image,.filesie-hero-image img{min-height:320px}.filesie-article-layout{grid-template-columns:minmax(0,1fr) 260px;gap:32px}.filesie-promo-box{padding:20px;gap:15px}}
@media(max-width:767px){.filesie-container{width:calc(100% - 36px)}.filesie-breadcrumb{padding:20px 0 26px;font-size:12px;gap:8px}.filesie-breadcrumb .filesie-current-crumb{max-width:150px}.filesie-blog-hero{grid-template-columns:1fr;gap:22px;padding-bottom:28px}.filesie-hero-copy h1{font-size:34px;letter-spacing:-1px;margin-bottom:18px}.filesie-blog-meta{gap:9px;font-size:13px}.filesie-author-avatar{width:42px;height:42px}.filesie-blog-meta i{margin:0 3px;height:20px}.filesie-promo-box{padding:18px;align-items:flex-start}.filesie-promo-media{flex-basis:54px;width:54px;height:58px;padding-right:12px}.filesie-promo-media img{max-width:48px;max-height:48px}.filesie-promo-content h2{font-size:18px}.filesie-promo-content p{font-size:14px}.filesie-hero-image,.filesie-hero-image img{min-height:220px;max-height:300px;border-radius:12px}.filesie-article-layout{grid-template-columns:1fr;gap:28px;padding-top:26px}.filesie-article-content{font-size:16px;line-height:1.75}.filesie-article-content h2{font-size:28px}.filesie-article-content h3{font-size:23px}.filesie-toc{position:static;grid-row:1}.filesie-reading-progress{height:4px}}
@media(prefers-reduced-motion:reduce){.filesie-promo-button,.filesie-reading-progress span{transition:none}}


/* v1.0.2 layout refinements */
body.single-post .filesie-blog-page {
    padding-top: 100px !important;
}
body.single-post #masthead.site-header,
body.single-post .site-header {
    position: sticky !important;
    top: 0 !important;
    z-index: 99990 !important;
}
body.admin-bar.single-post #masthead.site-header,
body.admin-bar.single-post .site-header {
    top: 32px !important;
}
@media (max-width: 782px) {
    body.admin-bar.single-post #masthead.site-header,
    body.admin-bar.single-post .site-header {
        top: 46px !important;
    }
}
.filesie-blog-hero-shell {
    width: 100%;
    margin: 0;
    padding: 38px 0;
    background-color: var(--filesie-hero-background, #fff);
    background-position: center;
    background-size: cover;
}
.filesie-blog-hero-shell .filesie-blog-hero {
    padding: 0;
    background: transparent;
}
.filesie-blog-hero-shell .filesie-container {
    width: min(1280px, calc(100% - 48px));
}
.filesie-blog-meta .filesie-author-avatar {
    display: none !important;
}
@media (max-width: 767px) {
    body.single-post .filesie-blog-page {
        padding-top: 70px !important;
    }
    .filesie-blog-hero-shell {
        padding: 28px 0;
    }
}


/* v1.0.3: full-bleed hero background while retaining the original inner content width */
body.single-post .filesie-blog-page {
    padding-top: 80px !important;
}
.filesie-blog-hero-shell {
    width: 100vw !important;
    max-width: 100vw !important;
    position: relative;
    left: 50%;
    right: 50%;
    margin-left: -50vw !important;
    margin-right: -50vw !important;
    box-sizing: border-box;
}
.filesie-blog-hero-shell > .filesie-container {
    width: min(1280px, calc(100% - 48px)) !important;
    max-width: 1280px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}
@media (max-width: 767px) {
    body.single-post .filesie-blog-page {
        padding-top: 80px !important;
    }
    .filesie-blog-hero-shell > .filesie-container {
        width: calc(100% - 36px) !important;
    }
}


/* v1.0.4 refinements: aligned page container, precise hero typography and persistent sticky UI */
body.single-post .filesie-blog-page {
    width: 100vw !important;
    max-width: 100vw !important;
    position: relative;
    left: 50%;
    margin-left: -50vw !important;
    margin-right: -50vw !important;
    padding-top: 80px !important;
    overflow: visible !important;
}
body.single-post .filesie-blog-page > .filesie-container,
.filesie-blog-hero-shell > .filesie-container {
    width: min(1280px, calc(100vw - 48px)) !important;
    max-width: 1280px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}
.filesie-blog-hero-shell {
    width: 100% !important;
    max-width: none !important;
    left: auto !important;
    right: auto !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}
.filesie-hero-copy h1 {
    font-family: 'Space Grotesk', sans-serif !important;
    font-size: 48px !important;
    font-weight: 600 !important;
    line-height: 1.12 !important;
    letter-spacing: -1.5px !important;
    text-align: left !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
}
.filesie-blog-meta {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 5px !important;
    margin-top: 0 !important;
}
.filesie-blog-meta i {
    display: none !important;
}
.filesie-toc-wrap {
    position: sticky !important;
    top: var(--filesie-sticky-offset, 120px) !important;
    align-self: start !important;
    max-height: calc(100vh - var(--filesie-sticky-offset, 120px) - 24px);
}
.filesie-toc {
    position: static !important;
    max-height: inherit;
    overflow-y: auto;
    overscroll-behavior: contain;
}
@media (max-width: 1024px) {
    .filesie-hero-copy h1 {
        font-size: 40px !important;
    }
}
@media (max-width: 767px) {
    body.single-post .filesie-blog-page {
        padding-top: 80px !important;
    }
    .filesie-blog-page > .filesie-container,
    .filesie-blog-hero-shell > .filesie-container {
        width: calc(100vw - 36px) !important;
    }
    .filesie-hero-copy h1 {
        font-size: 34px !important;
        line-height: 1.16 !important;
        letter-spacing: -0.8px !important;
    }
    .filesie-toc-wrap {
        position: static !important;
        max-height: none;
    }
    .filesie-toc {
        max-height: none;
        overflow: visible;
    }
}


/* v1.0.5: one shared alignment grid for breadcrumb, hero title/image and article body */
body.single-post .filesie-blog-page {
    width: 100% !important;
    max-width: none !important;
    position: relative !important;
    left: auto !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-top: 80px !important;
    overflow: visible !important;
}
body.single-post .filesie-blog-page > .filesie-container,
body.single-post .filesie-blog-hero-shell > .filesie-container {
    width: min(1140px, calc(100vw - 48px)) !important;
    max-width: 1140px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box !important;
}
body.single-post .filesie-blog-hero-shell {
    width: 100% !important;
    max-width: 100% !important;
    position: relative !important;
    left: auto !important;
    right: auto !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
}
body.single-post .filesie-breadcrumb {
    margin-left: 0 !important;
    padding-left: 0 !important;
}
body.single-post .filesie-hero-copy,
body.single-post .filesie-hero-copy h1,
body.single-post .filesie-article-content {
    margin-left: 0 !important;
    text-align: left !important;
}
body.single-post .filesie-reading-progress {
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    height: 4px !important;
    z-index: 999999 !important;
    pointer-events: none !important;
}
@media (max-width: 767px) {
    body.single-post .filesie-blog-page {
        padding-top: 80px !important;
    }
    body.single-post .filesie-blog-page > .filesie-container,
    body.single-post .filesie-blog-hero-shell > .filesie-container {
        width: calc(100vw - 36px) !important;
    }
}


/* v1.0.6: requested breadcrumb spacing */
body.single-post .filesie-breadcrumb {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 30px 0 30px 42px !important;
    font: 500 14px/1.5 'Onest', sans-serif !important;
    color: #777 !important;
}


/* v1.0.7: requested single blog page top spacing */
body.single-post .filesie-blog-page {
    width: 100% !important;
    max-width: none !important;
    position: relative !important;
    left: auto !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-top: 20px !important;
    overflow: visible !important;
}


/* Filesie Glossary single article: match Filesie Blogs v1.0.7 content grid. */
body.single-filesie_glossary .filesie-blog-page {
    width: 100% !important;
    max-width: none !important;
    position: relative !important;
    left: auto !important;
    margin: 0 !important;
    padding-top: 20px !important;
    overflow: visible !important;
    box-sizing: border-box !important;
}
body.single-filesie_glossary .filesie-container {
    width: min(1140px, calc(100vw - 48px)) !important;
    max-width: 1140px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box !important;
}
body.single-filesie_glossary .filesie-blog-hero-shell {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 38px 0 !important;
    position: relative !important;
    left: auto !important;
    right: auto !important;
    box-sizing: border-box !important;
}
body.single-filesie_glossary .filesie-blog-hero-shell > .filesie-container {
    width: min(1140px, calc(100vw - 48px)) !important;
    max-width: 1140px !important;
}
body.single-filesie_glossary .filesie-article-layout {
    width: 100%;
    grid-template-columns: minmax(0, 1fr) 330px;
    gap: 64px;
}
body.single-filesie_glossary .filesie-article-content {
    max-width: var(--filesie-content-width, 820px);
}
body.single-filesie_glossary .filesie-breadcrumb {
    padding: 30px 0 30px 42px !important;
}
body.single-filesie_glossary .filesie-hero-copy h1 {
    font-family: 'Space Grotesk', sans-serif !important;
    font-size: 48px !important;
    font-weight: 600 !important;
    line-height: 1.12 !important;
    letter-spacing: -1.5px !important;
    text-align: left !important;
    margin: 0 0 24px !important;
    padding: 0 !important;
}
body.single-filesie_glossary .filesie-blog-meta {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 5px !important;
    margin-top: 0 !important;
}
body.single-filesie_glossary .filesie-blog-meta i {
    display: none !important;
}
body.single-filesie_glossary .filesie-reading-progress {
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    height: 4px !important;
    z-index: 999999 !important;
    pointer-events: none !important;
}
body.single-filesie_glossary .filesie-glossary-related {
    margin-top: 44px;
    padding-top: 28px;
    border-top: 1px solid #e8e8e8;
}
body.single-filesie_glossary .filesie-glossary-related h2 {
    font: 700 24px/1.25 'Space Grotesk', sans-serif;
    margin: 0 0 18px;
    color: #191919;
}
body.single-filesie_glossary .filesie-glossary-related-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px 24px;
    list-style: none;
    margin: 0;
    padding: 0;
}
body.single-filesie_glossary .filesie-glossary-related-list a {
    color: var(--filesie-accent, #0b6670);
    text-decoration: none;
}
body.single-filesie_glossary .filesie-glossary-related-list a:hover {
    text-decoration: underline;
}
@media (max-width: 1024px) {
    body.single-filesie_glossary .filesie-container,
    body.single-filesie_glossary .filesie-blog-hero-shell > .filesie-container {
        width: min(100% - 40px, 900px) !important;
        max-width: 900px !important;
    }
    body.single-filesie_glossary .filesie-article-layout {
        grid-template-columns: minmax(0, 1fr) 260px;
        gap: 32px;
    }
    body.single-filesie_glossary .filesie-hero-copy h1 { font-size: 40px !important; }
}
@media (max-width: 767px) {
    body.single-filesie_glossary .filesie-container,
    body.single-filesie_glossary .filesie-blog-hero-shell > .filesie-container {
        width: calc(100vw - 36px) !important;
        max-width: none !important;
    }
    body.single-filesie_glossary .filesie-blog-page { padding-top: 20px !important; }
    body.single-filesie_glossary .filesie-blog-hero-shell { padding: 28px 0 !important; }
    body.single-filesie_glossary .filesie-hero-copy h1 {
        font-size: 34px !important;
        line-height: 1.16 !important;
        letter-spacing: -.8px !important;
    }
    body.single-filesie_glossary .filesie-article-layout {
        grid-template-columns: 1fr;
        gap: 28px;
    }
    body.single-filesie_glossary .filesie-toc-wrap {
        position: static !important;
        max-height: none;
    }
    body.single-filesie_glossary .filesie-toc {
        max-height: none;
        overflow: visible;
    }
    body.single-filesie_glossary .filesie-glossary-related-list {
        grid-template-columns: 1fr;
    }
}

/* v1.3.1: clean glossary article, title directly above content. */
body.single-filesie_glossary .filesie-glossary-single-page .filesie-article-layout {
    border-top: 0; padding-top: 14px;
}
body.single-filesie_glossary .filesie-glossary-article-title {
    font-family: 'Space Grotesk', sans-serif; font-size: clamp(34px, 3.2vw, 48px);
    font-weight: 600; line-height: 1.14; letter-spacing: -1.3px;
    color: #191919; margin: 0 0 30px; padding: 0;
}
body.single-filesie_glossary .filesie-glossary-single-page .filesie-article-content > :first-child {margin-top:0;}
@media(max-width:767px) {
 body.single-filesie_glossary .filesie-glossary-article-title {font-size:34px;margin-bottom:22px;}
}
