/* Academiq v4 - blog pages. Link after pages.css on blogs/*.html only.
   Article = one calm reading column on the light plate; index = featured first post + card grid. */

/* ---------- reading progress tape (scroll-driven, CSS only; absent where unsupported) ---------- */
.page-article::before{
  content:"";position:fixed;left:0;top:0;z-index:60;width:100%;height:3px;pointer-events:none;
  background:var(--mint);transform-origin:0 50%;transform:scaleX(0);
}
@supports (animation-timeline:scroll()){
  .page-article::before{animation:aq-read linear both;animation-timeline:scroll(root block)}
}
@keyframes aq-read{to{transform:scaleX(1)}}

/* ---------- article column ---------- */
.page-article .only-az,.page-article .only-en,.page-article .only-ru{max-width:56rem;margin-inline:auto;min-width:0}
.page-article .detail-eyebrow{margin-top:var(--sp7);padding-top:var(--sp3);border-top:1px solid var(--rule);max-width:max-content;padding-right:var(--sp7)}
.page-article .detail-title{max-width:20ch;font-size:clamp(1.875rem,1.2rem + 3.2vw,3.5rem);margin-bottom:var(--sp6)}
.page-article .article-cover{margin-bottom:var(--sp6)}

/* ---------- reading plate ---------- */
.article-body{max-width:none;padding:clamp(28px,5vw,64px) clamp(20px,6vw,72px);font:400 1.1875rem/1.75 var(--f-body);color:var(--p-ink);hyphens:auto;overflow-wrap:break-word}
.article-body>*{max-width:68ch}
.article-body p{margin-bottom:1.25em}
.article-body>p:first-child{font-size:1.3125rem;line-height:1.6;color:var(--p-ink);font-weight:500}
.article-body h2{font-family:var(--f-display);font-size:clamp(1.5rem,1.2rem + 1vw,2rem);line-height:1.2;margin:var(--sp8) 0 var(--sp4);padding-top:var(--sp4);border-top:1px solid var(--p-rule)}
.article-body h3{font-family:var(--f-display);font-size:clamp(1.25rem,1.1rem + .6vw,1.5rem);line-height:1.25;margin:var(--sp7) 0 var(--sp3)}
.article-body ul,.article-body ol{margin:0 0 1.25em var(--sp5);padding-left:var(--sp2)}
.article-body li{margin-bottom:.5em;padding-left:var(--sp1)}
.article-body li::marker{color:var(--blue-ink)}
.article-body strong{font-weight:600}
.article-body blockquote{margin:var(--sp6) 0;padding:var(--sp2) 0 var(--sp2) var(--sp5);border-left:3px solid var(--blue-ink);color:var(--p-ink-2);font-size:1.25rem;line-height:1.55}
.article-body code,.article-body pre{font:400 .9em/1.6 var(--f-data);background:var(--p1);color:var(--p-ink)}
.article-body code{padding:.1em .4em;border-radius:var(--r1)}
.article-body pre{padding:var(--sp4);margin:0 0 1.25em;overflow-x:auto;box-shadow:var(--seat);max-width:100%}
.article-body table{width:100%;border-collapse:collapse;margin:0 0 1.25em;font-size:1rem}
.article-body th,.article-body td{padding:var(--sp2) var(--sp3);border-bottom:1px solid var(--p-rule);text-align:left}
.article-body figure{margin:var(--sp6) 0}.article-body figcaption{font:400 .75rem/1.4 var(--f-data);color:var(--p-ink-2);margin-top:var(--sp2)}
.article-body a:not(.btn){color:var(--blue-ink)}

/* end-of-article CTA sits on the surface under the plate */
.page-article a.btn.ghost{display:inline-flex;align-items:center;justify-content:center;margin-top:var(--sp6)!important;max-width:100%;text-align:center}
.article-body>p:last-child{margin-bottom:0}

@media (max-width:639px){
  .article-body{font-size:1.0625rem;line-height:1.7;hyphens:manual}
  .article-body>p:first-child{font-size:1.1875rem}
  .page-article .detail-title{max-width:100%}
}

/* ---------- index grid (home.css is not loaded here) ---------- */
.blog-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gutter)}
@media (max-width:1023px){.blog-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:639px){.blog-grid{grid-template-columns:1fr}}

/* ---------- index: featured first post ---------- */
@media (min-width:1024px){
  .listing-hero .blog-grid>.blog-card:first-child{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr)}
  .listing-hero .blog-grid>.blog-card:first-child .blog-thumb{aspect-ratio:auto;min-height:320px}
  .listing-hero .blog-grid>.blog-card:first-child .blog-body{padding:var(--sp7);justify-content:center}
  .listing-hero .blog-grid>.blog-card:first-child h3{font-size:clamp(1.75rem,1.2rem + 1.2vw,2.25rem);line-height:1.12}
  .listing-hero .blog-grid>.blog-card:first-child p{flex:0 0 auto;font-size:1.0625rem;max-width:44ch}
  /* 6-track grid so a short last row fills the width instead of leaving an empty slot */
  .listing-hero .blog-grid{grid-template-columns:repeat(6,minmax(0,1fr))}
  .listing-hero .blog-grid>.blog-card{grid-column:span 2}
  .listing-hero .blog-grid>.blog-card:first-child{grid-column:1/-1}
  .listing-hero .blog-grid>.blog-card:nth-child(3n+2):nth-last-child(2),
  .listing-hero .blog-grid>.blog-card:nth-child(3n+2):nth-last-child(2)+.blog-card{grid-column:span 3}
  .listing-hero .blog-grid>.blog-card:nth-child(3n+2):last-child{grid-column:1/-1}
}
.listing-hero .blog-thumb--photo img{filter:saturate(.9)}
@media (prefers-reduced-motion:reduce){.page-article::before{animation:none;transform:scaleX(0)}}