/*
 * Информационный раздел: статьи, хаб статей, календарь перевозок.
 *
 * Палитра и приёмы взяты из существующих экранов темы — герой заявки
 * (tender.css) и сделки (deal.css): карточка на белом с рамкой #d5e8ff и
 * радиусом 16, ярлык капслоком 11px/700, оранжевый акцент #ff4d12,
 * приглушённый синий текст #7088a2, заголовок 35px/1.17 цветом #102f51.
 *
 * Колонка текста — 840px, ровно как max-width заголовка в герое заявки.
 * Таблицы и карточки выходят на всю ширину контейнера.
 */

.s24-art,
.s24-hub,
.s24-kal { color: #234; font-size: 15px; line-height: 1.62; }

/* ——— общий герой раздела ——— */
.s24-hero { margin: 6px 0 30px; }
.s24-hero__eyebrow {
	display: inline-flex; align-items: center; gap: 7px;
	margin: 0 0 14px; padding: 7px 13px; border-radius: 30px;
	background: #fff0eb; color: #fa4a10;
	font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em;
	text-decoration: none;
}
.s24-hero__eyebrow:hover { background: #ffe4da; color: #fa4a10; }
.s24-hero h1 { max-width: 840px; margin: 0 0 18px; font-size: 35px; line-height: 1.17; color: #102f51; }
.s24-hero__lead { max-width: 840px; margin: 0; color: #53718f; font-size: 18px; line-height: 1.55; }
.s24-hero__meta { display: flex; flex-wrap: wrap; gap: 8px 20px; margin: 18px 0 0; color: #7088a2; font-size: 13px; }
.s24-hero__meta b { color: #102f51; font-weight: 700; }

/* ——— тело статьи ——— */
.s24-art__body { max-width: 840px; }
.s24-art__body h2 { margin: 38px 0 14px; font-size: 26px; line-height: 1.22; color: #102f51; }
.s24-art__body h3 { margin: 28px 0 10px; font-size: 20px; line-height: 1.3; color: #102f51; }
.s24-art__body p { margin: 0 0 15px; }
.s24-art__body ul, .s24-art__body ol { margin: 0 0 18px; padding-left: 22px; }
.s24-art__body li { margin-bottom: 8px; }
.s24-art__body a { color: #fa4a10; }

/* Таблицы шире колонки текста: данные важнее ровного края. */
.s24-scroll {
	margin: 26px 0; border: 1px solid #d5e8ff; border-radius: 16px;
	overflow-x: auto; -webkit-overflow-scrolling: touch; background: #fff;
}
.s24-scroll table { width: 100%; min-width: 540px; margin: 0; border-collapse: collapse; font-size: 15px; }
.s24-scroll th, .s24-scroll td { padding: 15px 20px; text-align: left; border-bottom: 1px solid #e8f1fb; }
.s24-scroll tr:last-child td { border-bottom: 0; }
.s24-scroll th {
	background: #f4f8fd; color: #53718f; white-space: nowrap;
	font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em;
}
.s24-scroll td { color: #102f51; }
.s24-scroll td:first-child { font-weight: 600; }
.s24-scroll td:nth-child(n+2), .s24-scroll th:nth-child(n+2) { font-variant-numeric: tabular-nums; white-space: nowrap; }
.s24-scroll tbody tr:hover td { background: #f9fbfe; }

/* ——— врезки ——— */
.s24-note {
	margin: 26px 0; padding: 18px 22px; border-radius: 16px;
	background: #fff6f2; border: 1px solid #ffd9cb; color: #6b3a26; font-size: 15px;
}
.s24-note p:last-child { margin-bottom: 0; }
.s24-key { margin: 26px 0; padding: 22px 24px; border-radius: 16px; background: #f4f8fd; border: 1px solid #d5e8ff; }
.s24-key__label { margin: 0 0 8px; color: #728ba7; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; }
.s24-key p { margin: 0; color: #102f51; }

/* ——— карточки ——— */
.s24-cards { display: grid; gap: 16px; margin: 26px 0; }
@media (min-width: 760px) { .s24-cards { grid-template-columns: 1fr 1fr; } }
.s24-card { padding: 20px 22px; background: #fff; border: 1px solid #d5e8ff; border-radius: 16px; }
.s24-card b { display: block; margin-bottom: 6px; color: #102f51; font-size: 16px; }
.s24-card span { display: block; color: #53718f; font-size: 14px; line-height: 1.55; }

/* ——— вопросы ——— */
.s24-faq { max-width: 840px; margin: 42px 0 0; }
.s24-faq h2 { margin: 0 0 12px; font-size: 26px; color: #102f51; }
.s24-faq details { border: 1px solid #d5e8ff; border-radius: 16px; background: #fff; margin-bottom: 10px; }
.s24-faq summary {
	position: relative; padding: 17px 52px 17px 22px; cursor: pointer; list-style: none;
	color: #102f51; font-size: 16px; font-weight: 700;
}
.s24-faq summary::-webkit-details-marker { display: none; }
.s24-faq summary::after {
	content: ""; position: absolute; right: 22px; top: 50%;
	width: 11px; height: 11px; margin-top: -6px;
	border-right: 2px solid #fa4a10; border-bottom: 2px solid #fa4a10;
	transform: rotate(45deg); transition: transform .18s;
}
.s24-faq details[open] summary::after { transform: rotate(-135deg); margin-top: -2px; }
.s24-faq details p { margin: 0; padding: 0 22px 20px; color: #53718f; font-size: 15px; }

/* ——— перелинковка ——— */
.s24-more { max-width: 840px; margin: 42px 0 0; padding-top: 26px; border-top: 1px solid #d5e8ff; }
.s24-more__label { margin: 0 0 14px; color: #728ba7; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; }
.s24-more__list { display: flex; flex-wrap: wrap; gap: 10px; }
.s24-more__list a {
	padding: 10px 18px; border: 1px solid #d5e8ff; border-radius: 30px; background: #fff;
	color: #102f51; font-size: 14px; text-decoration: none; transition: .16s;
}
.s24-more__list a:hover { border-color: #ffb59c; background: #fff6f2; color: #fa4a10; }

/* ——— хаб статей ——— */
.s24-hub__grid { display: grid; gap: 18px; margin: 34px 0 0; }
@media (min-width: 700px) { .s24-hub__grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1100px) { .s24-hub__grid { grid-template-columns: repeat(3, 1fr); } }
.s24-hub__card {
	display: flex; flex-direction: column; gap: 10px; padding: 24px 26px;
	background: #fff; border: 1px solid #d5e8ff; border-radius: 16px;
	text-decoration: none; transition: .16s;
}
.s24-hub__card:hover { border-color: #ffb59c; box-shadow: 0 10px 26px -18px rgba(16, 47, 81, .5); }
.s24-hub__tag { color: #728ba7; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; }
.s24-hub__card h2 { margin: 0; font-size: 19px; line-height: 1.3; color: #102f51; }
.s24-hub__card p { margin: 0; color: #53718f; font-size: 14px; line-height: 1.55; }
.s24-hub__card span { margin-top: auto; padding-top: 6px; color: #fa4a10; font-size: 14px; font-weight: 700; }

/* ——— календарь ——— */
.s24-kal__months { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 26px; }
.s24-kal__months a, .s24-kal__months span {
	padding: 9px 16px; border: 1px solid #d5e8ff; border-radius: 30px; background: #fff;
	color: #53718f; font-size: 14px; font-weight: 600; text-decoration: none;
}
.s24-kal__months .is-current { background: #102f51; border-color: #102f51; color: #fff; }
.s24-kal__demo {
	margin: 0 0 26px; padding: 16px 20px; border-radius: 16px;
	background: #fff6f2; border: 1px solid #ffd9cb; color: #6b3a26; font-size: 14px;
}
.s24-kal__demo b { color: #c8410f; }
.s24-kal__price { color: #102f51; font-weight: 700; }
.s24-kal__nodata { color: #93a7bc; }
.s24-kal__trips { color: #7088a2; font-size: 13px; }

@media (max-width: 780px) {
	.s24-hero h1 { font-size: 27px; }
	.s24-hero__lead { font-size: 16px; }
	.s24-art__body h2, .s24-faq h2 { font-size: 22px; }
	.s24-art__body h3 { font-size: 18px; }
	.s24-scroll table { min-width: 460px; }
	.s24-scroll th, .s24-scroll td { padding: 13px 15px; }
	.s24-card, .s24-key, .s24-note { padding: 17px 18px; }
	.s24-hub__card { padding: 20px; }
}