/* ============================================================
   Айтех24 — блог и «О компании».

   До этого стили блога жили в трёх местах одновременно: инлайновый
   <style> в index.php, такой же в single.php и блок «blog visual
   overhaul» в дополнительных стилях Customizer. Два из них описывали
   разные макеты списка статей — список с картинкой слева и сетку
   карточек, — и перебивали друг друга. На экране получался гибрид:
   рамка карточки со скруглением, но с нулевым внутренним отступом,
   заголовок съезжал на 24px влево относительно даты и текста, первая
   и последняя карточки отличались от остальных.

   Теперь источник один — этот файл. Инлайновые <style> из index.php
   и single.php удалены, блок из Customizer вырезан.
   ============================================================ */

/* ---------- Список статей /blog/ ---------- */

.th-blog-list{
	display:grid;
	grid-template-columns:repeat(auto-fill,minmax(320px,1fr));
	gap:28px;
	padding-top:44px;
}
.th-blog-list__item{
	display:flex;
	flex-direction:column;
	margin:0;
	padding:0 0 24px;
	background:#fff;
	border:1px solid #E4EAF1;
	border-radius:16px;
	overflow:hidden;
	transition:box-shadow .25s ease,transform .25s ease,border-color .25s ease;
}
.th-blog-list__item:hover{
	box-shadow:0 18px 38px rgba(20,30,40,.10);
	transform:translateY(-4px);
	border-color:#CFDCE9;
}
.th-blog-list__cover{display:block;line-height:0;background:#EEF4FA;margin:0 0 16px}
.th-blog-list__cover img{display:block;width:100%;height:auto;aspect-ratio:1200/630;object-fit:cover}
.th-blog-list__body{display:flex;flex-direction:column;flex:1 1 auto;padding:0 24px;min-width:0}
.th-blog-list__title{margin:0 0 8px;font-size:19px;line-height:1.35;font-weight:700}
.th-blog-list__title a{display:block;color:#141922;text-decoration:none}
.th-blog-list__title a:hover{color:#0062A0}

/* Дата была #8a8a8a — 3.45:1, ниже нормы. */
.th-blog-list__meta{margin:0 0 10px;padding:0;font-size:13px;color:#5E6B7C;letter-spacing:.02em}

/* Обрезки у статей разной длины: у одной ручная в строку, у остальных
   автоматическая на пять строк. Клампим до трёх, чтобы карточки
   не разъезжались по высоте. */
.th-blog-list__excerpt{
	margin:0 0 16px;padding:0;font-size:15px;line-height:1.6;color:#3D4450;
	display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;
}
.th-blog-list__excerpt p{margin:0}
.th-blog-list__excerpt:empty{display:none}

/* margin-top:auto прижимает ссылку к низу карточки — у карточек
   с разной длиной заголовка «Читать статью» стоит на одной линии. */
.th-blog-list__more{
	margin:auto 0 0;padding:8px 0;display:inline-block;
	color:#0062A0;font-weight:700;text-decoration:none;min-height:24px;
}
.th-blog-list__more:hover{text-decoration:underline}

@media(max-width:600px){
	.th-blog-list{grid-template-columns:1fr;gap:20px}
}

/* На листинге в баннере нет кнопки — убираем повисший пустой низ. */
.th-h1-breadcrumbs_compact{min-height:0;padding-bottom:34px}
.th-h1-breadcrumbs_compact .th-h1-breadcrumbs-desc__txt{margin-bottom:0}

/* ---------- Страница статьи ---------- */

/* Колонка была 760px при 17px — около 88 знаков в строке. Для
   кириллицы читаемый предел 60–75, дальше глаз теряет начало
   следующей строки. 68ch при 18px даёт примерно 650px. */
.th-single-content{
	max-width:68ch;
	margin:0 auto;
	font-size:18px;
	line-height:1.7;
	color:#3D4450;
}
@media(max-width:640px){
	.th-single-content{font-size:17px;line-height:1.65}
}
.th-single-content h2{font-size:clamp(23px,3vw,30px);line-height:1.25;margin:48px 0 16px;color:#141922;font-weight:800;letter-spacing:-.02em}
.th-single-content h2:first-child{margin-top:0}
.th-single-content h3{font-size:21px;margin:34px 0 12px;color:#141922;font-weight:700}
.th-single-content p{margin:0 0 20px}
.th-single-content ul,.th-single-content ol{margin:0 0 20px;padding-left:22px}
.th-single-content li{margin-bottom:8px}
.th-single-content li::marker{color:#009BE8}
.th-single-content a{color:#0062A0}

/* Обложку сужаем до ширины текстовой колонки с запасом — раньше она
   была 900px над колонкой 760px и жила отдельной жизнью. */
.th-single-cover{max-width:760px;margin:8px auto 40px}
.th-single-cover__img{width:100%;height:auto;display:block;border-radius:16px;box-shadow:0 18px 38px rgba(20,30,40,.12)}
.th-single-content img{max-width:100%;height:auto;border-radius:12px;box-shadow:0 14px 30px rgba(20,30,40,.10);margin:28px 0;display:block}

/* Правил для таблиц, цитат и кода в теме не было вообще: как только
   редактор вставит таблицу, она отрисуется без единой линейки. */
.th-single-content table{width:100%;border-collapse:collapse;font-size:15.5px;margin:28px 0;border:1px solid #E4EAF1;border-radius:10px;overflow:hidden}
.th-single-content th,.th-single-content td{padding:10px 14px;border-bottom:1px solid #E4EAF1;text-align:left}
.th-single-content th{background:#F4F8FC;color:#141922;font-weight:700;font-size:14px}
.th-single-content tr:last-child td{border-bottom:0}
.th-single-content blockquote{margin:28px 0;padding:18px 22px;border-left:3px solid #009BE8;background:#F4F8FC;border-radius:0 10px 10px 0;font-size:17px;color:#3D4450}
.th-single-content blockquote p:last-child{margin:0}
.th-single-content code{background:#F1F5F9;border:1px solid #E4EAF1;border-radius:5px;padding:1px 6px;font-size:.92em}

/* Заголовок статьи длиннее заголовка услуги: при line-height:1
   выносные элементы соседних строк почти касались. */
.single .th-h1-breadcrumbs-desc__title h1{font-size:clamp(28px,3.4vw,40px);line-height:1.18}
.single .th-h1-breadcrumbs-desc{max-width:900px}

/* В шапке статьи выводился маркетинговый тизер «Занимайтесь вашим
   бизнесом…» и кнопка «Получить консультацию» — блок со страниц
   услуг, к статье отношения не имеет. Баннер при этом занимал
   500px, и текст начинался далеко внизу. */
.single .th-h1-breadcrumbs{min-height:0;padding-top:56px;padding-bottom:40px}
.single .th-h1-breadcrumbs-desc__txt,
.single .th-h1-breadcrumbs-desc .th-btn{display:none}

/* Дата и время чтения под заголовком. */
.th-single-meta{max-width:900px;margin:14px auto 0;font-size:14px;color:#C6D2E0}
.th-single-meta time{color:#fff;font-weight:600}

/* Блок «Читайте также» и призыв в конце статьи. */
.th-single-after{max-width:760px;margin:56px auto 0}
.th-single-cta{background:linear-gradient(#F4F8FC,#fff);border:1px solid #E4EAF1;border-radius:16px;padding:28px}
.th-single-cta h2{margin:0 0 8px;font-size:22px;color:#141922;font-weight:800;letter-spacing:-.02em}
.th-single-cta p{margin:0 0 18px;color:#3D4450}
.th-single-cta__btn{display:inline-block;background:#009BE8;color:#fff;text-decoration:none;font-weight:700;font-size:14.5px;padding:12px 22px;border-radius:10px;transition:background .15s ease}
.th-single-cta__btn:hover{background:#0079B5;color:#fff}
.th-single-rel-title{margin:44px 0 16px;font-size:22px;color:#141922;font-weight:800;letter-spacing:-.02em}
.th-single-rel{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}
.th-single-rel__item{border:1px solid #E4EAF1;border-radius:12px;padding:16px 18px;transition:border-color .15s ease,box-shadow .15s ease}
.th-single-rel__item:hover{border-color:#CFDCE9;box-shadow:0 10px 24px rgba(20,30,40,.08)}
.th-single-rel__item a{color:#141922;text-decoration:none;font-weight:700;font-size:16px;line-height:1.35;display:block}
.th-single-rel__item a:hover{color:#0062A0}
.th-single-rel__date{margin-top:8px;font-size:13px;color:#5E6B7C}

/* ---------- «О компании» ---------- */

/* Блок «Команда» рендерится всегда, даже когда поля пустые: выводились
   пустые h2 и два пустых p, а .section-padding давал 145px сверху
   и снизу — почти 300px пустоты посреди страницы. Прячем, пока блок
   не заполнен. Заодно пустой заголовок — нарушение доступности. */
.team-section:not(:has(.team-content-wrap)){display:none}

/* Цифра «12+ лет» шла #009BE8 на #FAFAFA — 2.94:1, ниже нормы даже
   для крупного текста. */
.skill-section .experience .number{color:#0079B5}

/* ---------- Общее для всех страниц ---------- */

/* Тема гасит обводку фокуса (a:focus{outline:0}), а возвращал её
   только service-v2.css, который грузится лишь на страницах услуг.
   На блоге, статьях и «О компании» при работе с клавиатуры не было
   видно вообще ничего. */
.iteh-chrome a:focus-visible,
.iteh-chrome button:focus-visible,
.iteh-chrome input:focus-visible,
.iteh-chrome textarea:focus-visible,
.iteh-chrome select:focus-visible,
.iteh-chrome summary:focus-visible,
.iteh-chrome [tabindex]:focus-visible{outline:3px solid #0142A8;outline-offset:2px;border-radius:4px}
.iteh-chrome .footer-section a:focus-visible,
.iteh-chrome .v2-topbar a:focus-visible{outline:3px solid #54D6EB;outline-offset:2px}

/* Текущий пункт хлебных крошек был #919191 на #F7F7F7 — 2.94:1. */
.breadcrumbs-list li span{color:#5A6472}
.breadcrumbs-list li a{display:inline-block;padding:4px 0}

/* Между последней строкой текста и тёмным подвалом оставалось
   20 пикселей белого — контент обрывался в темноту. На страницах
   услуг воздух даёт .v2-section, здесь его не было. */
.iteh-chrome .th-page-main{padding-bottom:96px}
@media(max-width:768px){.iteh-chrome .th-page-main{padding-bottom:56px}}
.iteh-chrome .th-page-main:has(.th-section-cta-map){padding-bottom:0}

/* Строка с датой и временем чтения. Стоит первой внутри текстовой
   колонки, на белом фоне — поэтому цвета тёмные, а не как в баннере. */
.th-single-content .th-single-date{
	margin:0 0 28px;padding-bottom:16px;
	border-bottom:1px solid #E4EAF1;
	font-size:14px;color:#5E6B7C;
}
.th-single-content .th-single-date time{color:#141922;font-weight:600}

/* Текстовая колонка «О компании». Раньше ширина и отступы стояли
   инлайном в шаблоне; заодно баннер держал min-height:300px инлайном,
   из-за чего на телефоне под одну строку заголовка уходило 300px. */
.th-about-content{max-width:900px;margin:0 auto;padding:64px 20px 8px}
.th-about-content h2{font-size:clamp(23px,3vw,30px);line-height:1.25;margin:44px 0 16px;color:#141922;font-weight:800;letter-spacing:-.02em}
.th-about-content h2:first-child{margin-top:0}
.th-about-content h3{font-size:20px;margin:30px 0 10px;color:#141922;font-weight:700}
.th-about-content p{margin:0 0 18px;font-size:17px;line-height:1.7;color:#3D4450}
.th-about-content ul{margin:0 0 20px;padding-left:22px}
.th-about-content li{margin-bottom:8px;font-size:17px;line-height:1.6;color:#3D4450}
.th-about-content li::marker{color:#009BE8}
.th-about-content a{color:#0062A0}
@media(max-width:768px){.th-about-content{padding:40px 20px 8px}.th-about-content p,.th-about-content li{font-size:16px}}

.th-h1-breadcrumbs_about{min-height:300px}
@media(max-width:768px){.th-h1-breadcrumbs_about{min-height:140px}}

/* Кегль в блоге и на «О компании» — на ступень вслед за общим. */
.th-blog-list__title{font-size:20px}
.th-blog-list__excerpt{font-size:16px}
.th-blog-list__more{font-size:16px}
.th-blog-list__meta{font-size:14px}
.th-single-content{font-size:19px;line-height:1.7}
@media(max-width:640px){.th-single-content{font-size:17.5px;line-height:1.65}}
.th-about-content p,.th-about-content li{font-size:18px}
@media(max-width:768px){.th-about-content p,.th-about-content li{font-size:17px}}
