body {
    margin: 0;
    font-family: 'Montserrat', sans-serif;
    background-image: url('/assets/bg.jpg');
    background-size: cover;
    background-position: center bottom 40%;
    background-repeat: no-repeat;
    height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    color: white;
    position: relative; /* чтобы corner-logo мог позиционироваться относительно body */
}

.logo img {
    margin-top: 50px;
    height: 100px;
    max-width: 100%;
    
    /* Добавляем рамку */
    border-radius: 60px; /* слегка скруглённые углы */
    padding: 5px; /* отступ, чтобы рамка не прилегала к изображению */
    background-color: rgba(255, 255, 255, 0.3); /* лёгкая подложка для контраста */
    }



.main-content {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-grow: 1;
    width: 100%;
    margin-top: 100px;
}

.catalog-button {
    padding: 15px 30px;
    font-size: 18px;
    font-weight: bold;
    color: white;
    text-decoration: none;
    cursor: pointer;
    transition: background-color 0.3s, transform 0.3s, box-shadow 0.3s, border 0.3s;
    background-color: #004b23;
    border-radius: 25px;
    display: inline-block;
    
    /* Добавляем полупрозрачную обводку */
    border: 10px solid rgba(255, 255, 255, 0.542); /* белая, но с прозрачностью */
    box-shadow: 0 0 10px rgba(255, 255, 255, 0.15); /* лёгкое свечение */
}

.catalog-button:hover {
    background-color: #007939;
    transform: scale(1.05);
    border-color: rgba(255, 255, 255, 0.8); /* при наведении — обводка становится ярче */
    box-shadow: 0 0 15px rgba(255, 255, 255, 0.25);
}


/* ✅ Логотип в правом нижнем углу с эффектом пульсации */
.corner-logo {
    position: absolute;
    bottom: 20px;
    right: 20px;
    animation: pulse 3s ease-in-out infinite;
}

.corner-logo img {
    width: 200px;
    height: auto;
    opacity: 0.9;
    transition: transform 0.3s ease;
}

.corner-logo:hover img {
    transform: scale(1.15);
}

/* Эффект пульсации */
@keyframes pulse {
    0%, 100% {
        transform: scale(1);
        opacity: 0.9;
    }
    50% {
        transform: scale(1.1);
        opacity: 1;
    }
}