/* Статьи и посты блога: колонка текста как t-col_8 в Tilda (760 / 620 / 600 px, на телефоне — с полями 20 px).
   Отступы блоков — как отступы записей Tilda (у каждого блока свои сверху/снизу; --pt/--pb переопределяют,
   на телефоне до 480 px — --ptm/--pbm). Баннеры и низ страницы — координатная вёрстка zero.css. */

.art { background: var(--c-bg); color: #232323; }
.art__col { width: 760px; margin: 0 auto; }
@media (max-width: 1200px) { .art__col { width: 620px; } }
@media (max-width: 960px) { .art__col { width: 600px; } }
@media (max-width: 640px) { .art__col { width: auto; margin: 0 var(--gutter); } }

.art a { color: var(--c-orange); }
.art a:hover { text-decoration: underline; }
.art strong, .art b { font-weight: 700; }
.art ul, .art ol { margin: 0 0 10px; padding-left: 20px; }
.art ol { padding-left: 22px; }
.art--ul30 ul { padding-left: 30px; }   /* на части статей в Tilda был свой отступ списков */
.art ul { list-style: disc; }
.art ol { list-style: decimal; }

/* ---------- заголовок и текст (T225) ---------- */
.a-s { padding: calc(var(--pt, 15) * 1px) 0 calc(var(--pb, 45) * 1px); }
.a-s--head { padding-top: calc(var(--pt, 135) * 1px); }
.a-s > h1, .a-s > h2, .a-s > h3, .a-s > p[class^="a-t"] { padding: 8px 0 15px; color: #232323; }
.a-up { padding-bottom: 14px; color: var(--c-orange); font-size: 20px; line-height: 1.35; text-transform: uppercase; }
.a-t54 { font-size: 54px; font-weight: 500; line-height: 1; }
.a-s > .a-t54 { padding-bottom: 3px; color: var(--c-dark); }
.a-t40 { font-size: 40px; font-weight: 600; line-height: 1.2; }
.a-t32 { font-size: 32px; font-weight: 500; line-height: 1; }
.a-lh1 { line-height: 1; }
.a-lh12 { line-height: 1.2; }
.a-fw500 { font-weight: 500; }
.a-fw600 { font-weight: 600; }
.a-sub { font-size: 24px; font-weight: 600; }
.a-d { font-size: 18px; line-height: 1.45; }

/* ---------- обычный текст (T004) и плашка с линией слева (T157) ---------- */
.a-text { padding: calc(var(--pt, 0) * 1px + 8px) 0 calc(var(--pb, 30) * 1px + 6px); font-size: calc(var(--fs, 18) * 1px); line-height: 1.55; }
.a-note {
    margin: calc(var(--pt, 0) * 1px) 0 calc(var(--pb, 30) * 1px); padding: 4px 0 3px 20px;
    border-left: 2px solid var(--dc, var(--c-orange)); font-size: 18px; line-height: 1.55;
}

/* ---------- картинка (T107) ---------- */
.a-fig { margin: 0; padding: calc(var(--pt, 15) * 1px) 0 calc(var(--pb, 45) * 1px); }
.a-fig img { display: block; width: 100%; height: auto; border-radius: calc(var(--r, 15) * 1px); }
.a-fig figcaption { padding: 28px 0; color: #fff; font-size: 14px; line-height: 2; text-align: center; } /* как в Tilda: белым */

/* ---------- цитата (T257): кавычка, текст, подпись ---------- */
.a-quote {
    position: relative; margin: calc(var(--pt, 0) * 1px) 0 calc(var(--pb, 30) * 1px); padding: 70px 90px 63px;
    border-radius: calc(var(--qr, 0) * 1px); background: var(--qbg, #fff); color: var(--qc, #232323);
}
.a-quote::before { content: '\201C'; position: absolute; left: 47px; top: 36px; color: var(--qi, #c4c4c4); font-size: 114px; line-height: 1; }
.a-quote__text { position: relative; margin-bottom: 24px; font-size: 18px; line-height: 1.55; }
.a-quote__author { position: relative; color: var(--qa, var(--qc, #232323)); font-size: 14px; }

/* ---------- таблица (T431) ---------- */
.a-table { margin: calc(var(--pt, 0) * 1px) 0 calc(var(--pb, 30) * 1px); overflow-x: auto; }
.a-table table { width: 100%; border-collapse: separate; border-spacing: 0; }
.a-table th, .a-table td { box-sizing: content-box; padding: 20px; border-left: 1px solid #000; border-bottom: 1px solid #000; color: #000; text-align: left; vertical-align: top; }
.a-table th:last-child, .a-table td:last-child { border-right: 1px solid #000; }
.a-table thead tr:first-child > *, .a-table table:not(:has(thead)) tbody tr:first-child > * { border-top: 1px solid #000; }
.a-table th { background: #ffd58a; font-size: 18px; font-weight: 500; line-height: 1.55; }
.a-table td { background: var(--c-bg); font-size: 12px; line-height: 1.55; }
/* таблица шире колонки текста (t-col_10 в Tilda: 960 / 780 px) */
.a-table--wide { margin-left: -100px; margin-right: -100px; }
@media (max-width: 1200px) { .a-table--wide { margin-left: -80px; margin-right: -80px; } }
@media (max-width: 960px) { .a-table--wide { margin-left: 0; margin-right: 0; } }
.a-table--center th, .a-table--center td { text-align: center; }
.a-table--center th:first-child, .a-table--center td:first-child { text-align: left; }

/* ---------- аккордеон (T585) ---------- */
.a-acc { margin: calc(var(--pt, 0) * 1px) 0 calc(var(--pb, 0) * 1px); }
.a-acc__item { border-top: 1px solid var(--bc, #656565); }
.a-acc__item:last-child { border-bottom: 1px solid var(--bc, #656565); }
.a-acc__item summary { position: relative; display: block; padding: 20px 50px 20px 0; cursor: pointer; list-style: none; }
.a-acc__item summary::-webkit-details-marker { display: none; }
.a-acc__item summary > span:first-child { display: block; font-size: 24px; font-weight: 600; line-height: 1.35; }
.a-acc__icon { position: absolute; right: 0; top: 50%; width: 40px; height: 40px; margin-top: -20px; border-radius: 50%; transition: background-color .2s, transform .3s; }
.a-acc__icon::before, .a-acc__icon::after { content: ''; position: absolute; left: 9px; top: 19.5px; width: 22px; height: 1px; background: var(--c-dark); }
.a-acc__icon::after { transform: rotate(90deg); }
.a-acc__item summary:hover .a-acc__icon { background: #eee; }
.a-acc__item[open] .a-acc__icon { transform: rotate(45deg); }
.a-acc__body { padding-bottom: 40px; font-size: 18px; line-height: 1.55; }

/* ---------- текст и картинка в две колонки (T195) ---------- */
.a-two { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; padding: calc(var(--pt, 15) * 1px) 0 calc(var(--pb, 45) * 1px); }
.a-two__text { padding-bottom: 6px; font-size: 18px; line-height: 1.55; }
.a-two figure { margin: 0; padding-bottom: 21px; } /* в Tilda под картинкой пустая строка подписи */
.a-two img { display: block; width: 100%; height: auto; margin: 4px 0 10px; border-radius: calc(var(--r, 0) * 1px); }

/* ---------- список с кружками (T510) ---------- */
.a-list { margin: calc(var(--pt, 0) * 1px) 0 calc(var(--pb, 0) * 1px); padding: 0; list-style: none; }
.art .a-list { margin-bottom: calc(var(--pb, 0) * 1px); padding-left: 0; list-style: none; }
.a-list li { display: flex; gap: 10px; margin-top: 20px; font-size: 18px; line-height: 1.35; }
.a-list li:first-child { margin-top: 0; }
.a-list li::before { content: ''; flex: none; width: 20px; height: 20px; border-radius: 50%; background: #124645; }

@media (max-width: 1200px) {
    .a-two { gap: 20px; }
}
@media (max-width: 960px) {
    .a-fig { margin: 0 -10px; }
    .a-quote { padding: 48px 30px 43px 64px; }
    .a-quote::before { left: 20px; top: 14px; }
    .a-table th, .a-table td { padding: 20px 10px; }
    .a-two { grid-template-columns: 1fr; gap: 0; }
    .a-two figure { margin: 20px 0; }
}
@media (max-width: 899px) {
    .a-t54, .a-t40, .a-t32 { font-size: 48px; line-height: 1.23; }
}
@media (max-width: 640px) {
    .a-t54, .a-t40, .a-t32 { font-size: 30px; }
    .a-text, .a-note, .a-quote__text, .a-two__text, .a-acc__body { line-height: 1.45; }
    .a-fig { margin: 0 calc(-1 * var(--gutter)); }
    .a-fig figcaption { padding: 28px var(--gutter); }
    .a-fig--pad { margin: 0; }
    .a-fig--pad figcaption { padding: 28px 0; }
    .a-quote { margin-left: calc(-1 * var(--gutter)); margin-right: calc(-1 * var(--gutter)); padding: 34px 20px 32px 44px; }
    .a-quote::before { left: 17px; top: 17px; font-size: 65px; }
    .a-quote__text { margin-bottom: 14px; }
    .a-table th { font-size: 14px; line-height: 1.45; }
    .a-table td { font-size: 11px; line-height: 1.45; }
    .a-acc__item summary > span:first-child { font-size: 20px; }
    .a-acc__body { padding-bottom: 25px; font-size: 16px; }
    .a-list li { gap: 20px; margin-top: 40px; }
    .a-list li:first-child { margin-top: 0; }
}
@media (max-width: 480px) {
    .a-s { padding: calc(var(--ptm, var(--pt, 15)) * 1px) 0 calc(var(--pbm, var(--pb, 45)) * 1px); }
    .a-s--head { padding-top: calc(var(--ptm, 75) * 1px); }
    .a-text { padding-bottom: calc(var(--pbm, 15) * 1px + 6px); }
    .a-note, .a-quote, .a-table { margin-bottom: calc(var(--pbm, 15) * 1px); }
    .a-fig { padding-bottom: calc(var(--pbm, var(--pb, 45)) * 1px); }
}

/* ---------- «Что ещё почитать»: карточки статей (T853), шире колонки текста ---------- */
.a-more { width: 1160px; margin: 0 auto; padding: calc(var(--pt, 120) * 1px) 0 calc(var(--pb, 45) * 1px); }
.a-more h2 { padding-bottom: 40px; font-size: 40px; font-weight: 600; line-height: 1.23; }
.a-more__list { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; margin: 0; padding: 0; list-style: none; }
.art .a-more__list { padding-left: 0; list-style: none; }
.a-card { position: relative; }
.a-card img { display: block; width: 100%; height: auto; aspect-ratio: 7 / 4; object-fit: cover; margin-bottom: 20px; border-radius: 15px; }
.a-card__title { font-size: 24px; font-weight: 600; line-height: 1.23; }
.art .a-card__title a { color: #232323; }
.a-card__title a::after { content: ''; position: absolute; inset: 0; } /* вся карточка — ссылка, как в Tilda */
.art .a-card__title a:hover { text-decoration: none; }
.a-card__btn { display: inline-block; margin-top: 19px; padding: 12.7px 30px; border-radius: 10px; background: var(--c-dark); color: #fff; font-size: 14px; line-height: 1.4; transition: background-color .2s; }
.a-card:hover .a-card__btn { background: #001c1c; }
@media (max-width: 1200px) { .a-more { width: 920px; } }
@media (max-width: 960px) {
    .a-more { width: auto; }
    .a-more h2 { width: 600px; margin: 0 auto; font-size: 38px; }
    .a-more__list { display: flex; gap: 0; overflow-x: auto; padding: 0 20px; scrollbar-width: none; }
    .a-card { flex: 0 0 304px; padding: 0 20px; }
    .a-card__btn { padding: 12.7px 25px; }
}
@media (max-width: 640px) {
    .a-more h2 { width: auto; margin: 0 var(--gutter); font-size: 30px; line-height: 1.23; }
    .a-more__list { padding: 0; }
    .a-card { flex-basis: 330px; padding: 0 10px 0 20px; }
    .a-card + .a-card { padding: 0 20px 0 10px; }
    .a-card__btn { padding: 15.2px 20px; }
}
@media (max-width: 480px) { .a-more { padding-top: calc(var(--ptm, 90) * 1px); } }
