body {
    background-color: black;
    margin: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
    font-family: "Times New Roman", Times, serif;
    overflow: hidden;
}

.container {
    text-align: center;
    /* Это важно для 3D эффекта */
    perspective: 1000px; 
}

.main-title {
    color: white;
    font-size: 32px;
    letter-spacing: 12px;
    text-transform: uppercase;
    margin-bottom: 40px;
}

/* Стилизуем ссылки внутри .menu под белые кнопки */
.menu a {
    display: block;
    margin: 15px auto; 
    
    /* Уменьшили высоту: теперь кнопка не такая "толстая" */
    padding: 20px 0;    
    
    /* Уменьшили ширину: теперь она не на весь экран */
    width: 450px;       
    
    background: white;
    color: black;
    text-decoration: none;
    font-family: "Times New Roman", Times, serif;
    font-weight: bold;
    font-size: 24px; 
    border-radius: 12px;
    transition: 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    
    /* Оставляем наклон, но с мягкой перспективой */
    transform: perspective(1000px) rotateX(45deg);
    line-height: 1;
}

.menu a:hover {
    transform: perspective(1000px) rotateX(0deg) scale(1.05);
    color: #ff0000;
    box-shadow: 0 0 25px rgba(255, 0, 0, 0.5);
}


.back-link {
    display: block;
    text-align: center;
    color: #444; 
    text-decoration: none;
    margin-top: 80px;
    margin-bottom: 80px;
    font-size: 0.9rem;
    font-family: "Times New Roman", Times, serif;
    letter-spacing: 2px;
    text-transform: uppercase;
    transition: all 0.4s ease;
    position: relative; /* Нужно для позиционирования крови */
    width: fit-content; /* Чтобы кровь текла ровно под текстом */
    margin-left: auto;
    margin-right: auto;
}

/* Эффект при наведении на саму надпись */
.back-link:hover {
    color: #ff0000;
    text-shadow: 0 0 15px #ff0000;
    letter-spacing: 5px;
    transform: scale(1.1);
}

/* Создаем струю крови */
.back-link::after {
    content: '';
    position: absolute;
    left: 50%; /* Струя по центру */
    transform: translateX(-50%);
    top: 100%; /* Начинается сразу под текстом */
    
    width: 3px; /* Узкая струйка */
    background: linear-gradient(to bottom, #ff0000, #4a0000, transparent);
    height: 0; /* Изначально скрыта */
    opacity: 0;
    
    /* Плавный возврат, когда мышку убрали */
    transition: height 0.6s ease-in, opacity 0.4s ease;
    pointer-events: none;
}

/* Анимация "стекания" при наведении */
.back-link:hover::after {
    height: 300px; /* Длина струи крови вниз */
    opacity: 0.8;
    /* Скорость вытекания */
    transition: height 1.5s ease-out, opacity 0.3s ease;
}