.matrix-body {
    background-color: black;
    color: white;
}

.container {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
    flex-direction: column;
    max-width: 100vw; 
    padding: 20px;
}

h1 {
    font-size: 3em;
    color: white;
}

.button-container {
    display: flex;            /* Используем Flexbox */
    justify-content: center;  /* Горизонтальное выравнивание по центру */
    gap: 8px;               /* Пространство между кнопками */
    margin-top: 50px;         /* Отступ сверху */
}

.capsule {
    padding: 20px 40px;                   /* Расстояние вокруг текста */
    font-size: 2.5em;                     /* Размер шрифта */
    border-radius: 50%;                   /* Круглая форма */
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);   /* Тень */
    transition: transform 0.3s ease-in-out;       /* Эффект перехода */
    cursor: pointer;                      /* Меняется курсор мыши */
    text-decoration: none;                /* Без подчёркиваний */
    min-width: 250px;                     /* Минимальная ширина */
    max-width: 250px;                     /* Максимальная ширина */
    height: 120px;                        /* Фиксированная высота */
    display: flex;                        /* Используем Flexbox */
    align-items: center;                  /* Центрирование текста по вертикали */
    justify-content: center;              /* Центрирование текста по горизонтали */
    color: white;                         /* Белый цвет текста */
    text-align: center;                   /* Центрирование текста горизонтально */
    line-height: normal;                  /* Авто-выравнивание текста */
}

.red-capsule {
    background-color: darkred;
    border: 2px solid crimson;
}

.blue-capsule {
    background-color: navy;
    border: 2px solid royalblue;
}

.capsule::before { /* Эффект внутренней тени */
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: -1;
    background-image: radial-gradient(circle at center, transparent 60%, rgba(0, 0, 0, 0.5));
}

.capsule:hover {
    transform: scale(1.1); /* Увеличение размера при наведении */
}