/* 1. Подготовка заголовка H2 */
body > div.site-grid > div.grid-child.container-component > main > div > div.com-content-article__body > h2:nth-child(n) {
    position: relative; /* Сохраняем для позиционирования полоски */
    font-size: 1.45rem;
    font-weight: 700;
    line-height: 1.2;
    color: #1a202c;
}

/* 2. Стиль для первой буквы (красный цвет) */
body > div.site-grid > div.grid-child.container-component > main > div > div.com-content-article__body > h2:nth-child(n)::first-letter {
    color: red; /* Красим первую букву в красный */
    font-weight: bold; /* Можно сделать её ещё жирнее */
}

/* 3. Полоска под текстом */
body > div.site-grid > div.grid-child.container-component > main > div > div.com-content-article__body > h2:nth-child(n)::after {
    content: '';
    display: block;
    width: 100%;
    height: 3px;
    background-color: #38b2ac;
    border-radius: 2px;
    margin-top: 0.5rem;
}

/* 1. Подготовка заголовка H3 */
body > div.site-grid > div.grid-child.container-component > main > div > div.com-content-article__body > h3:nth-child(n) {
    position: relative; /* Сохраняем для позиционирования полоски */
    font-size: 1.3rem; /* Чуть меньше, чем у H2, для иерархии */
    font-weight: 600;
    color: #2a2a2a; /* Темно-серый цвет текста */
    /* padding-left убран, так как иконки нет */
}

/* 2. Стиль для первой буквы (красный цвет) */
body > div.site-grid > div.grid-child.container-component > main > div > div.com-content-article__body > h3:nth-child(n)::first-letter {
    color: red; /* Красим первую букву в красный */
    font-weight: bold; /* Делаем её жирной */
}

/* 3. Полоска под текстом */
body > div.site-grid > div.grid-child.container-component > main > div > div.com-content-article__body > h3:nth-child(n)::after {
    content: '';
    display: block;
    width: 20%; /* Линия пошире, чем у H2, чтобы смотрелось сбалансировано */
    height: 3px;
    background-color: #6366f1; /* Индиго - хороший акцентный цвет */
    border-radius: 2px;
    margin-top: 0.4rem; /* Небольшой отступ от текста */
}

body > div.site-grid > div.grid-child.container-component > main > div > div.page-header > h1{
 font-size: 25px;
  padding: 0 0 6px 10px;
  border-bottom: 2px solid #6f9af2;
color: #494c8a;
text-decoration: none;
}

body > div.site-grid > div.grid-child.container-component > main > div > div.page-header > h1::before {
   content: "\f0ae";
    font-family: "Font Awesome 5 Free";
    font-weight: 600;
    margin-right: 0.5rem;
color: #FF0033;
}




body > div.site-grid > div.grid-child.container-component > div.main-top.card.image-left > div > ul > li > h5 > a {
  color: darkgreen;
   font-size: 27px;
color: #224FAA;
}




body > div.site-grid > div.grid-child.container-sidebar-right > div:nth-child(n) > div > ul > li:nth-child(n) > a::before { 
    content: "\f0da";
    font-family: "Font Awesome 5 Free";
    font-weight: 600;
    margin-right: 0.5rem;
color: #FF0033;
}


body > div.site-grid > div.grid-child.container-bottom-a > div > div > ul > li:nth-child(n) > a::before { 
    content: "\f0da";
    font-family: "Font Awesome 5 Free";
    font-weight: 600;
    margin-right: 0.5rem;
}


body > div.site-grid > div.grid-child.container-sidebar-right > div:nth-child(n) > h5::before { 
    content: "\f03c";
    font-family: "Font Awesome 5 Free";
    font-weight: 600;
    margin-right: 0.5rem;
color: #FF0033;
}

body > div.site-grid > div.grid-child.container-sidebar-right > div:nth-child(1) > div > ul > li:nth-child(n) {
    list-style: of-icon;
    position: relative;
    overflow: hidden;
    transition: all 0.5s ease-in;
    padding: 3px 0;
}
body > div.site-grid > div.grid-child.container-bottom-a > div > h5::before { 
    content: "\f03c";
    font-family: "Font Awesome 5 Free";
    font-weight: 600;
    margin-right: 0.5rem;
}

body > div.site-grid > div.grid-child.container-component > div.main-top.card.image-left > div > ul > li > h5 > a::before { 
    content: "\f00a";
    font-family: "Font Awesome 5 Free";
    font-weight: 600;
    margin-right: 0.5rem;
    color: #FF0033;
}

body > div.site-grid > div.grid-child.container-bottom-a > div.bottom-a.card.image-left > div > ul > li > h5 > a::before { 
    content: "\f141";
    font-family: "Font Awesome 5 Free";
    font-weight: 600;
    margin-right: 0.5rem;
    color: #FF0033;
}

body > div.site-grid > div.grid-child.container-bottom-a > div:nth-child(n) > div > ul > li > h5 > a::before { 
    content: "\f141";
    font-family: "Font Awesome 5 Free";
    font-weight: 600;
    margin-right: 0.5rem;
    color: #FF0033;
}

/* 1. Подготовка заголовка (ОБЯЗАТЕЛЬНО) */
body > div.site-grid > div.grid-child.container-component > main > div > div.com-content-article__body > h4:nth-child(n) {
    position: relative; /* Создаем точку отсчета для псевдоэлемента */
    font-weight: 700;
    font-size: 1.1rem; /* ~24px */
    display: inline-block; /* Важно! Чтобы ширина считалась по тексту, а не по всей строке */
}

/* 4. НОВОЕ: Стилизация ПЕРВОЙ буквы в красный цвет */
body > div.site-grid > div.grid-child.container-component > main > div > div.com-content-article__body > h4:nth-child(n)::first-letter {
    color: red;
    font-weight: bold;
}

/* 2. Стиль для полоски под текстом (остается как было) */
body > div.site-grid > div.grid-child.container-component > main > div > div.com-content-article__body > h4:nth-child(n)::after {
    content: '';
    display: block;
    width: 20%;
    height: 3px;
    background-color: #4299e1;
    border-radius: 2px;
}


/* 1. Базовая настройка и позиционирование */
body > div.site-grid > div.grid-child.container-component > main > div > div.com-content-category-blog__items.blog-items.image-left > div:nth-child(n) > div > div.page-header > h2 {
    position: relative;
    font-size: 1.5rem;
    font-weight: 700;
    color: #393c71;
    padding-bottom: 0.5rem; /* Отступ для нашей линии */
}

/* 2. Стиль для ссылки внутри заголовка (Убираем стандартное подчёркивание) */
body > div.site-grid > div.grid-child.container-component > main > div > div.com-content-category-blog__items.blog-items.image-left > div:nth-child(n) > div > div.page-header > h2 a {
    color: inherit; /* Наследуем цвет текста, чтобы ссылка не была синей */
    text-decoration: none; /* ЭТО ГЛАВНОЕ ПРАВИЛО - убираем подчёркивание */
    transition: color 0.3s ease; /* Плавное изменение цвета при наведении */
}

/* 3. Красивая линия под текстом (наша декоративная линия) */
body > div.site-grid > div.grid-child.container-component > main > div > div.com-content-category-blog__items.blog-items.image-left > div:nth-child(n) > div > div.page-header > h2::after {
    content: '';
    display: block;
    width: 60px;
    height: 3px;
    background-color: #3b82f6;
    border-radius: 2px;
    margin-top: 0.4rem;
}

/* 4. Стиль для первой буквы (красный акцент) */
body > div.site-grid > div.grid-child.container-component > main > div > div.com-content-category-blog__items.blog-items.image-left > div:nth-child(n) > div > div.page-header > h2::first-letter {
    color: #ef4444;
    font-weight: bold;
}

/* БОНУС: Эффект при наведении на ссылку */
body > div.site-grid > div.grid-child.container-component > main > div > div.com-content-category-blog__items.blog-items.image-left > div:nth-child(n) > div > div.page-header > h2 a:hover {
    color: #3b82f6; /* Меняем цвет текста на синий при наведении */
}


/* 1. Базовая настройка и позиционирование - главная страница*/
body > div.site-grid > div.grid-child.container-component > main > div > div.blog-items.image-left > div:nth-child(n) > div.item-content > h2 {
    position: relative;
    font-size: 1.55rem;
    font-weight: 700;
    color: #111827;
    margin: 2rem 0 1.5rem 0;
    padding-bottom: 0.5rem; /* Отступ для нашей линии */
}

/* 2. Стиль для ссылки внутри заголовка (Убираем стандартное подчёркивание) */
body > div.site-grid > div.grid-child.container-component > main > div > div.blog-items.image-left > div:nth-child(n) > div.item-content > h2 a {
    color: #3a3c71; /* Наследуем цвет текста */
    text-decoration: none; /* Убираем подчёркивание ссылки */
    transition: color 0.3s ease; /* Плавный переход для цвета */
}

/* 3. Красивая линия под текстом (наша декоративная линия) */
body > div.site-grid > div.grid-child.container-component > main > div > div.blog-items.image-left > div:nth-child(n) > div.item-content > h2::after {
    content: '';
    display: block;
    width: 60px;
    height: 3px;
    background-color: #3b82f6;
    border-radius: 2px;
    margin-top: 0.4rem;
}

/* 4. Стиль для первой буквы (красный акцент) */
body > div.site-grid > div.grid-child.container-component > main > div > div.blog-items.image-left > div:nth-child(n) > div.item-content > h2::first-letter {
    color: #ef4444;
    font-weight: bold;
}

/* БОНУС: Эффект при наведении на ссылку */
body > div.site-grid > div.grid-child.container-component > main > div > div.blog-items.image-left > div:nth-child(n) > div.item-content > h2 a:hover {
    color: #3b82f6; /* Меняем цвет текста на синий при наведении */
}

/* 1. Базовая настройка: Моноширинный шрифт и цвет */
body > div.site-grid > div.grid-child.container-component > div.main-top.card.image-left > div > ul > li:nth-child(n) > h1 {
    font-size: 1.75rem;
    font-weight: 700; /* Не жирный, а технический */
    margin: 0 0 1.2rem 0;
    padding-bottom: 0.4rem;
    letter-spacing: 1px; /* Растягиваем буквы для эффекта */
    line-height: 1.2;
    position: relative;
}

/* 2. Декоративная линия: Цифровой глитч */
body > div.site-grid > div.grid-child.container-component > div.main-top.card.image-left > div > ul > li:nth-child(n) > h1::after {
    content: '';
    display: block;
    width: 150px;
    height: 3px;
    background-color: #ff0033;
    margin-top: 0.6rem;
    
    /* Анимация мерцания */
    animation: glitch 2s infinite;
}

/* 3. Стиль для первой буквы (цифровой акцент) */
body > div.site-grid > div.grid-child.container-component > div.main-top.card.image-left > div > ul > li:nth-child(n) > h1::first-letter {
    color: #FF4655; /* Ярко-красный/розовый для акцента */
}

/* 4. Анимация мерцания (эффект помех) */
@keyframes glitch {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.3; }
}