/* =====================================================================
   Блог: страница со списком статей и страница статьи.
   Оформление в стиле сайта: шрифты Fatal / GilroyRad, красные и чёрные квадраты, жёлтые кнопки.
   ===================================================================== */

.blog {
  --b-ink: #1e1e1e; --b-black: #0f0f0e; --b-red: #cd1213; --b-yellow: #ffcc00; --b-gray: #efefef; --b-muted: #6f6f6d;
  --b-ease: cubic-bezier(.22, 1, .36, 1);
  padding-top: 70px; color: var(--b-ink); font-family: 'GilroyRad', Arial, sans-serif; background: #fff; overflow: hidden;
}
@media (max-width: 1199px) { .blog { padding-top: 68px; } }
@media (max-width: 959px) { .blog { padding-top: 58px; } }
@media (max-width: 639px) { .blog { padding-top: 38px; } }
.blog *, .blog *::before, .blog *::after { box-sizing: border-box; }
.blog a { color: inherit; }


/* ---------- список статей ---------- */
.blog-list { padding: 72px 0 110px; }
.blog-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 56px 32px; }
.blog-empty { grid-column: 1 / -1; margin: 40px 0; font: 500 22px/1.4 'GilroyRad', Arial, sans-serif; color: var(--b-muted); }
.bcard { display: flex; flex-direction: column; text-decoration: none; color: inherit; }
.bcard__img { position: relative; display: block; aspect-ratio: 3 / 2; overflow: hidden; background: var(--b-gray); }
.bcard__img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .8s var(--b-ease); }
.bcard:hover .bcard__img img { transform: scale(1.045); }
.bcard__img::after { content: ''; position: absolute; left: 0; bottom: 0; width: 56px; height: 56px; background: var(--b-red); transform: translate(-100%, 100%); transition: transform .5s var(--b-ease); }
.bcard:hover .bcard__img::after { transform: none; }
.bcard__ph { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; gap: 8px; }
.bcard__ph i { width: 28px; height: 28px; background: var(--b-ink); }
.bcard__ph i.r { background: var(--b-red); }
.bcard__body { display: flex; flex: 1; flex-direction: column; gap: 12px; padding-top: 20px; }
.bcard__meta { font: 600 14px/1.3 'GilroyRad', Arial, sans-serif; letter-spacing: .06em; text-transform: uppercase; color: var(--b-muted); }
.bcard__title { font: 700 34px/1.02 'Fatal', Arial, sans-serif; text-transform: uppercase; color: var(--b-ink); transition: color .3s var(--b-ease); }
.bcard:hover .bcard__title { color: var(--b-red); }
.bcard__text { font: 500 17px/1.5 'GilroyRad', Arial, sans-serif; color: #4a4a48; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.bcard__more { display: inline-flex; align-items: center; gap: 12px; margin-top: auto; padding-top: 6px; font: 700 16px/1 'GilroyRad', Arial, sans-serif; letter-spacing: .04em; text-transform: uppercase; }
.bcard__more i { display: block; width: 30px; height: 18px; background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 24' fill='none' stroke='%23cd1213' stroke-width='3'><path d='M1 12h36M27 2l10 10-10 10'/></svg>") center / contain no-repeat; transition: transform .45s var(--b-ease); }
.bcard:hover .bcard__more i { transform: translateX(8px); }
@media (max-width: 1199px) { .blog-grid { gap: 48px 24px; } .bcard__title { font-size: 27px; } }
@media (max-width: 959px) {
  .blog-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 44px 24px; }
  .blog-list { padding: 52px 0 80px; }
}
@media (max-width: 639px) {
  .blog-grid { grid-template-columns: 1fr; gap: 40px; }
  .bcard__title { font-size: 32px; }
}

/* ---------- статья ---------- */
.post-head { padding: 52px 0 40px; }
.crumbs { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-bottom: 26px; font: 600 14px/1.3 'GilroyRad', Arial, sans-serif; letter-spacing: .06em; text-transform: uppercase; color: var(--b-muted); }
.crumbs a { text-decoration: none; color: var(--b-ink); border-bottom: 2px solid var(--b-red); padding-bottom: 1px; }
.crumbs a:hover { color: var(--b-red); }
.crumbs i { width: 8px; height: 8px; background: var(--b-red); display: block; }
.post-title { margin: 0; max-width: 1000px; font: 700 clamp(40px, 6.4vw, 88px)/.98 'Fatal', Arial, sans-serif; text-transform: uppercase; color: var(--b-ink); overflow-wrap: anywhere; }
.post-meta { margin: 26px 0 0; font: 600 15px/1.3 'GilroyRad', Arial, sans-serif; letter-spacing: .06em; text-transform: uppercase; color: var(--b-muted); }
@media (max-width: 639px) { .post-head { padding: 34px 0 28px; } .crumbs { margin-bottom: 18px; } .post-meta { margin-top: 18px; font-size: 13px; } }

.post-cover { margin: 0 0 64px; }
.post-cover img { display: block; width: 100%; height: auto; background: var(--b-gray); }
.post-cover .blog-wrap::after { content: ''; position: absolute; left: 40px; bottom: 0; width: 96px; height: 96px; background: var(--b-red); transform: translate(-45%, 45%); }
@media (max-width: 959px) { .post-cover { margin-bottom: 44px; } .post-cover .blog-wrap::after { width: 56px; height: 56px; left: 20px; } }

.post-body { max-width: 760px; margin: 0 auto; font: 500 20px/1.72 'GilroyRad', Arial, sans-serif; color: #232322; }
.post-body > :first-child { margin-top: 0; }
.post-body p { margin: 0 0 1.25em; }
.post-body a { color: var(--b-red); text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 2px; transition: color .25s; }
.post-body a:hover { color: var(--b-black); }
.post-body strong { font-weight: 700; color: var(--b-black); }
.post-body h2 { margin: 1.7em 0 .55em; font: 700 clamp(34px, 4.4vw, 52px)/1.02 'Fatal', Arial, sans-serif; text-transform: uppercase; color: var(--b-ink); }
.post-body h2::before { content: ''; display: block; width: 54px; height: 6px; margin-bottom: 18px; background: var(--b-red); }
.post-body h3 { margin: 1.6em 0 .5em; font: 700 27px/1.25 'GilroyRad', Arial, sans-serif; color: var(--b-black); }
.post-body ul, .post-body ol { margin: 0 0 1.4em; padding: 0; list-style: none; counter-reset: pl; }
.post-body li { position: relative; margin: 0 0 .65em; padding-left: 36px; }
.post-body ul li::before { content: ''; position: absolute; left: 4px; top: .66em; width: 11px; height: 11px; background: var(--b-red); }
.post-body ol li { counter-increment: pl; }
.post-body ol li::before { content: counter(pl); position: absolute; left: 0; top: .04em; font: 700 28px/1.2 'Fatal', Arial, sans-serif; color: var(--b-red); }
.post-body blockquote { margin: 2em 0; padding: 6px 0 6px 30px; border-left: 6px solid var(--b-red); }
.post-body blockquote p { margin: 0; font: 600 26px/1.4 'GilroyRad', Arial, sans-serif; color: var(--b-black); }
.post-body cite { display: block; margin-top: 14px; font: 600 15px/1.3 'GilroyRad', Arial, sans-serif; letter-spacing: .06em; text-transform: uppercase; font-style: normal; color: var(--b-muted); }
.pcallout { margin: 2em 0; padding: 28px 32px; background: var(--b-gray); border-left: 6px solid var(--b-yellow); }
.pcallout__t { display: block; margin-bottom: 10px; font: 700 28px/1.1 'Fatal', Arial, sans-serif; text-transform: uppercase; color: var(--b-black); }
.pcallout p { margin: 0; font-size: 18px; line-height: 1.6; }
.pimg { margin: 2.2em 0; }
.pimg img { display: block; width: 100%; height: auto; background: var(--b-gray); }
.pimg--wide { margin-left: -90px; margin-right: -90px; }
.pimg figcaption { margin-top: 12px; font: 500 15px/1.45 'GilroyRad', Arial, sans-serif; color: var(--b-muted); }
.pdiv { width: 58px; height: 14px; border: 0; margin: 52px 0; background:
  linear-gradient(#1e1e1e, #1e1e1e) 0 0 / 14px 14px no-repeat, linear-gradient(#1e1e1e, #1e1e1e) 22px 0 / 14px 14px no-repeat, linear-gradient(#cd1213, #cd1213) 44px 0 / 14px 14px no-repeat; }
.pcta { margin: 2.4em 0; padding: 30px 32px; background: var(--b-black); color: #fff; display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; }
.pcta__t { margin: 0; flex: 1 1 260px; font: 600 22px/1.35 'GilroyRad', Arial, sans-serif; color: #fff; }
@media (max-width: 1023px) { .pimg--wide { margin-left: 0; margin-right: 0; } }
@media (max-width: 639px) {
  .post-body { font-size: 18px; line-height: 1.68; }
  .post-body blockquote p { font-size: 21px; }
  .post-body h3 { font-size: 23px; }
  .pcallout { padding: 22px 22px; }
  .pcta { padding: 24px 20px; }
}

/* кнопка в стиле главного экрана: жёлтое поле и чёрный квадрат со стрелкой */
.post-body a.bbtn, .bbtn {
  position: relative; display: inline-flex; align-items: center; height: 62px; padding: 0 88px 0 24px; flex: none;
  background: var(--b-yellow); color: var(--b-black); text-decoration: none; font: 700 32px/1 'Fatal', Arial, sans-serif; text-transform: uppercase;
  transition: transform .45s var(--b-ease), box-shadow .45s var(--b-ease);
}
.bbtn::after {
  content: ''; position: absolute; top: 0; right: 0; bottom: 0; width: 62px;
  background: var(--b-black) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 24' fill='none' stroke='%23fff' stroke-width='3'><path d='M1 12h36M27 2l10 10-10 10'/></svg>") center / 28px 17px no-repeat;
  transition: background-position .45s var(--b-ease);
}
.pcta .bbtn::after { background-color: #fff; background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 24' fill='none' stroke='%230f0f0e' stroke-width='3'><path d='M1 12h36M27 2l10 10-10 10'/></svg>"); }
.bbtn:hover { transform: translateY(-3px); box-shadow: 0 10px 0 -4px rgba(15, 15, 14, .18); }
.bbtn:hover::after { background-position: 62% center; }
.bbtn:focus-visible { outline: 3px solid var(--b-red); outline-offset: 3px; }

/* ---------- читайте также и призыв ---------- */
.post-more { padding: 90px 0 20px; margin-top: 90px; border-top: 2px solid var(--b-gray); }
.post-more__title { margin: 0 0 40px; font: 700 clamp(40px, 5vw, 64px)/1 'Fatal', Arial, sans-serif; text-transform: uppercase; color: var(--b-ink); }
.post-cta { margin-top: 90px; background: var(--b-gray); padding: 80px 0; position: relative; }
.post-cta::before { content: ''; position: absolute; left: 0; top: 0; width: 90px; height: 90px; background: var(--b-red); }
.post-cta__box { display: flex; align-items: center; justify-content: space-between; gap: 40px; flex-wrap: wrap; }
.post-cta__title { margin: 0; font: 700 clamp(40px, 5vw, 68px)/1 'Fatal', Arial, sans-serif; text-transform: uppercase; color: var(--b-ink); }
.post-cta__text { margin: 14px 0 0; font: 500 20px/1.4 'GilroyRad', Arial, sans-serif; color: #444; max-width: 520px; }
.post-more + .post-cta { margin-top: 70px; }
@media (max-width: 959px) { .post-more { padding-top: 60px; margin-top: 60px; } .post-cta { padding: 60px 0; margin-top: 60px; } .post-cta::before { width: 56px; height: 56px; } }

@media (prefers-reduced-motion: reduce) {
  .bcard__img img, .bcard__img::after, .bcard__more i, .bbtn, .bbtn::after { transition: none; }
}

/* ---------- таблицы и источники в статьях ---------- */
.ptable { margin: 2.2em 0; }
.ptable__scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; border: 2px solid var(--b-ink); }
.ptable table { width: 100%; min-width: 560px; border-collapse: collapse; font: 500 17px/1.45 'GilroyRad', Arial, sans-serif; }
.ptable th { padding: 14px 16px; background: var(--b-black); color: #fff; text-align: left; font: 700 14px/1.3 'GilroyRad', Arial, sans-serif; letter-spacing: .05em; text-transform: uppercase; border-right: 1px solid #3a3a38; }
.ptable th:last-child { border-right: 0; }
.ptable td { padding: 14px 16px; vertical-align: top; border-top: 1px solid var(--b-line, #e4e4e2); border-right: 1px solid var(--b-line, #e4e4e2); }
.ptable td:last-child { border-right: 0; }
.ptable tbody tr:nth-child(even) td { background: #f6f6f5; }
.ptable tbody td:first-child { font-weight: 700; color: var(--b-black); }
.ptable figcaption { margin-top: 12px; font: 500 15px/1.45 'GilroyRad', Arial, sans-serif; color: var(--b-muted); }
.pimg--wide + .ptable { margin-top: 2.2em; }
.post-body .ptable { margin-left: -60px; margin-right: -60px; }
.psrc { margin-top: 3em; padding-top: 1.4em; border-top: 2px solid var(--b-gray); }
.post-body .psrc h2 { margin-top: 0; font-size: 34px; }
.post-body .psrc ol { counter-reset: src; margin: 0; }
.post-body .psrc li { counter-increment: src; padding-left: 38px; margin-bottom: .8em; font-size: 15px; line-height: 1.55; color: #4a4a48; overflow-wrap: anywhere; }
.post-body .psrc li::before { content: counter(src); position: absolute; left: 0; top: 0; font: 700 20px/1.2 'Fatal', Arial, sans-serif; color: var(--b-red); }
.post-body .psrc a { font-size: inherit; }
@media (max-width: 1023px) { .post-body .ptable { margin-left: 0; margin-right: 0; } }
@media (max-width: 639px) { .ptable table { font-size: 15px; } .ptable th, .ptable td { padding: 11px 12px; } }

/* ---------- разделы блога: подпись в статье ---------- */
.post-meta__sec { color: inherit; text-decoration: none; border-bottom: 2px solid var(--b-red); padding-bottom: 1px; }
.post-meta__sec:hover { color: var(--b-red); }