/* Blog: stili limitati alle nuove pagine editoriali. */
.blog-page .blog-skip{position:absolute;left:20px;top:-100px;z-index:100;background:var(--paper);color:var(--ink);padding:10px 16px;min-height:44px}
.blog-page .blog-skip:focus{top:8px}
.blog-page .blog-hero{padding-block:40px 48px;background:var(--ink);color:var(--paper)}
.blog-page .blog-hero h1{font-size:clamp(2rem,4.7vw,3.65rem);line-height:1.1;max-width:26ch;margin:16px 0 20px}
.blog-page .blog-hero .lead{max-width:68ch}
.blog-page .blog-crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;font-size:.9rem;color:#cfcfca}
.blog-page .blog-crumbs a{display:inline-flex;align-items:center;min-height:44px}
.blog-page .blog-meta{display:flex;flex-wrap:wrap;align-items:center;gap:4px 14px;margin-top:20px;font-size:.9rem;color:#cfcfca}
.blog-page .blog-meta a{display:inline-flex;align-items:center;min-height:44px}
.blog-page .blog-shelf{padding-block:52px}
.blog-page .blog-index-card{max-width:50rem;border:2px solid var(--ink);border-radius:22px;padding:28px;display:grid;gap:18px}
.blog-page .blog-index-card h2{font-size:clamp(1.5rem,3.1vw,2.4rem);line-height:1.12}
.blog-page .blog-index-card .blog-meta{color:var(--ink)}
.blog-page .blog-index-card .btn{justify-self:start}
.blog-page .blog-layout{display:grid;grid-template-columns:minmax(0,72ch) minmax(210px,1fr);gap:48px;align-items:start;padding-block:48px 64px}
.blog-page .blog-content{grid-column:1;grid-row:1;min-width:0;line-height:1.75;overflow-wrap:anywhere}
.blog-page .blog-content>p{margin-bottom:20px}
.blog-page .blog-content section{padding-block:28px;border-bottom:1px solid var(--line);scroll-margin-top:88px}
.blog-page .blog-content h2{font-size:clamp(1.4rem,2.6vw,1.9rem);line-height:1.15;margin-bottom:14px}
.blog-page .blog-content p+p{margin-top:14px}
.blog-page .blog-content ul,.blog-page .blog-content ol{padding-left:1.3em;margin:14px 0}
.blog-page .blog-content li+li{margin-top:8px}
.blog-page .blog-callout{background:var(--mist);padding:22px;border-left:4px solid var(--blue);border-radius:0 14px 14px 0;margin-block:24px 8px}
.blog-page .blog-callout h2{font-size:1.35rem}
.blog-page .blog-toc{grid-column:2;grid-row:1;position:sticky;top:84px;min-width:0;padding:16px 18px;border:1px solid var(--line);border-radius:16px;background:var(--paper)}
.blog-page .blog-toc summary{min-height:44px;padding-block:9px;cursor:pointer;font-weight:700}
.blog-page .blog-toc ol{list-style:none;margin:10px 0 0;padding:0}
.blog-page .blog-toc a{display:flex;align-items:center;min-height:44px;padding-block:8px;color:var(--blue);font-size:.92rem;line-height:1.4;overflow-wrap:anywhere}
.blog-page .blog-sources a{display:inline-flex;align-items:center;min-height:44px;padding-block:8px;color:var(--blue);overflow-wrap:anywhere}
.blog-page .blog-sources li+li{margin-top:0}
.blog-page .blog-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:20px}
.blog-page .blog-back{display:inline-flex;align-items:center;min-height:44px;margin-top:24px;font-weight:700;color:var(--blue)}
@media(max-width:900px){
.blog-page .blog-layout{grid-template-columns:minmax(0,1fr);gap:24px;padding-block:28px 44px}
.blog-page .blog-content{grid-column:1;grid-row:2}
.blog-page .blog-toc{grid-column:1;grid-row:1;position:static}
.blog-page .blog-hero{padding-block:26px 34px}
.blog-page .blog-hero h1{max-width:100%;font-size:clamp(2rem,7.6vw,2.7rem)}
.blog-page .blog-index-card{padding:20px}
.blog-page .blog-actions .btn{font-size:.9rem}
}
