/* Базовый сброс отступов и полей */
* {
 margin: 0;
 padding: 0;
 box-sizing: border-box;
}

/* Основные настройки для тела документа */
body {
 font-family: Arial, sans-serif;
 color: #ffffff; /* белый основной текст */
 background-color: #121212; /* тёмный фон для контраста */
 line-height: 1.6;
 padding: 20px;
}

/* Стили заголовков */
h1 {
 color: #ff9999; /* нежно-красный */
 font-size: 2.5rem;
 margin-bottom: 1rem;
}

h2 {
 color: #ffcc99; /* нежно-оранжевый */
 font-size: 2rem;
 margin-bottom: 0.8rem;
}

h3 {
 color: #ffff99; /* нежно-жёлтый */
 font-size: 1.5rem;
 margin-bottom: 0.6rem;
}

/* Стили ссылок */
a {
 color: #ff4d4d; /* красный */
 text-decoration: none;
 transition: color 0.3s ease;
}

a:hover {
 color: #ffff66; /* жёлтый при наведении */
}

/* Контейнер для основного контента */
.container {
 max-width: 1200px; /* максимальная ширина контента */
 margin: 0 auto; /* центрирование по горизонтали */
 padding: 0 15px; /* отступы по бокам */
}

/* Адаптивность: уменьшение отступов на маленьких экранах */
@media (max-width: 768px) {
 .container {
 padding: 0 10px;
 }
 
 h1 {
 font-size: 2rem;
 }
 
 h2 {
 font-size: 1.75rem;
 }
 
 h3 {
 font-size: 1.25rem;
 }
}

@media (max-width: 480px) {
 .container {
 padding: 0 5px;
 }
 
 h1 {
 font-size: 1.75rem;
 }
 
 h2 {
 font-size: 1.5rem;
 }
 
 h3 {
 font-size: 1.1rem;
 }
}

.content {
 overflow-x: auto; /* горизонтальная прокрутка при выходе за границы */
 /* или */
 overflow: hidden; /* обрезка лишнего текста */
}
img {
 display: block;
 margin-left: auto;
 margin-right: auto;
 max-width: 100%; /* чтобы не вылезало за контейнер */
}
/* Предотвращение растяжения контента */
p, div, span {
 word-wrap: break-word; /* перенос слов при необходимости */
 overflow-wrap: break-word;
}

.content-container {
 max-width: 100%; /* не шире родителя */
 word-wrap: break-word; /* перенос длинных слов */
 overflow-wrap: break-word; /* альтернативный вариант */
 white-space: normal; /* разрешаем переносы */
}

@media (max-width: 768px) {
 .content-container {
 font-size: 14px;
 line-height: 1.5;
 padding: 10px;
 }
}

.parent-container {
 display: flex;
 flex-wrap: wrap;
}

.content-container {
 flex: 1 0 300px; /* минимум 300px, может расти */
 min-width: 0; /* предотвращает переполнение */
}

.content-container {
 max-width: 100%; /* не шире родителя */
 word-wrap: break-word; /* перенос длинных слов */
 overflow-wrap: break-word; /* альтернативный вариант */
 white-space: normal; /* разрешаем переносы */
}

table {
 table-layout: fixed;
 width: 100%;
}
td {
 word-wrap: break-word;
}