/* ============================================================
   MAAT — ARTICLE & ARTICLES-INDEX STYLES
   Использует переменные дизайн-системы styles.css (тема skylight по умолчанию).
   ============================================================ */

/* Непрозрачное фиксированное меню на страницах статей,
   чтобы текст не просвечивал сквозь него при скролле. */
.navbar{
  background:var(--nav-bg);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  border-bottom:1px solid var(--border);
}

/* ===== ARTICLE HERO ===== */
.article-hero{
  padding:130px 0 50px;
  border-bottom:1px solid var(--border);
  background:radial-gradient(ellipse 90% 70% at 50% 0%,var(--glow) 0%,var(--bg) 55%,var(--bg2) 100%);
}
.article-hero__inner{max-width:760px;margin:0 auto;padding:0 24px}
.article-hero__back{
  display:inline-flex;align-items:center;gap:8px;
  font-size:.72rem;letter-spacing:.15em;text-transform:uppercase;
  color:var(--text3);transition:var(--t);margin-bottom:36px;
}
.article-hero__back:hover{color:var(--gold)}
.article-hero__back svg{transition:transform var(--t)}
.article-hero__back:hover svg{transform:translateX(-3px)}
.article-hero__cat{
  font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--gold);margin-bottom:16px;
}
.article-hero__title{
  font-family:var(--font-serif);font-size:clamp(2rem,4.5vw,3.1rem);
  font-weight:500;color:var(--ink);line-height:1.18;margin-bottom:22px;letter-spacing:.01em;
}
.article-hero__meta{
  display:flex;align-items:center;gap:16px;flex-wrap:wrap;
  font-size:.78rem;color:var(--text3);letter-spacing:.04em;
}
.article-hero__meta .dot{opacity:.5}
.article-hero__tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
.article-tag{
  font-size:.7rem;letter-spacing:.06em;color:var(--text2);
  border:1px solid var(--border2);border-radius:30px;padding:5px 13px;transition:var(--t);
}
.article-tag:hover{border-color:var(--gold);color:var(--gold)}

/* ===== ARTICLE BODY ===== */
.article-body{padding:54px 0 70px}
.article-body__inner{max-width:760px;margin:0 auto;padding:0 24px}
.article-body__inner p{
  font-size:1.08rem;line-height:1.85;color:var(--text);margin-bottom:1.4em;
}
.article-body__inner h2{
  font-family:var(--font-serif);font-size:1.65rem;font-weight:500;color:var(--ink);
  margin:2.4em 0 .7em;padding-top:.6em;border-top:1px solid var(--border);
}
.article-body__inner h3{
  font-family:var(--font-serif);font-size:1.3rem;font-weight:500;color:var(--ink);
  margin:1.9em 0 .5em;
}
.article-body__inner strong{color:var(--ink);font-weight:700}
.article-body__inner em{font-style:italic;color:var(--text2)}
.article-body__inner ul,.article-body__inner ol{padding-left:1.4em;margin-bottom:1.4em}
.article-body__inner li{
  font-size:1.06rem;line-height:1.75;color:var(--text);margin-bottom:.5em;
}
.article-body__inner li::marker{color:var(--gold)}
.article-body__inner hr{border:none;border-top:1px solid var(--border);margin:2.4em 0}
.article-body__inner blockquote{
  border-left:3px solid var(--gold);padding:.2em 0 .2em 1.4em;margin:1.8em 0;
  font-family:var(--font-serif);font-style:italic;font-size:1.2rem;color:var(--text2);
}
.article-body__inner a{
  color:var(--gold);text-decoration:underline;
  text-decoration-color:var(--border2);text-underline-offset:3px;
}
.article-body__inner a:hover{text-decoration-color:var(--gold)}

/* ===== MAAT CTA (обязательный финальный блок) ===== */
.article-maat-cta{
  max-width:760px;margin:10px auto 0;padding:0 24px;
}
.article-maat-cta__box{
  border:1px solid var(--gold);border-radius:var(--radius);
  background:linear-gradient(180deg,var(--surface) 0%,var(--bg2) 100%);
  padding:34px 32px;box-shadow:var(--shadow-md);
}
.article-maat-cta__sigil{font-size:1.7rem;color:var(--gold);line-height:1;margin-bottom:12px}
.article-maat-cta__title{
  font-family:var(--font-serif);font-size:1.5rem;font-weight:500;color:var(--ink);margin-bottom:12px;
}
.article-maat-cta__text{font-size:1rem;line-height:1.75;color:var(--text2);margin-bottom:22px}
.article-maat-cta__actions{display:flex;flex-wrap:wrap;gap:12px}

/* ===== ARTICLE FOOTER ===== */
.article-footer{border-top:1px solid var(--border);padding:42px 0;margin-top:54px}
.article-footer__inner{max-width:760px;margin:0 auto;padding:0 24px}
.article-footer__source{
  font-size:.82rem;color:var(--text3);line-height:1.65;margin-bottom:28px;
  padding:16px 20px;border:1px solid var(--border);border-radius:var(--radius);background:var(--bg2);
}
.article-footer__source a{color:var(--gold)}
.article-footer__cta{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.article-footer__cta-label{
  font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;color:var(--text3);
}
.article-footer__btn{
  display:inline-flex;align-items:center;gap:8px;padding:11px 22px;
  border:1px solid var(--border2);border-radius:2px;font-size:.76rem;letter-spacing:.1em;
  text-transform:uppercase;color:var(--text2);transition:var(--t);
}
.article-footer__btn:hover{border-color:var(--gold);color:var(--gold)}
.article-footer__btn--books{border-color:var(--gold);color:var(--gold)}

/* ============================================================
   ARTICLES INDEX (articles.html)
   ============================================================ */
.articles-hero{
  padding:130px 0 40px;text-align:center;
  background:radial-gradient(ellipse 90% 70% at 50% 0%,var(--glow) 0%,var(--bg) 60%,var(--bg2) 100%);
}
.articles-hero .kicker{
  font-size:.72rem;letter-spacing:.26em;text-transform:uppercase;color:var(--gold-dim);margin-bottom:16px;
}
.articles-hero h1{
  font-family:var(--font-serif);font-size:clamp(2.4rem,5vw,3.6rem);font-weight:400;
  color:var(--ink);line-height:1.08;margin-bottom:14px;
}
.articles-hero p{max-width:600px;margin:0 auto;color:var(--text2);font-size:1.05rem}

.articles-wrap{max-width:880px;margin:0 auto;padding:40px 24px 90px}
.articles-filter{
  display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-bottom:38px;
}
.articles-filter button{
  background:transparent;border:1px solid var(--border2);color:var(--text2);
  padding:8px 16px;border-radius:30px;cursor:pointer;font-family:var(--font-sans);
  font-size:.72rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;transition:var(--t);
}
.articles-filter button:hover{color:var(--gold);border-color:var(--gold)}
.articles-filter button.active{background:var(--gold);color:var(--on-accent);border-color:var(--gold)}

.articles-list{display:flex;flex-direction:column;gap:1px;background:var(--border);border:1px solid var(--border)}
.articles-list__item{
  display:flex;align-items:center;gap:22px;padding:24px 26px;background:var(--surface);transition:var(--t);
}
.articles-list__item:hover{background:var(--bg)}
.articles-list__num{
  font-family:var(--font-serif);font-size:1.4rem;color:var(--gold-dim);flex:none;width:46px;
}
.articles-list__body{flex:1;min-width:0}
.articles-list__cat{
  font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);margin-bottom:6px;
}
.articles-list__title{
  display:block;font-family:var(--font-serif);font-size:1.3rem;font-weight:500;
  color:var(--ink);line-height:1.3;margin-bottom:6px;
}
.articles-list__excerpt{font-size:.92rem;color:var(--text2);line-height:1.5}
.articles-list__arrow{color:var(--gold);flex:none;transition:var(--t)}
.articles-list__item:hover .articles-list__arrow{transform:translateX(4px)}

@media(max-width:640px){
  .articles-list__num{display:none}
  .article-maat-cta__box{padding:26px 22px}
}