
/* ==========================================================
   BORNA BLOG EDITORIAL 2026
   Scoped only to whitelisted Blog 2026 posts
   ========================================================== */

.b26-section{
    --b26-ink:#182033;
    --b26-muted:#667085;
    --b26-line:#e7eaf0;
    --b26-soft:#f7f8fc;
    --b26-primary:#3155d9;
    --b26-primary-dark:#233fae;
    --b26-purple:#7257cf;
    --b26-radius:24px;
    padding-bottom:40px;
}

.b26-section .breadcrumb{
    margin-bottom:18px;
    padding:0;
    background:transparent;
    font-size:12px;
    color:#8a92a3;
}

.b26-section .breadcrumb a{
    color:#697386;
}

.b26-section .breadcrumb-item.active{
    max-width:52ch;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    color:#9ba3b2;
}

.b26-shell{
    overflow:visible !important;
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
}

.b26-reading-progress{
    position:fixed;
    z-index:9999;
    top:0;
    right:0;
    left:0;
    height:3px;
    pointer-events:none;
    background:rgba(255,255,255,.22);
}

.b26-reading-progress span{
    display:block;
    width:0;
    height:100%;
    background:linear-gradient(90deg,var(--b26-primary),var(--b26-purple));
    transition:width .08s linear;
}

/* HERO */

.b26-hero{
    position:relative;
    display:grid;
    grid-template-columns:minmax(0,1.15fr) minmax(300px,.85fr);
    gap:34px;
    align-items:center;
    overflow:hidden;
    margin-bottom:36px;
    padding:38px;
    border:1px solid var(--b26-line);
    border-radius:30px;
    background:
        radial-gradient(circle at 5% 0%,rgba(114,87,207,.12),transparent 32%),
        radial-gradient(circle at 100% 100%,rgba(49,85,217,.09),transparent 34%),
        linear-gradient(145deg,#fff,#fafbff);
    box-shadow:0 22px 60px rgba(28,38,65,.07);
}

.b26-hero:before{
    content:"";
    position:absolute;
    width:260px;
    height:260px;
    top:-175px;
    left:-100px;
    border:48px solid rgba(114,87,207,.04);
    border-radius:50%;
    pointer-events:none;
}

.b26-hero-copy,
.b26-hero-media{
    position:relative;
    z-index:1;
}

.b26-kickers{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-bottom:17px;
}

.b26-kickers span{
    display:inline-flex;
    gap:7px;
    align-items:center;
    padding:7px 11px;
    border:1px solid #e5e7f5;
    border-radius:999px;
    background:#fff;
    color:#5d6680;
    font-size:11px;
    font-weight:800;
}

.b26-kickers span:first-child{
    border-color:#e2dcfb;
    background:#f6f2ff;
    color:#654cc0;
}

.b26-hero h1{
    margin:0 0 15px !important;
    color:var(--b26-ink) !important;
    font-size:clamp(25px,2.15vw,38px) !important;
    line-height:1.55 !important;
    font-weight:900 !important;
    letter-spacing:-.25px;
}

.b26-lead{
    max-width:760px;
    margin:0 0 20px !important;
    color:#586176 !important;
    font-size:15px !important;
    line-height:2 !important;
}

.b26-meta{
    display:flex;
    flex-wrap:wrap;
    gap:8px 18px;
    margin-bottom:23px;
    color:#7a8395;
    font-size:12px;
}

.b26-meta span{
    display:inline-flex;
    gap:7px;
    align-items:center;
}

.b26-meta i{
    color:#6576b7;
}

.b26-hero-actions,
.b26-final-actions{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
}

.b26-btn{
    display:inline-flex !important;
    min-height:45px;
    gap:9px;
    align-items:center;
    justify-content:center;
    padding:10px 18px;
    border:1px solid transparent;
    border-radius:13px;
    text-decoration:none !important;
    font-size:13px;
    font-weight:900;
    transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;
}

.b26-btn:hover{
    transform:translateY(-2px);
}

.b26-btn-primary{
    background:linear-gradient(135deg,var(--b26-primary),#4969df);
    color:#fff !important;
    box-shadow:0 12px 25px rgba(49,85,217,.18);
}

.b26-btn-primary:hover{
    box-shadow:0 15px 30px rgba(49,85,217,.25);
}

.b26-btn-soft{
    border-color:#e1e4ec;
    background:#fff;
    color:#39435a !important;
}

.b26-btn-light{
    border-color:rgba(255,255,255,.42);
    background:rgba(255,255,255,.12);
    color:#fff !important;
}

.b26-hero-media{
    overflow:hidden;
    min-height:310px;
    border:1px solid #e6e9f1;
    border-radius:24px;
    background:#eef1f7;
    box-shadow:0 16px 35px rgba(31,40,68,.10);
}

.b26-hero-media:after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(180deg,transparent 55%,rgba(20,28,49,.38));
    pointer-events:none;
}

.b26-hero-media img{
    display:block;
    width:100% !important;
    height:100% !important;
    min-height:310px;
    max-height:390px;
    object-fit:cover;
}

.b26-media-badge{
    position:absolute;
    z-index:2;
    right:15px;
    bottom:15px;
    display:inline-flex;
    gap:7px;
    align-items:center;
    padding:8px 11px;
    border:1px solid rgba(255,255,255,.5);
    border-radius:12px;
    background:rgba(255,255,255,.91);
    color:#384158;
    font-size:11px;
    font-weight:900;
    backdrop-filter:blur(8px);
}

/* ARTICLE LAYOUT */

.b26-layout{
    display:grid;
    grid-template-columns:245px minmax(0,1fr);
    gap:34px;
    align-items:start;
    max-width:1160px;
    margin:0 auto;
}

.b26-aside{
    position:sticky;
    top:105px;
    display:flex;
    flex-direction:column;
    gap:16px;
}

.b26-toc-card,
.b26-side-service{
    overflow:hidden;
    border:1px solid var(--b26-line);
    border-radius:19px;
    background:#fff;
    box-shadow:0 10px 30px rgba(31,40,68,.04);
}

.b26-toc-toggle{
    display:flex;
    width:100%;
    align-items:center;
    justify-content:space-between;
    padding:15px 16px;
    border:0;
    background:#fff;
    color:#293247;
    cursor:pointer;
    font-family:inherit;
    font-size:12px;
    font-weight:900;
}

.b26-toc-toggle span{
    display:flex;
    gap:8px;
    align-items:center;
}

.b26-toc-toggle > i{
    transition:transform .2s ease;
}

.b26-toc-card:not(.is-open) .b26-toc-toggle > i{
    transform:rotate(90deg);
}

.b26-toc{
    max-height:55vh;
    overflow:auto;
    padding:0 11px 13px;
}

.b26-toc-card:not(.is-open) .b26-toc{
    display:none;
}

.b26-toc ul{
    margin:0;
    padding:0;
    list-style:none;
}

.b26-toc li{
    margin:2px 0;
}

.b26-toc a{
    display:block;
    padding:7px 9px;
    border-radius:9px;
    color:#697286;
    text-decoration:none !important;
    font-size:11px;
    line-height:1.75;
    transition:background .18s ease,color .18s ease;
}

.b26-toc li.is-h3 a{
    padding-right:20px;
    font-size:10.5px;
}

.b26-toc a:hover,
.b26-toc a.is-active{
    background:#f3f5ff;
    color:#3552bf;
}

.b26-side-service{
    padding:17px;
    background:linear-gradient(145deg,#f8f9ff,#fff);
}

.b26-side-service > span{
    display:block;
    margin-bottom:7px;
    color:#735bc2;
    font-size:10px;
    font-weight:900;
}

.b26-side-service strong{
    display:block;
    margin-bottom:7px;
    color:#293247;
    font-size:12px;
    line-height:1.85;
}

.b26-side-service p{
    margin:0 0 12px !important;
    color:#778095 !important;
    font-size:10.5px !important;
    line-height:1.9 !important;
}

.b26-side-service a{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding-top:11px;
    border-top:1px solid #e6e9f1;
    color:#3453c5 !important;
    text-decoration:none !important;
    font-size:11px;
    font-weight:900;
}

.b26-reader{
    min-width:0;
    max-width:870px;
}

.b26-content{
    padding:36px 42px;
    border:1px solid var(--b26-line);
    border-radius:24px;
    background:#fff;
    box-shadow:0 16px 45px rgba(27,37,65,.045);
    color:#30394d;
    font-size:16px;
    line-height:2.15;
}

.b26-content > *:first-child{
    margin-top:0 !important;
}

.b26-content p{
    margin:0 0 18px !important;
    color:#3c4558 !important;
    font-size:16px !important;
    line-height:2.15 !important;
}

.b26-content h1,
.b26-content h2,
.b26-content h3,
.b26-content h4{
    scroll-margin-top:115px;
    color:#1f293d !important;
    font-weight:900 !important;
}

.b26-content h1{
    margin:36px 0 16px !important;
    font-size:26px !important;
    line-height:1.7 !important;
}

.b26-content h2{
    position:relative;
    margin:42px 0 17px !important;
    padding-right:17px;
    font-size:22px !important;
    line-height:1.75 !important;
}

.b26-content h2:before{
    content:"";
    position:absolute;
    top:.42em;
    right:0;
    width:5px;
    height:1.35em;
    border-radius:999px;
    background:linear-gradient(180deg,var(--b26-primary),var(--b26-purple));
}

.b26-content h3{
    margin:31px 0 13px !important;
    font-size:18px !important;
    line-height:1.8 !important;
}

.b26-content h4{
    margin:26px 0 11px !important;
    font-size:16px !important;
    line-height:1.8 !important;
}

.b26-content ul,
.b26-content ol{
    margin:8px 0 22px !important;
    padding-right:25px !important;
}

.b26-content li{
    margin-bottom:8px;
    color:#3d4659;
    line-height:2;
}

.b26-content a{
    color:#3155c9;
    text-decoration-thickness:1px;
    text-underline-offset:4px;
}

.b26-content strong{
    color:#222c40;
    font-weight:900;
}

.b26-content blockquote{
    position:relative;
    margin:28px 0 !important;
    padding:20px 22px 20px 20px !important;
    border:0 !important;
    border-right:4px solid #7257cf !important;
    border-radius:14px;
    background:#f8f6ff;
    color:#424b60;
}

.b26-content img{
    display:block;
    max-width:100% !important;
    height:auto !important;
    margin:26px auto !important;
    border-radius:17px;
}

.b26-content figure{
    max-width:100%;
    margin:28px auto !important;
}

.b26-content figcaption{
    margin-top:8px;
    color:#8a92a2;
    text-align:center;
    font-size:11px;
}

.b26-table-wrap{
    overflow-x:auto;
    margin:25px 0;
    border:1px solid #e5e8ef;
    border-radius:15px;
}

.b26-table-wrap table{
    width:100% !important;
    min-width:620px;
    margin:0 !important;
    border-collapse:collapse;
}

.b26-content table th{
    background:#f4f6fb;
    color:#283349;
    font-weight:900;
}

.b26-content table td,
.b26-content table th{
    padding:12px 14px !important;
    border:1px solid #e8eaf0 !important;
    font-size:12px !important;
    line-height:1.8 !important;
}

/* CONVERSION */

.b26-inline-cta{
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    gap:18px;
    align-items:center;
    margin:34px 0;
    padding:22px;
    border:1px solid #dedff3;
    border-radius:19px;
    background:
        radial-gradient(circle at 100% 0%,rgba(114,87,207,.11),transparent 36%),
        #fafaff;
}

.b26-inline-icon{
    display:grid;
    width:48px;
    height:48px;
    place-items:center;
    border-radius:15px;
    background:#ece9ff;
    color:#684fc2;
    font-size:19px;
}

.b26-inline-copy > span{
    display:block;
    margin-bottom:4px;
    color:#7257bd;
    font-size:10px;
    font-weight:900;
}

.b26-inline-copy strong{
    display:block;
    color:#263046;
    font-size:14px;
    line-height:1.8;
}

.b26-inline-copy p{
    margin:4px 0 0 !important;
    color:#6d768a !important;
    font-size:11px !important;
    line-height:1.9 !important;
}

.b26-inline-actions{
    display:flex;
    min-width:170px;
    flex-direction:column;
    gap:8px;
    align-items:center;
}

.b26-text-link{
    color:#5f6780 !important;
    text-decoration:none !important;
    font-size:10px;
    font-weight:800;
}

.b26-final-cta{
    position:relative;
    overflow:hidden;
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:25px;
    align-items:center;
    margin-top:28px;
    padding:30px 32px;
    border-radius:23px;
    background:
        radial-gradient(circle at 0 0,rgba(255,255,255,.12),transparent 35%),
        linear-gradient(135deg,#26365f,#314c9c 65%,#5d4eaf);
    color:#fff;
    box-shadow:0 20px 45px rgba(40,57,110,.18);
}

.b26-final-cta:after{
    content:"";
    position:absolute;
    width:190px;
    height:190px;
    left:-70px;
    bottom:-125px;
    border:33px solid rgba(255,255,255,.055);
    border-radius:50%;
}

.b26-final-cta > *{
    position:relative;
    z-index:1;
}

.b26-final-eyebrow{
    display:block;
    margin-bottom:7px;
    color:#d7dcff;
    font-size:10px;
    font-weight:900;
}

.b26-final-cta h2{
    margin:0 0 7px !important;
    color:#fff !important;
    font-size:20px !important;
    line-height:1.75 !important;
}

.b26-final-cta p{
    max-width:640px;
    margin:0 !important;
    color:#e0e5f5 !important;
    font-size:12px !important;
    line-height:1.9 !important;
}

.b26-related{
    margin-top:16px;
    padding:18px 20px;
    border:1px solid var(--b26-line);
    border-radius:16px;
    background:#fff;
}

.b26-related > span{
    display:block;
    margin-bottom:6px;
    color:#8a92a2;
    font-size:10px;
    font-weight:900;
}

.b26-related a{
    display:flex;
    gap:15px;
    align-items:center;
    justify-content:space-between;
    color:#2c3549 !important;
    text-decoration:none !important;
}

.b26-related strong{
    font-size:12px;
    line-height:1.9;
}

.b26-related i{
    flex:none;
    color:#5269c8;
}

.b26-section .tag-holder{
    max-width:870px;
    margin-right:auto;
    margin-top:22px;
}

.b26-section .comment-main-box{
    max-width:870px;
    margin-right:auto;
    margin-left:0;
}

/* RESPONSIVE */

@media(max-width:991.98px){

    .b26-hero{
        grid-template-columns:1fr;
        gap:24px;
        padding:28px;
    }

    .b26-hero-media{
        min-height:260px;
    }

    .b26-hero-media img{
        min-height:260px;
        max-height:330px;
    }

    .b26-layout{
        grid-template-columns:1fr;
        gap:18px;
    }

    .b26-aside{
        position:static;
    }

    .b26-side-service{
        display:none;
    }

    .b26-toc{
        max-height:none;
    }

    .b26-reader{
        max-width:none;
    }

    .b26-section .tag-holder,
    .b26-section .comment-main-box{
        max-width:none;
        margin-right:0;
    }
}

@media(max-width:767.98px){

    .b26-section{
        padding-bottom:20px;
    }

    .b26-section .breadcrumb-item.active{
        display:none;
    }

    .b26-hero{
        margin-bottom:20px;
        padding:20px 17px 17px;
        border-radius:21px;
    }

    .b26-kickers{
        margin-bottom:12px;
    }

    .b26-hero h1{
        margin-bottom:11px !important;
        font-size:23px !important;
        line-height:1.65 !important;
    }

    .b26-lead{
        margin-bottom:14px !important;
        font-size:13px !important;
        line-height:1.95 !important;
    }

    .b26-meta{
        gap:7px 13px;
        margin-bottom:17px;
        font-size:10px;
    }

    .b26-hero-actions{
        display:grid;
        grid-template-columns:1fr;
    }

    .b26-btn{
        width:100%;
        min-height:44px;
    }

    .b26-hero-media{
        min-height:205px;
        border-radius:17px;
    }

    .b26-hero-media img{
        min-height:205px;
        max-height:250px;
    }

    .b26-media-badge{
        right:10px;
        bottom:10px;
        font-size:9px;
    }

    .b26-content{
        padding:24px 18px;
        border-radius:19px;
        font-size:15px;
    }

    .b26-content p{
        font-size:15px !important;
        line-height:2.08 !important;
    }

    .b26-content h1{
        font-size:22px !important;
    }

    .b26-content h2{
        margin-top:34px !important;
        font-size:19px !important;
    }

    .b26-content h3{
        font-size:17px !important;
    }

    .b26-inline-cta{
        grid-template-columns:1fr;
        gap:12px;
        padding:18px;
    }

    .b26-inline-actions{
        width:100%;
        min-width:0;
    }

    .b26-final-cta{
        grid-template-columns:1fr;
        gap:17px;
        padding:24px 19px;
        border-radius:19px;
    }

    .b26-final-actions{
        display:grid;
        grid-template-columns:1fr;
    }
}


/* ==========================================================
   BORNA BLOG EDITORIAL 2026 — V2
   Compact / premium / modern editorial refinement
   ========================================================== */

/* TYPOGRAPHY */

.b26-section,
.b26-section button,
.b26-section input{
    font-family:Shabnam,var(--firstFont),IRANSans,Tahoma,sans-serif !important;
}

.b26-section{
    --b26-ink:#172033;
    --b26-muted:#687287;
    --b26-line:#e8ebf2;
    --b26-primary:#4563df;
    --b26-purple:#7558d4;
}

/* HERO V2 */

.b26-hero{
    max-width:1180px;
    grid-template-columns:minmax(0,1.32fr) minmax(270px,.68fr);
    gap:30px;

    margin:0 auto 28px;
    padding:28px 30px;

    border-radius:25px;

    background:
        radial-gradient(circle at 4% 0%,rgba(117,88,212,.10),transparent 27%),
        radial-gradient(circle at 100% 100%,rgba(69,99,223,.07),transparent 29%),
        linear-gradient(145deg,#fff,#fbfbfe);

    box-shadow:0 16px 46px rgba(31,39,67,.055);
}

.b26-hero h1{
    max-width:760px;

    margin-bottom:12px !important;

    font-size:clamp(24px,1.75vw,31px) !important;
    line-height:1.62 !important;

    font-weight:800 !important;
    letter-spacing:0 !important;
}

.b26-lead{
    max-width:700px;

    margin-bottom:15px !important;

    font-size:13.5px !important;
    line-height:1.95 !important;
}

.b26-kickers{
    gap:7px;
    margin-bottom:13px;
}

.b26-kickers span{
    padding:6px 10px;
    font-size:10px;
}

.b26-meta{
    gap:7px 14px;
    margin-bottom:17px;
    font-size:10.5px;
}

.b26-btn{
    min-height:42px;
    padding:9px 15px;
    border-radius:11px;
    font-size:11.5px;
}

.b26-hero-media{
    width:100%;
    max-width:385px;
    min-height:0;

    justify-self:start;

    border-radius:20px;
    box-shadow:0 12px 28px rgba(31,40,68,.09);
}

.b26-hero-media img{
    width:100% !important;
    height:250px !important;

    min-height:0 !important;
    max-height:250px !important;

    object-fit:cover;
}

.b26-media-badge{
    right:11px;
    bottom:11px;

    padding:6px 9px;

    border-radius:10px;

    font-size:9.5px;
}

/* MAIN READING AREA */

.b26-layout{
    max-width:1080px;

    grid-template-columns:218px minmax(0,1fr);
    gap:28px;

    margin:0 auto;
}

/*
 * مهم:
 * Sidebar دیگر sticky نیست.
 * همراه صفحه بالا می‌رود و اسکرول داخلی هم ندارد.
 */
.b26-aside{
    position:static !important;
    top:auto !important;

    gap:13px;
}

.b26-toc-card,
.b26-side-service{
    border-radius:16px;

    box-shadow:0 8px 25px rgba(31,40,68,.035);
}

.b26-toc-toggle{
    padding:13px 14px;

    font-size:11px;
}

.b26-toc{
    max-height:none !important;
    overflow:visible !important;

    padding:0 9px 11px;
}

.b26-toc a{
    padding:6px 8px;

    font-size:10.3px;
    line-height:1.7;
}

.b26-side-service{
    padding:15px;
}

.b26-side-service strong{
    font-size:11px;
    line-height:1.8;
}

.b26-side-service p{
    font-size:10px !important;
}

.b26-reader{
    max-width:820px;
}

.b26-content{
    padding:31px 36px;

    border:0 !important;
    border-radius:21px;

    box-shadow:
        0 1px 0 rgba(21,31,55,.035),
        0 14px 42px rgba(28,37,64,.045);

    color:#343e52;

    font-size:15px;
    line-height:2.02;
}

/* Override old inline typography */

.b26-content h1 span,
.b26-content h2 span,
.b26-content h3 span,
.b26-content h4 span{
    font-family:inherit !important;
    font-size:inherit !important;
    line-height:inherit !important;
}

.b26-content p span,
.b26-content li span{
    font-family:inherit !important;
}

.b26-content p{
    margin-bottom:15px !important;

    color:#3d4659 !important;

    font-size:15px !important;
    line-height:2.02 !important;

    font-weight:400 !important;
}

.b26-content h1{
    margin:31px 0 13px !important;

    font-size:23px !important;
    line-height:1.7 !important;

    font-weight:800 !important;
}

.b26-content h2{
    margin:34px 0 14px !important;
    padding-right:14px;

    font-size:19px !important;
    line-height:1.75 !important;

    font-weight:800 !important;
}

.b26-content h2:before{
    top:.48em;

    width:4px;
    height:1.15em;
}

.b26-content h3{
    margin:25px 0 10px !important;

    font-size:16px !important;
    line-height:1.8 !important;

    font-weight:800 !important;
}

.b26-content h4{
    font-size:15px !important;
}

.b26-content strong{
    font-weight:800;
}

.b26-content ul,
.b26-content ol{
    margin:7px 0 18px !important;
    padding-right:21px !important;
}

.b26-content li{
    margin-bottom:6px;

    font-size:14.5px;
    line-height:1.95;
}

.b26-content li::marker{
    color:#6f63d8;
}

.b26-content blockquote{
    margin:22px 0 !important;
    padding:17px 19px !important;

    border-radius:12px;
}

.b26-content img{
    margin:22px auto !important;

    border-radius:14px;
}

/* INLINE CTA */

.b26-inline-cta{
    grid-template-columns:42px minmax(0,1fr) auto;

    gap:14px;

    margin:28px 0;
    padding:18px 19px;

    border-radius:16px;
}

.b26-inline-icon{
    width:42px;
    height:42px;

    border-radius:12px;

    font-size:16px;
}

.b26-inline-copy strong{
    font-size:12.5px;
}

.b26-inline-copy p{
    font-size:10px !important;
}

.b26-inline-actions{
    min-width:155px;
}

/* ==========================================================
   FAQ V2
   ========================================================== */

.b26-faq{
    margin-top:27px;
    padding:24px;

    border:1px solid #e8eaf2;
    border-radius:20px;

    background:
        radial-gradient(circle at 100% 0%,rgba(117,88,212,.06),transparent 26%),
        #fff;

    box-shadow:0 12px 34px rgba(28,37,64,.04);
}

.b26-faq-head{
    display:flex;

    align-items:flex-end;
    justify-content:space-between;

    gap:16px;

    margin-bottom:14px;
}

.b26-faq-eyebrow{
    display:block;

    margin-bottom:3px;

    color:#7558c8;

    font-size:9.5px;
    font-weight:800;
}

.b26-faq-head h2{
    margin:0 !important;

    color:#202a3e !important;

    font-size:18px !important;
    line-height:1.7 !important;

    font-weight:800 !important;
}

.b26-faq-count{
    flex:none;

    padding:6px 9px;

    border-radius:999px;

    background:#f4f2ff;

    color:#6955b6;

    font-size:9px;
    font-weight:800;
}

.b26-faq-list{
    display:flex;
    flex-direction:column;

    gap:7px;
}

.b26-faq-item{
    overflow:hidden;

    border:1px solid #e8eaf1;
    border-radius:13px;

    background:#fff;

    transition:
        border-color .18s ease,
        box-shadow .18s ease;
}

.b26-faq-item.is-open{
    border-color:#d8daf1;

    box-shadow:0 7px 20px rgba(52,61,101,.045);
}

.b26-faq-item h3{
    margin:0 !important;
}

.b26-faq-question{
    display:flex;

    width:100%;
    min-height:49px;

    align-items:center;
    justify-content:space-between;

    gap:16px;

    padding:12px 14px;

    border:0;

    background:#fff;

    color:#30394e;

    text-align:right;

    cursor:pointer;

    font-size:12px;
    line-height:1.85;

    font-weight:800;
}

.b26-faq-question i{
    flex:none;

    color:#6574bc;

    font-size:12px;

    transition:transform .2s ease;
}

.b26-faq-item.is-open .b26-faq-question i{
    transform:rotate(45deg);
}

.b26-faq-answer{
    padding:0 14px 13px;

    color:#626c80;

    font-size:11.5px;
    line-height:1.95;
}

.b26-faq-answer p{
    margin:0 !important;

    color:inherit !important;

    font-size:inherit !important;
    line-height:inherit !important;
}

/* FINAL CTA */

.b26-final-cta{
    margin-top:22px;
    padding:25px 27px;

    border-radius:19px;
}

.b26-final-cta h2{
    font-size:17px !important;
}

.b26-final-cta p{
    font-size:10.5px !important;
}

/* RELATED */

.b26-related{
    padding:15px 17px;
    border-radius:14px;
}

/* TABLES */

.b26-table-wrap{
    margin:21px 0;
    border-radius:12px;
}

/* ==========================================================
   TABLET
   ========================================================== */

@media(max-width:991.98px){

    .b26-hero{
        max-width:100%;

        grid-template-columns:1fr;

        gap:19px;

        padding:24px;
    }

    .b26-hero-media{
        max-width:100%;
        justify-self:stretch;
    }

    .b26-hero-media img{
        height:250px !important;
        max-height:250px !important;
    }

    .b26-layout{
        max-width:820px;

        grid-template-columns:1fr;
    }

    .b26-aside{
        position:static !important;
    }

    .b26-toc{
        max-height:none !important;
        overflow:visible !important;
    }
}

/* ==========================================================
   MOBILE
   ========================================================== */

@media(max-width:767.98px){

    .b26-hero{
        gap:16px;

        padding:18px 15px 15px;

        border-radius:18px;
    }

    .b26-hero h1{
        font-size:21px !important;
        line-height:1.7 !important;
    }

    .b26-lead{
        font-size:12.5px !important;
        line-height:1.9 !important;
    }

    .b26-hero-media{
        border-radius:15px;
    }

    .b26-hero-media img{
        height:195px !important;

        min-height:195px !important;
        max-height:195px !important;
    }

    .b26-content{
        padding:22px 17px;

        border-radius:17px;
    }

    .b26-content p{
        font-size:14.2px !important;
        line-height:2 !important;
    }

    .b26-content h2{
        margin-top:29px !important;

        font-size:17.5px !important;
    }

    .b26-content h3{
        font-size:15.5px !important;
    }

    .b26-inline-cta{
        grid-template-columns:1fr;

        padding:16px;
    }

    .b26-faq{
        padding:17px 13px;

        border-radius:17px;
    }

    .b26-faq-head{
        align-items:flex-start;
    }

    .b26-faq-head h2{
        font-size:16px !important;
    }

    .b26-faq-question{
        min-height:47px;

        padding:11px 12px;

        font-size:11.5px;
    }

    .b26-faq-answer{
        padding:0 12px 12px;

        font-size:11px;
    }

    .b26-final-cta{
        padding:21px 17px;
    }
}


/* ==========================================================
   BORNA BLOG EDITORIAL 2026 — V3
   Modern Digital Editorial Experience
   ========================================================== */

/* ----------------------------------------------------------
   PAGE ATMOSPHERE
   ---------------------------------------------------------- */

.b26-section{
    position:relative;
    margin-top:32px !important;
    padding:0 0 55px;
}

.b26-section:after{
    content:"";
    position:absolute;
    z-index:-1;
    right:50%;
    bottom:0;
    width:min(1380px,94vw);
    height:58%;
    transform:translateX(50%);
    border-radius:55px;
    background:
        radial-gradient(circle at 85% 15%,rgba(82,102,218,.045),transparent 28%),
        radial-gradient(circle at 12% 82%,rgba(118,86,206,.045),transparent 26%);
    pointer-events:none;
}


/* ==========================================================
   HERO — TRUE COMPACT V3
   ========================================================== */

body .b26-section .b26-hero{
    position:relative !important;

    width:100% !important;
    max-width:1080px !important;

    height:auto !important;
    min-height:0 !important;
    max-height:none !important;

    display:grid !important;
    grid-template-columns:minmax(0,1fr) 325px !important;

    align-items:center !important;
    align-content:center !important;

    gap:29px !important;

    margin:0 auto 14px !important;
    padding:24px 26px !important;

    overflow:hidden !important;

    border:1px solid #e8eaf3 !important;
    border-radius:22px !important;

    background:
        radial-gradient(circle at 100% 0%,rgba(104,83,205,.085),transparent 27%),
        radial-gradient(circle at 0 100%,rgba(70,97,218,.055),transparent 29%),
        linear-gradient(135deg,#ffffff 0%,#fbfcff 100%) !important;

    box-shadow:
        0 1px 0 rgba(23,31,54,.025),
        0 16px 42px rgba(30,39,70,.055) !important;
}

body .b26-section .b26-hero:before{
    content:"" !important;

    position:absolute !important;

    top:0 !important;
    right:27px !important;
    left:auto !important;

    width:125px !important;
    height:4px !important;

    border:0 !important;
    border-radius:0 0 999px 999px !important;

    background:
        linear-gradient(
            90deg,
            #7256d0,
            #4968df
        ) !important;
}

body .b26-section .b26-hero-copy{
    min-width:0 !important;

    display:flex !important;
    flex-direction:column !important;
    justify-content:center !important;

    padding:2px 0 !important;
}

body .b26-section .b26-kickers{
    margin:0 0 10px !important;
}

body .b26-section .b26-kickers span{
    padding:5px 9px !important;

    border-radius:999px !important;

    font-size:9.5px !important;
}

body .b26-section .b26-hero h1{
    max-width:720px !important;

    margin:0 0 9px !important;

    color:#182135 !important;

    font-size:clamp(23px,1.65vw,29px) !important;
    line-height:1.58 !important;

    font-weight:800 !important;

    letter-spacing:0 !important;
}

body .b26-section .b26-lead{
    max-width:690px !important;

    margin:0 0 11px !important;

    color:#626c80 !important;

    font-size:12.5px !important;
    line-height:1.9 !important;
}

body .b26-section .b26-meta{
    margin:0 0 13px !important;

    gap:6px 13px !important;

    color:#7b8497 !important;

    font-size:9.5px !important;
}

body .b26-section .b26-hero-actions{
    gap:8px !important;
}

body .b26-section .b26-btn{
    min-height:39px !important;

    padding:8px 13px !important;

    border-radius:10px !important;

    font-size:10.5px !important;
}

body .b26-section .b26-hero-media{
    position:relative !important;

    width:100% !important;
    max-width:325px !important;

    height:215px !important;
    min-height:215px !important;
    max-height:215px !important;

    margin:0 !important;

    justify-self:start !important;

    overflow:hidden !important;

    border:1px solid #e5e8f0 !important;
    border-radius:17px !important;

    background:#f0f2f8 !important;

    box-shadow:
        0 13px 28px rgba(27,38,70,.09) !important;
}

body .b26-section .b26-hero-media img{
    display:block !important;

    width:100% !important;
    height:215px !important;

    min-height:215px !important;
    max-height:215px !important;

    margin:0 !important;

    object-fit:cover !important;

    border-radius:0 !important;
}

body .b26-section .b26-media-badge{
    right:9px !important;
    bottom:9px !important;

    padding:5px 8px !important;

    border-radius:9px !important;

    font-size:8.5px !important;
}


/* ==========================================================
   ARTICLE UTILITY STRIP
   ========================================================== */

.b26-utility-strip{
    display:flex;

    max-width:1080px;

    align-items:center;
    justify-content:space-between;

    gap:18px;

    margin:0 auto 24px;
    padding:9px 11px 9px 14px;

    border:1px solid #eaecf2;
    border-radius:14px;

    background:rgba(255,255,255,.92);

    box-shadow:0 8px 24px rgba(34,42,70,.035);

    backdrop-filter:blur(10px);
}

.b26-utility-context{
    display:flex;

    align-items:center;

    gap:7px;

    color:#81899a;

    font-size:9.5px;
}

.b26-utility-context strong{
    color:#374155;

    font-size:10px;
    font-weight:800;
}

.b26-utility-dot{
    width:7px;
    height:7px;

    border-radius:50%;

    background:linear-gradient(135deg,#7358d1,#4967de);

    box-shadow:0 0 0 4px rgba(93,91,214,.07);
}

.b26-utility-actions{
    display:flex;
    flex-wrap:wrap;

    align-items:center;

    gap:5px;
}

.b26-tool-btn{
    display:inline-flex;

    align-items:center;
    justify-content:center;

    gap:6px;

    min-height:32px;

    padding:6px 9px;

    border:1px solid transparent;
    border-radius:9px;

    background:transparent;

    color:#687185;

    cursor:pointer;

    font-family:inherit;

    font-size:9.5px;
    font-weight:700;

    transition:
        background .18s ease,
        border-color .18s ease,
        color .18s ease,
        transform .18s ease;
}

.b26-tool-btn:hover{
    transform:translateY(-1px);

    border-color:#e3e6ef;

    background:#f8f9fc;

    color:#39455e;
}

.b26-tool-btn.is-done,
.b26-tool-btn.is-saved,
.b26-tool-btn.is-active{
    border-color:#deddf4;

    background:#f5f3ff;

    color:#6351ba;
}

.b26-tool-btn i{
    font-size:11px;
}


/* ==========================================================
   MAIN LAYOUT V3
   ========================================================== */

body .b26-section .b26-layout{
    max-width:1080px !important;

    grid-template-columns:205px minmax(0,1fr) !important;

    gap:24px !important;
}

body .b26-section .b26-aside{
    position:static !important;

    top:auto !important;

    height:auto !important;
    max-height:none !important;

    overflow:visible !important;
}

body .b26-section .b26-toc-card,
body .b26-section .b26-side-service{
    border-color:#e9ebf1 !important;

    border-radius:15px !important;

    box-shadow:
        0 8px 24px rgba(29,38,66,.03) !important;
}

body .b26-section .b26-toc{
    max-height:none !important;

    overflow:visible !important;
}

.b26-side-service{
    position:relative;

    overflow:hidden !important;

    background:
        linear-gradient(145deg,#faf9ff,#fff) !important;
}

.b26-side-service:before{
    content:"";

    position:absolute;

    top:0;
    right:0;

    width:100%;
    height:3px;

    background:
        linear-gradient(
            90deg,
            transparent,
            #7058cc
        );
}


/* ==========================================================
   AT A GLANCE
   ========================================================== */

.b26-glance{
    display:grid;

    grid-template-columns:minmax(0,1fr) 235px;

    gap:21px;

    align-items:center;

    margin-bottom:14px;
    padding:18px 20px;

    border:1px solid #e6e9f1;
    border-radius:17px;

    background:
        radial-gradient(circle at 100% 0%,rgba(111,85,206,.07),transparent 31%),
        linear-gradient(145deg,#fff,#fbfcff);

    box-shadow:
        0 10px 30px rgba(31,40,71,.035);
}

.b26-glance-copy{
    min-width:0;
}

.b26-glance-eyebrow{
    display:inline-flex;

    align-items:center;

    gap:6px;

    margin-bottom:5px;

    color:#6a56bd;

    font-size:9px;
    font-weight:800;
}

.b26-glance-copy > strong{
    display:block;

    margin-bottom:4px;

    color:#273148;

    font-size:13px;
    line-height:1.8;

    font-weight:800;
}

.b26-glance-copy > p{
    display:-webkit-box;

    overflow:hidden;

    margin:0 !important;

    color:#747d90 !important;

    font-size:10px !important;
    line-height:1.85 !important;

    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
}

.b26-glance-links{
    display:grid;

    grid-template-columns:1fr 1fr;

    gap:6px;
}

.b26-glance-links a{
    display:flex;

    min-width:0;

    align-items:center;

    gap:7px;

    padding:8px;

    border:1px solid #eaebf2;
    border-radius:10px;

    background:#fff;

    color:#4e586d !important;

    text-decoration:none !important;

    transition:
        transform .18s ease,
        border-color .18s ease,
        box-shadow .18s ease;
}

.b26-glance-links a:hover{
    transform:translateY(-1px);

    border-color:#dadcf0;

    box-shadow:0 6px 15px rgba(50,60,100,.05);
}

.b26-glance-links span{
    flex:none;

    color:#745ec8;

    font-size:8px;
    font-weight:900;
}

.b26-glance-links strong{
    display:block;

    min-width:0;

    overflow:hidden;

    color:#4a556b;

    text-overflow:ellipsis;
    white-space:nowrap;

    font-size:8.5px;
    font-weight:700;
}


/* ==========================================================
   ARTICLE CARD
   ========================================================== */

body .b26-section .b26-reader{
    max-width:851px !important;
}

body .b26-section .b26-content{
    padding:30px 35px !important;

    border:1px solid #eceef3 !important;
    border-radius:18px !important;

    background:#fff !important;

    box-shadow:
        0 1px 0 rgba(30,38,62,.025),
        0 13px 36px rgba(31,39,67,.035) !important;
}

body .b26-section .b26-content > p:first-of-type{
    position:relative;

    margin-bottom:24px !important;
    padding:15px 17px !important;

    border:1px solid #e8eaf2;
    border-right:3px solid #6c5bcd;
    border-radius:12px;

    background:#fafaff;

    color:#343f55 !important;

    font-size:14.5px !important;
    line-height:2.05 !important;
}


/* SECTION NUMBERING */

.b26-content h2{
    position:relative;
}

.b26-content h2[data-b26-section-no]{
    padding-left:40px;
}

.b26-content h2[data-b26-section-no]:after{
    content:attr(data-b26-section-no);

    position:absolute;

    left:0;
    top:4px;

    display:inline-flex;

    width:31px;
    height:27px;

    align-items:center;
    justify-content:center;

    border:1px solid #e2e4f0;
    border-radius:9px;

    background:#f8f7ff;

    color:#725ec5;

    font-size:8px;
    line-height:1;

    font-weight:900;
}


/* LISTS AS MORE EDITORIAL BLOCKS */

.b26-content ul{
    padding:8px 16px 8px 8px !important;

    border-radius:12px;

    background:#fbfcfe;
}

.b26-content ul li{
    position:relative;

    padding-right:4px;
}


/* FOCUS READING */

.b26-focus-mode .b26-layout{
    grid-template-columns:1fr !important;

    max-width:900px !important;
}

.b26-focus-mode .b26-aside{
    display:none !important;
}

.b26-focus-mode .b26-reader{
    width:100% !important;
    max-width:900px !important;

    margin:0 auto !important;
}

.b26-focus-mode .b26-content{
    padding-right:55px !important;
    padding-left:55px !important;
}


/* ==========================================================
   FINAL CTA V3
   ========================================================== */

.b26-final-cta{
    border:1px solid rgba(255,255,255,.12);

    background:
        radial-gradient(circle at 0 0,rgba(255,255,255,.13),transparent 30%),
        radial-gradient(circle at 100% 100%,rgba(129,99,218,.28),transparent 36%),
        linear-gradient(135deg,#26375f,#334f9b) !important;
}


/* ==========================================================
   TABLET
   ========================================================== */

@media(max-width:991.98px){

    body .b26-section .b26-hero{
        grid-template-columns:1fr !important;

        max-width:820px !important;

        gap:17px !important;
    }

    body .b26-section .b26-hero-media{
        width:100% !important;
        max-width:100% !important;

        height:235px !important;
        max-height:235px !important;

        justify-self:stretch !important;
    }

    body .b26-section .b26-hero-media img{
        height:235px !important;

        min-height:235px !important;
        max-height:235px !important;
    }

    .b26-utility-strip{
        max-width:820px;
    }

    body .b26-section .b26-layout{
        max-width:820px !important;

        grid-template-columns:1fr !important;
    }

    .b26-glance{
        grid-template-columns:1fr;
    }

    .b26-glance-links{
        grid-template-columns:repeat(4,minmax(0,1fr));
    }
}


/* ==========================================================
   MOBILE
   ========================================================== */

@media(max-width:767.98px){

    .b26-section{
        margin-top:20px !important;
    }

    body .b26-section .b26-hero{
        gap:14px !important;

        padding:16px 14px !important;

        border-radius:17px !important;
    }

    body .b26-section .b26-hero h1{
        font-size:20px !important;
        line-height:1.68 !important;
    }

    body .b26-section .b26-lead{
        font-size:12px !important;
    }

    body .b26-section .b26-hero-media{
        height:185px !important;
        min-height:185px !important;
        max-height:185px !important;

        border-radius:14px !important;
    }

    body .b26-section .b26-hero-media img{
        height:185px !important;
        min-height:185px !important;
        max-height:185px !important;
    }

    .b26-utility-strip{
        align-items:flex-start;

        flex-direction:column;

        gap:7px;

        margin-bottom:15px;
        padding:9px;
    }

    .b26-utility-context span:last-child{
        display:none;
    }

    .b26-utility-actions{
        width:100%;

        display:grid;

        grid-template-columns:1fr 1fr;
    }

    .b26-tool-btn{
        min-height:36px;

        border-color:#eceef3;

        background:#fafbfc;
    }

    .b26-glance{
        gap:13px;

        padding:15px;

        border-radius:14px;
    }

    .b26-glance-links{
        grid-template-columns:1fr 1fr;
    }

    body .b26-section .b26-content{
        padding:21px 16px !important;

        border-radius:16px !important;
    }

    body .b26-section .b26-content > p:first-of-type{
        padding:13px !important;

        font-size:13.7px !important;
    }

    .b26-content h2[data-b26-section-no]{
        padding-left:0;
    }

    .b26-content h2[data-b26-section-no]:after{
        display:none;
    }

    .b26-focus-mode .b26-content{
        padding-right:17px !important;
        padding-left:17px !important;
    }
}


/* ==========================================================
   BORNA BLOG EDITORIAL 2026 — V4
   Reader Experience / Clean Editorial Typography
   ========================================================== */

/* HERO TITLE — remove heavy black/shadow appearance */

body .b26-section .b26-hero h1{
    position:relative !important;

    padding-right:14px !important;

    color:#29364f !important;

    font-weight:700 !important;

    text-shadow:none !important;
    filter:none !important;

    -webkit-text-stroke:0 transparent !important;
}

body .b26-section .b26-hero h1:before{
    content:"";

    position:absolute;

    top:.30em;
    right:0;

    width:3px;
    height:1.30em;

    border-radius:999px;

    background:linear-gradient(
        180deg,
        #775bd3,
        #4d6ae0
    );
}


/* Editorial identity */

.b26-utility-context{
    min-width:0;

    gap:10px;
}

.b26-editorial-byline{
    display:flex;

    flex-direction:column;

    gap:1px;
}

.b26-editorial-byline strong{
    color:#39445a;

    font-size:9.5px;

    font-weight:800;
}

.b26-editorial-byline > span{
    color:#969daa;

    font-size:8px;
}

.b26-reading-state{
    display:inline-flex;

    align-items:center;

    gap:7px;

    margin-right:7px;
    padding-right:12px;

    border-right:1px solid #eceef3;

    color:#727c8f;

    white-space:nowrap;

    font-size:8.5px;

    font-weight:700;
}

.b26-reading-state i{
    width:3px;
    height:3px;

    border-radius:50%;

    background:#b9bfca;
}


/* Reader preferences */

.b26-reader-pref-wrap{
    position:relative;
}

.b26-pref-trigger strong{
    color:#3c4760;

    font-family:Arial,sans-serif;

    font-size:11px;
}

.b26-reader-pref-panel{
    position:absolute;

    z-index:300;

    top:calc(100% + 9px);
    left:0;

    width:250px;

    padding:13px;

    border:1px solid #e5e7ef;
    border-radius:14px;

    background:#fff;

    box-shadow:0 18px 45px rgba(24,33,59,.13);

    direction:rtl;
}

.b26-reader-pref-panel[hidden]{
    display:none !important;
}

.b26-pref-title{
    margin-bottom:11px;
    padding-bottom:10px;

    border-bottom:1px solid #eceef3;

    color:#303b51;

    font-size:11px;

    font-weight:800;
}

.b26-pref-title small{
    display:block;

    margin-top:2px;

    color:#969daa;

    font-size:8px;

    font-weight:400;
}

.b26-pref-row{
    display:flex;

    align-items:center;
    justify-content:space-between;

    gap:12px;

    margin-bottom:9px;

    color:#626c80;

    font-size:9px;

    font-weight:700;
}

.b26-font-controls{
    display:flex;

    overflow:hidden;

    border:1px solid #e4e7ee;
    border-radius:9px;

    direction:ltr;
}

.b26-font-controls button{
    display:grid;

    width:36px;
    height:31px;

    place-items:center;

    border:0;
    border-left:1px solid #e7e9ef;

    background:#fafbfc;

    color:#4c576c;

    cursor:pointer;

    font-family:Arial,sans-serif !important;

    font-size:10px;

    font-weight:700;
}

.b26-font-controls button:first-child{
    border-left:0;
}

.b26-theme-control{
    display:flex;

    width:100%;

    align-items:center;

    gap:9px;

    padding:9px;

    border:1px solid #e8eaf0;
    border-radius:10px;

    background:#fafbfc;

    color:#59647a;

    text-align:right;

    cursor:pointer;
}

.b26-theme-control > span{
    display:flex;

    flex:1;
    flex-direction:column;

    color:#465167;

    font-size:9px;

    font-weight:700;
}

.b26-theme-control small{
    color:#969daa;

    font-size:8px;

    font-weight:400;
}


/* Reader text sizes */

.b26-shell.b26-text-small .b26-content p{
    font-size:13.6px !important;
}

.b26-shell.b26-text-small .b26-content li{
    font-size:13.4px !important;
}

.b26-shell.b26-text-large .b26-content p{
    font-size:16.4px !important;

    line-height:2.08 !important;
}

.b26-shell.b26-text-large .b26-content li{
    font-size:16px !important;

    line-height:2.02 !important;
}


/* Paper mode */

.b26-shell.b26-paper-mode .b26-content,
.b26-shell.b26-paper-mode .b26-glance,
.b26-shell.b26-paper-mode .b26-toc-card,
.b26-shell.b26-paper-mode .b26-side-service,
.b26-shell.b26-paper-mode .b26-faq,
.b26-shell.b26-paper-mode .b26-related{
    border-color:#e9e2d5 !important;

    background:#fffdf7 !important;
}


/* Night mode */

.b26-shell.b26-night-mode .b26-hero,
.b26-shell.b26-night-mode .b26-utility-strip,
.b26-shell.b26-night-mode .b26-glance,
.b26-shell.b26-night-mode .b26-content,
.b26-shell.b26-night-mode .b26-toc-card,
.b26-shell.b26-night-mode .b26-side-service,
.b26-shell.b26-night-mode .b26-faq,
.b26-shell.b26-night-mode .b26-faq-item,
.b26-shell.b26-night-mode .b26-related{
    border-color:#30394b !important;

    background:#1d2432 !important;

    box-shadow:none !important;
}

.b26-shell.b26-night-mode .b26-hero{
    background:
        radial-gradient(circle at 100% 0%,rgba(110,87,207,.18),transparent 30%),
        #1d2432 !important;
}

.b26-shell.b26-night-mode .b26-hero h1{
    color:#f0f3f8 !important;
}

.b26-shell.b26-night-mode .b26-lead,
.b26-shell.b26-night-mode .b26-meta{
    color:#abb3c3 !important;
}

.b26-shell.b26-night-mode .b26-content,
.b26-shell.b26-night-mode .b26-content p,
.b26-shell.b26-night-mode .b26-content li{
    color:#d4d8e1 !important;
}

.b26-shell.b26-night-mode .b26-content h1,
.b26-shell.b26-night-mode .b26-content h2,
.b26-shell.b26-night-mode .b26-content h3,
.b26-shell.b26-night-mode .b26-content h4{
    color:#f1f3f8 !important;
}

.b26-shell.b26-night-mode .b26-content > p:first-of-type{
    border-color:#343d50 !important;

    background:#222a39 !important;

    color:#e1e5ec !important;
}

.b26-shell.b26-night-mode .b26-content ul{
    background:#222a38 !important;
}

.b26-shell.b26-night-mode .b26-toc-toggle,
.b26-shell.b26-night-mode .b26-faq-question{
    background:#1d2432 !important;

    color:#e3e6ed !important;
}

.b26-shell.b26-night-mode .b26-toc a{
    color:#adb5c4 !important;
}


/* Back to top */

.b26-back-top{
    position:fixed;

    z-index:1000;

    left:22px;
    bottom:24px;

    display:grid;

    width:40px;
    height:40px;

    place-items:center;

    border:1px solid #e1e4ec;
    border-radius:13px;

    background:rgba(255,255,255,.95);

    color:#5666ba;

    opacity:0;

    visibility:hidden;

    transform:translateY(10px);

    cursor:pointer;

    box-shadow:0 10px 28px rgba(29,38,68,.12);

    backdrop-filter:blur(10px);

    transition:
        opacity .2s ease,
        visibility .2s ease,
        transform .2s ease;
}

.b26-back-top.is-visible{
    opacity:1;

    visibility:visible;

    transform:translateY(0);
}

.b26-back-top:hover{
    transform:translateY(-2px);
}


/* Mobile */

@media(max-width:767.98px){

    body .b26-section .b26-hero h1{
        padding-right:11px !important;

        font-size:19.5px !important;
    }

    .b26-reading-state{
        margin-right:auto;
    }

    .b26-editorial-byline > span{
        display:none;
    }

    .b26-reader-pref-wrap{
        width:100%;
    }

    .b26-pref-trigger{
        width:100%;
    }

    .b26-reader-pref-panel{
        right:0;
        left:auto;

        width:min(280px,88vw);
    }

    .b26-back-top{
        left:13px;
        bottom:14px;

        width:38px;
        height:38px;
    }
}

/* ==========================================================
   BORNA BLOG 2026 — COMMENT ALIGNMENT FIX
   Align comments with article reader column
   ========================================================== */

@media (min-width: 992px){

    .b26-section .comment-main-box{
        width:851px !important;
        max-width:851px !important;

        margin-top:24px !important;
        margin-right:auto !important;
        margin-left:max(0px, calc((100% - 1080px) / 2)) !important;

        box-sizing:border-box !important;
    }
}

.b26-section .comment-main-box .comment-form{
    width:100% !important;
    max-width:100% !important;

    margin:0 !important;

    box-sizing:border-box !important;
}

.b26-section .comment-main-box .comment-form > .row{
    width:100% !important;

    margin-right:0 !important;
    margin-left:0 !important;
}

.b26-section .comment-main-box .comment-form textarea.comment-content{
    display:block;

    width:100% !important;
    max-width:100% !important;

    margin:0 !important;

    box-sizing:border-box !important;
    resize:vertical;
}

@media (max-width:991.98px){

    .b26-section .comment-main-box{
        width:100% !important;
        max-width:820px !important;

        margin-right:auto !important;
        margin-left:auto !important;
    }
}

@media (max-width:767.98px){

    .b26-section .comment-main-box{
        max-width:100% !important;
    }
}


/* ==========================================================
   BORNA BLOG 2026 — FEATURED IMAGE 16:9 FINAL FIX
   Show full featured image without cropping
   ========================================================== */

body .b26-section .b26-hero-media{
    width:100% !important;
    max-width:325px !important;

    height:auto !important;
    min-height:0 !important;
    max-height:none !important;

    aspect-ratio:16 / 9 !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    overflow:hidden !important;

    border:1px solid #e5e8f0 !important;
    border-radius:17px !important;

    background:
        linear-gradient(
            135deg,
            #f7f7fc 0%,
            #ffffff 55%,
            #f5f7ff 100%
        ) !important;
}

body .b26-section .b26-hero-media img{
    display:block !important;

    width:100% !important;
    height:100% !important;

    min-height:0 !important;
    max-height:none !important;

    margin:0 !important;
    padding:0 !important;

    object-fit:contain !important;
    object-position:center center !important;

    border-radius:0 !important;
}


/* Tablet */

@media(max-width:991.98px){

    body .b26-section .b26-hero-media{
        width:100% !important;
        max-width:100% !important;

        height:auto !important;
        min-height:0 !important;
        max-height:none !important;

        aspect-ratio:16 / 9 !important;
    }

    body .b26-section .b26-hero-media img{
        width:100% !important;
        height:100% !important;

        min-height:0 !important;
        max-height:none !important;

        object-fit:contain !important;
    }
}


/* Mobile */

@media(max-width:767.98px){

    body .b26-section .b26-hero-media{
        height:auto !important;
        min-height:0 !important;
        max-height:none !important;

        aspect-ratio:16 / 9 !important;

        border-radius:14px !important;
    }

    body .b26-section .b26-hero-media img{
        height:100% !important;

        min-height:0 !important;
        max-height:none !important;

        object-fit:contain !important;
    }
}



/* BORNA_BLOG2026_RELATED_CLUSTER_V1 */

.b26-related-cluster{
    margin-top:34px;
    padding:26px;
    border-radius:24px;
    background:rgba(248,250,252,.7);
    border:1px solid rgba(15,23,42,.08);
}

.b26-related-cluster-head{
    margin-bottom:20px;
}

.b26-related-cluster-head span{
    display:block;
    font-size:12px;
    font-weight:800;
    color:#64748b;
    margin-bottom:8px;
}

.b26-related-cluster-head h2{
    margin:0;
    font-size:22px;
    line-height:1.8;
}


.b26-related-cluster-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:16px;
}


.b26-related-card{
    position:relative;
    display:flex;
    flex-direction:column;
    min-height:150px;
    padding:20px;
    border-radius:20px;
    background:#fff;
    border:1px solid rgba(15,23,42,.08);
    text-decoration:none!important;
    transition:.25s ease;
}


.b26-related-card:hover{
    transform:translateY(-4px);
}


.b26-related-card small{
    color:#64748b;
    font-size:12px;
    margin-bottom:14px;
}


.b26-related-card strong{
    color:#0f172a;
    font-size:15px;
    line-height:1.9;
    padding-left:24px;
}


.b26-related-card i{
    position:absolute;
    left:20px;
    bottom:18px;
    color:#64748b;
}


@media(max-width:900px){

    .b26-related-cluster-grid{
        grid-template-columns:1fr;
    }

}


