/* Universal blog article template styles — reusable for future posts */
.blog-reading-progress{position:fixed;inset:0 0 auto 0;height:4px;background:rgba(255,255,255,.14);z-index:120;pointer-events:none}
.blog-reading-progress__bar{display:block;height:100%;width:0;background:linear-gradient(90deg,#7fd8ef 0%,#2aa7d5 100%);box-shadow:0 0 20px rgba(127,216,239,.45)}
.blog-reading-progress__badge{position:fixed;top:5.7rem;right:clamp(1rem,2vw,1.6rem);z-index:121;padding:.55rem .8rem;border-radius:999px;background:rgba(3,24,39,.82);color:#f7fbfd;border:1px solid rgba(143,217,237,.32);backdrop-filter:blur(10px);font-size:.84rem;font-weight:600;letter-spacing:.03em;box-shadow:0 1rem 2rem rgba(0,0,0,.18)}
.blog-post-template{background:linear-gradient(180deg,#f5fafc 0%,#eef6fa 32%,#ffffff 100%)}
.blog-hero{padding:clamp(11rem,16vw,13rem) 0 clamp(3.5rem,6vw,5rem);background:radial-gradient(circle at 78% 22%,rgba(115,209,235,.22),transparent 24rem),linear-gradient(140deg,#062f44 0%,#08344c 46%,#021f32 100%);color:#fff;overflow:hidden}
.blog-hero__grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(19rem,.75fr);gap:clamp(2.5rem,6vw,5rem);align-items:center}
.blog-kicker{margin:0;color:#83d8ee;text-transform:uppercase;letter-spacing:.16em;font-size:.82rem;font-weight:700}
.blog-hero .display{margin:0;max-width:12ch;font-size:clamp(2.9rem,6vw,5.9rem);line-height:.98}
.blog-hero .display .blog-subtitle{display:block;margin-top:.65rem;font-size:clamp(1.35rem,2vw,1.95rem);line-height:1.16;color:#d7eef6;font-weight:500}
.blog-lede{margin:0;max-width:43rem;font-size:clamp(1.05rem,1rem + .3vw,1.28rem);line-height:1.75;color:rgba(255,255,255,.88)}
.blog-meta{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:1.55rem}
.blog-meta span,.blog-meta time{display:inline-flex;align-items:center;padding:.58rem .92rem;border-radius:999px;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.16);color:#e8f5fa;font-size:.92rem}
.blog-author{display:inline-flex;flex-wrap:wrap;align-items:center;gap:.7rem;margin-top:1.25rem;padding:.9rem 1rem;border-radius:1.2rem;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.14)}
.blog-author__label{font-size:.82rem;text-transform:uppercase;letter-spacing:.14em;color:#88d9ee;margin:0}
.blog-author__name{margin:0;font-weight:700;color:#fff}
.blog-author__name a{color:#fff;text-decoration:none;border-bottom:1px solid rgba(255,255,255,.4)}
.blog-author__role{margin:0;color:rgba(255,255,255,.78);font-size:.95rem}
.blog-hero__figure{margin:0;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.16);padding:1rem;box-shadow:0 2rem 5rem rgba(0,0,0,.24);backdrop-filter:blur(10px)}
.blog-hero__figure img{display:block;width:100%;height:auto}
.blog-hero__figure figcaption{margin-top:.85rem;color:#d8eef5;font-size:.92rem;line-height:1.6}
.blog-overview{padding:clamp(2rem,5vw,3rem) 0 0}
.blog-overview__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.35rem}
.blog-panel{background:#fff;border:1px solid rgba(4,47,68,.08);box-shadow:0 1.5rem 3rem rgba(3,28,44,.08);padding:1.45rem 1.35rem;display:grid;gap:.9rem}
.blog-panel h2,.blog-panel h3{margin:0;color:#072e43;font-size:1.15rem;line-height:1.2}
.blog-panel p{margin:0;color:#3f5967;line-height:1.75}
.blog-panel ul,.blog-panel ol{margin:0;padding-left:1.1rem;color:#143749;display:grid;gap:.55rem;line-height:1.65}
.blog-panel dl{display:grid;gap:.85rem;margin:0}
.blog-panel dl div{display:flex;justify-content:space-between;gap:1rem;padding-bottom:.75rem;border-bottom:1px solid rgba(4,47,68,.08)}
.blog-panel dl div:last-child{padding-bottom:0;border-bottom:0}
.blog-panel dt{color:#58727f;font-weight:600}
.blog-panel dd{margin:0;color:#072e43;font-weight:700;text-align:right}
.blog-article{padding:clamp(2.5rem,5vw,4rem) 0 clamp(4rem,6vw,5rem)}
.blog-article__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(15rem,18rem);gap:clamp(2rem,4vw,3rem);align-items:start}
.blog-content{min-width:0}
.blog-content section{background:#fff;border:1px solid rgba(4,47,68,.08);box-shadow:0 1.5rem 3rem rgba(3,28,44,.06);padding:clamp(1.6rem,3vw,2.2rem);margin-bottom:1.35rem}
.blog-content h2{margin:0 0 1rem;color:#072e43;font-size:clamp(1.65rem,2vw,2.3rem);line-height:1.1}
.blog-content h3{margin:1.6rem 0 .8rem;color:#072e43;font-size:1.22rem;line-height:1.25}
.blog-content p{margin:0 0 1rem;color:#304b5a;line-height:1.86;font-size:1rem}
.blog-content p:last-child,.blog-content ul:last-child,.blog-content ol:last-child{margin-bottom:0}
.blog-content ul,.blog-content ol{padding-left:1.2rem;margin:0 0 1rem;color:#143749;display:grid;gap:.72rem;line-height:1.7}
.blog-callout{border-left:4px solid #2aa7d5;background:linear-gradient(180deg,#f6fbfe 0%,#eff7fb 100%)}
.blog-callout p:last-child{margin-bottom:0}
.blog-case{background:linear-gradient(180deg,#f9fcfe 0%,#f4f9fc 100%)}
.blog-steps li strong{display:block;color:#072e43;margin-bottom:.18rem}
.blog-sidebar{position:sticky;top:8.5rem}
.blog-sidebar__box{background:#062f44;color:#eff8fb;border:1px solid rgba(127,216,239,.16);padding:1.2rem;box-shadow:0 1.5rem 3rem rgba(3,28,44,.18)}
.blog-sidebar__eyebrow{margin:0 0 .8rem;color:#8cdef2;text-transform:uppercase;letter-spacing:.14em;font-size:.74rem;font-weight:700}
.blog-sidebar nav,.blog-sidebar ul{display:grid;gap:.72rem}
.blog-sidebar a{color:#f5fbfd;text-decoration:none;line-height:1.45}
.blog-sidebar a:hover{color:#8cdef2}
.blog-sidebar ul{list-style:none;padding:0;margin:1rem 0 0}
.blog-sidebar li{padding-left:1.1rem;position:relative;color:#cfe7ee;line-height:1.55}
.blog-sidebar li::before{content:"";position:absolute;left:0;top:.6rem;width:.42rem;height:.42rem;border-radius:999px;background:#75d8ee}
.blog-summary-chip{display:inline-flex;align-items:center;gap:.5rem;padding:.45rem .8rem;border-radius:999px;background:#edf8fc;color:#0a3b53;font-size:.84rem;font-weight:700;margin-bottom:.8rem}
.blog-references li{line-height:1.75}
.blog-references a{color:#166996;text-decoration:underline;text-underline-offset:2px}
.blog-cta{padding:0 0 clamp(4rem,7vw,5.5rem)}
.blog-cta__card{background:linear-gradient(140deg,#06354d 0%,#0a4461 100%);color:#fff;padding:clamp(1.75rem,4vw,2.6rem);display:grid;gap:1rem;border:1px solid rgba(255,255,255,.12);box-shadow:0 2rem 4rem rgba(3,28,44,.18)}
.blog-cta__card h2{margin:0;font-size:clamp(1.8rem,2.5vw,2.5rem);line-height:1.1}
.blog-cta__card p{margin:0;max-width:46rem;color:rgba(255,255,255,.86);line-height:1.75}
.blog-cta__actions{display:flex;flex-wrap:wrap;gap:1rem;margin-top:.35rem}
.blog-cta__actions .button{display:inline-flex;justify-content:center}
@media (max-width: 980px){.blog-hero__grid,.blog-article__grid,.blog-overview__grid{grid-template-columns:minmax(0,1fr)}.blog-sidebar{position:static;order:-1}.blog-reading-progress__badge{top:5.2rem;right:.85rem;font-size:.78rem}.blog-hero .display{max-width:100%}}
@media (max-width: 680px){.blog-hero{padding-top:10.2rem}.blog-meta span,.blog-meta time{font-size:.84rem}.blog-author{display:grid}.blog-content section,.blog-panel,.blog-sidebar__box,.blog-cta__card{border-radius:1rem}.blog-content p,.blog-panel p{line-height:1.74}}

/* Mobile table of contents (sidebar stacks below 980px) */
.article-toc{display:none}
@media (max-width:980px){
.article-toc{display:block;background:#fff;border:1px solid rgba(4,47,68,.08);box-shadow:0 1.5rem 3rem rgba(3,28,44,.06);padding:1.1rem 1.3rem;margin-bottom:1.35rem}
.article-toc summary{cursor:pointer;font-weight:700;color:#072e43;font-size:1.05rem;list-style:none;display:flex;align-items:center;justify-content:space-between}
.article-toc summary::after{content:'+';font-size:1.3rem;color:#2aa7d5;line-height:1}
.article-toc[open] summary::after{content:'\2013'}
.article-toc ul{list-style:none;margin:.9rem 0 0;padding:0;display:grid;gap:.6rem}
.article-toc a{color:#166996;text-decoration:none;line-height:1.5}
.article-toc a:hover{text-decoration:underline}
}