/* ---------- blog index ---------- */
.zx-blog__head{padding-block:var(--space-section) var(--space-xxl);max-width:760px}
.zx-blog__eyebrow{font-size:var(--type-caption-size);letter-spacing:.14em;text-transform:uppercase;color:var(--color-brand-orange)}
.zx-blog__h1{font-size:var(--type-display-size);font-weight:var(--weight-semibold);letter-spacing:-.035em;line-height:1.06;color:var(--text-strong);margin:var(--space-sm) 0 var(--space-md)}
.zx-blog__intro{font-size:var(--type-subtitle-size);line-height:1.6;color:var(--text-tertiary);margin:0}
.zx-blog__filters{display:flex;gap:var(--space-xs);flex-wrap:wrap;margin-top:var(--space-xxl)}
.zx-blog__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:var(--space-lg);padding-bottom:var(--space-section)}

.zx-post{grid-column:span 1;display:flex;flex-direction:column;border:1px solid var(--border-hairline);border-radius:var(--radius-card);overflow:hidden;background:var(--bg-card);text-decoration:none;color:inherit;transition:transform 420ms var(--ease-standard),box-shadow 420ms var(--ease-standard),border-color 260ms}
.zx-post:hover{transform:translateY(-5px);box-shadow:0 22px 46px -18px rgba(217,58,18,.3);border-color:var(--color-brand-orange)}
.zx-post[data-feature]{grid-column:span 2;flex-direction:row}
.zx-post[data-feature] .zx-cover{width:46%;height:auto;min-height:300px}
.zx-post__body{padding:var(--space-xl);display:flex;flex-direction:column;gap:var(--space-sm);flex:1}
.zx-post[data-feature] .zx-post__body{justify-content:center;padding:var(--space-xxl)}
.zx-post__cat{font-size:var(--type-micro-size);letter-spacing:.12em;text-transform:uppercase;color:var(--color-brand-orange)}
.zx-post__title{font-size:var(--type-card-title-size);font-weight:var(--weight-semibold);line-height:1.32;letter-spacing:-.01em;color:var(--text-strong);margin:0}
.zx-post[data-feature] .zx-post__title{font-size:var(--type-h3-size);letter-spacing:-.025em;line-height:1.18}
.zx-post__title span{background-image:linear-gradient(var(--color-brand-orange),var(--color-brand-orange));background-size:0 1px;background-position:0 100%;background-repeat:no-repeat;transition:background-size 420ms var(--ease-standard)}
.zx-post:hover .zx-post__title span{background-size:100% 1px}
.zx-post__ex{font-size:var(--type-body-sm-size);line-height:1.6;color:var(--text-tertiary);margin:0}
.zx-post__meta{margin-top:auto;padding-top:var(--space-md);display:flex;align-items:center;justify-content:space-between;font-size:var(--type-micro-size);letter-spacing:.06em;text-transform:uppercase;color:var(--text-muted)}
.zx-post__go{display:grid;place-items:center;width:32px;height:32px;border-radius:var(--radius-pill);border:1px solid var(--border-hairline);color:var(--text-strong);transition:var(--transition-standard)}
.zx-post:hover .zx-post__go{background:var(--brand-gradient);border-color:transparent;color:#fff;transform:translateX(3px)}

/* ---------- cover art ---------- */
.zx-cover{position:relative;height:190px;overflow:hidden;display:grid;place-items:center;isolation:isolate}
.zx-cover[data-tall]{height:min(46vw,400px);border-radius:var(--radius-panel);margin-bottom:var(--space-xxl)}
.zx-cover__grid{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.09) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.09) 1px,transparent 1px);background-size:44px 44px;mask-image:radial-gradient(120% 100% at 50% 0,#000 10%,transparent 78%)}
.zx-cover__cat{position:absolute;top:var(--space-md);left:var(--space-md);font-size:var(--type-micro-size);letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.8);border:1px solid rgba(255,255,255,.28);border-radius:var(--radius-pill);padding:5px 12px;backdrop-filter:blur(6px)}
.zx-cover__mark{width:38%;max-width:190px;opacity:.9;filter:drop-shadow(0 8px 24px rgba(0,0,0,.35));transition:transform 620ms var(--ease-standard)}
.zx-post:hover .zx-cover__mark{transform:scale(1.06) rotate(-2deg)}

/* ---------- article ---------- */
.zx-art__head{padding-block:var(--space-section) var(--space-xxl);max-width:800px;display:flex;flex-direction:column;gap:var(--space-md)}
.zx-art__cat{font-size:var(--type-caption-size);letter-spacing:.14em;text-transform:uppercase;color:var(--color-brand-orange)}
.zx-art__title{font-size:clamp(1.9rem,4.4vw,3.4rem);font-weight:var(--weight-semibold);letter-spacing:-.035em;line-height:1.08;color:var(--text-strong);margin:0}
.zx-art__lede{font-size:var(--type-subtitle-size);line-height:1.6;color:var(--text-tertiary);margin:0}
.zx-art__meta{display:flex;gap:var(--space-sm);flex-wrap:wrap;font-size:var(--type-caption-size);color:var(--text-muted)}
.zx-art__body{display:grid;grid-template-columns:200px minmax(0,720px);gap:var(--space-xxxl);padding-bottom:var(--space-section);align-items:start}
.zx-art__toc{position:sticky;top:96px;display:flex;flex-direction:column;gap:var(--space-sm);border-left:1px solid var(--border-hairline);padding-left:var(--space-md)}
.zx-art__toc>span{font-size:var(--type-micro-size);letter-spacing:.12em;text-transform:uppercase;color:var(--text-muted)}
.zx-art__toc ol{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--space-xs);counter-reset:toc}
.zx-art__toc a{font-size:var(--type-body-sm-size);color:var(--text-tertiary);text-decoration:none;line-height:1.4;display:block;transition:color 200ms,transform 260ms var(--ease-standard)}
.zx-art__toc a:hover{color:var(--color-brand-orange);transform:translateX(3px)}
.zx-prose{display:flex;flex-direction:column;gap:var(--space-xxl)}
.zx-prose h2{font-size:var(--type-h3-size);font-weight:var(--weight-semibold);letter-spacing:-.02em;line-height:1.25;color:var(--text-strong);margin:0 0 var(--space-md);scroll-margin-top:96px}
.zx-prose p{font-size:var(--type-body-size);line-height:1.75;color:var(--text-secondary);margin:0 0 var(--space-md)}
.zx-prose p:last-child{margin-bottom:0}
.zx-prose a{color:var(--color-brand-orange-deep);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;transition:color 200ms}
.zx-prose a:hover{color:var(--color-brand-orange)}
.zx-prose code{font-family:var(--font-mono);font-size:.88em;background:var(--bg-sunken);border:1px solid var(--border-hairline);border-radius:var(--radius-chip);padding:2px 6px}
.zx-art__cta{border:1px solid var(--border-hairline);border-radius:var(--radius-panel);padding:var(--space-xxl);display:flex;gap:var(--space-xl);align-items:center;justify-content:space-between;flex-wrap:wrap;background:var(--bg-sunken)}
.zx-art__cta strong{display:block;font-size:var(--type-h3-size);font-weight:var(--weight-semibold);color:var(--text-strong);letter-spacing:-.01em}
.zx-art__cta p{margin:var(--space-xs) 0 0;color:var(--text-tertiary);font-size:var(--type-body-sm-size)}
.zx-art__rel{padding-bottom:var(--space-section)}
.zx-art__rel h2{font-size:var(--type-h3-size);font-weight:var(--weight-semibold);letter-spacing:-.02em;color:var(--text-strong);margin:0 0 var(--space-xl)}
.zx-art__relgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:var(--space-lg)}

@media (max-width:1023px){
  .zx-art__body{grid-template-columns:1fr;gap:var(--space-xxl)}
  .zx-art__toc{position:static;border-left:0;border-top:1px solid var(--border-hairline);padding:var(--space-md) 0 0}
  .zx-post[data-feature]{grid-column:span 1;flex-direction:column}
  .zx-post[data-feature] .zx-cover{width:100%;min-height:0;height:190px}
  .zx-post[data-feature] .zx-post__body{padding:var(--space-xl)}
}
@media (prefers-reduced-motion:reduce){.zx-post,.zx-cover__mark,.zx-post__go{transition:none}}