
body{margin:0}
.crumbs{font-size:14px;color:var(--on-ink-muted);display:flex;gap:8px;flex-wrap:wrap}
.crumbs a{color:var(--on-ink-muted)}
.meta{display:flex;gap:10px;flex-wrap:wrap;align-items:center;font-size:14px;color:var(--on-ink-muted);font-weight:600}
.cat{background:var(--grad);color:var(--ink);padding:5px 12px;border-radius:999px;font-weight:800;font-size:12.5px}
.art-head{background:var(--ink);color:var(--on-ink);position:relative;overflow:hidden}
.art-head .wrap{max-width:860px;padding-block:clamp(32px,5vw,64px);display:grid;gap:18px}
.art-head h1{font-size:clamp(30px,4.4vw,52px);line-height:1.1}
.art-head .lead{color:var(--on-ink-muted);font-size:19px;max-width:60ch}
.author{display:flex;gap:12px;align-items:center}
.author img{width:46px;height:46px;border-radius:50%;object-fit:cover;object-position:50% 20%}
.author b{display:block;font-family:var(--display);font-size:15px}
.author span{color:var(--on-ink-muted);font-size:13.5px}
.art-body{background:var(--paper);color:var(--on-paper)}
.art-body .wrap{max-width:860px;padding-bottom:clamp(48px,6vw,80px);display:grid;gap:36px}
.cover{width:auto;max-width:100%;max-height:560px;height:auto;justify-self:center;border-radius:26px;margin-top:36px;position:relative;z-index:1;box-shadow:0 30px 60px -30px rgba(18,18,22,.5);background:#fff}
.prose{font-size:18.5px;line-height:1.75;color:#2B2A30;display:grid;gap:18px;max-width:68ch;margin-inline:auto;width:100%;min-width:0}
.prose p{margin:0}
.prose h2{font-size:clamp(24px,2.6vw,30px);margin-top:14px}
.prose h3{font-size:22px;margin-top:10px}
.prose h4{font-size:19px}
.prose ul,.prose ol{margin:0;padding-left:24px;display:grid;gap:8px}
.prose li::marker{color:var(--pink)}
.prose a{color:var(--on-paper);text-decoration:underline;text-decoration-color:var(--pink);text-decoration-thickness:2px;text-underline-offset:3px;word-break:break-word}
.prose img{width:100%;height:auto;border-radius:18px}
.prose figure{margin:0;display:grid;gap:8px}
.prose figcaption{font-size:14px;color:var(--on-paper-muted)}
.prose blockquote{margin:0;padding:18px 24px;border-left:4px solid var(--pink);background:var(--card);border-radius:0;font-family:var(--display);font-size:20px;line-height:1.5}
.prose strong,.prose b{color:var(--on-paper)}
.art-cta{background:var(--grad);color:var(--ink);border-radius:26px;padding:clamp(24px,4vw,40px);display:grid;gap:12px;justify-items:start;max-width:68ch;margin-inline:auto;width:100%}
.art-cta h2{font-size:clamp(22px,2.6vw,30px)}
.art-cta .btn{background:var(--ink);color:var(--on-ink)}
.back{max-width:68ch;margin-inline:auto;width:100%}
.back a{font-weight:800;text-decoration:none;color:var(--on-paper)}
.related{border-top:1px solid var(--paper-line)}
.posts{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:20px;align-items:start}
.post{background:var(--card);border-radius:22px;overflow:hidden;display:grid;grid-template-rows:auto 1fr;text-decoration:none;color:var(--on-paper);transition:transform .25s ease;min-width:0}
.post:hover{transform:translateY(-6px)}
.post img{width:100%;height:auto}
.post .pt{padding:16px 18px 20px;display:grid;gap:8px;align-content:start}
.post .meta{color:var(--on-paper-muted)}
.post h3{font-size:17px;line-height:1.3}

