* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    height: 100vh;
    background: #000;
    overflow: hidden;
    font-family: Arial, sans-serif;
}

/* ЦЕНТР */
.center {
    position: absolute;
    inset: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    perspective: 1000px;
}

/* КНОПКА */
.button {
    padding: 18px 38px;
    border: 1px solid rgba(255,255,255,0.15);
    background: rgba(0,0,0,0.6);
    transform-style: preserve-3d;
    clip-path: polygon(
        6% 0%, 94% 0%,
        100% 50%,
        94% 100%, 6% 100%,
        0% 50%
    ); /* ← гранёная форма */
    cursor: pointer;

    opacity: 0;
    animation: appear 2.5s ease forwards;
}

/* ТЕКСТ */
.button span {
    font-size: 11px;
    letter-spacing: 7px;
    color: #fff;
    text-shadow:
        0 0 6px rgba(255,255,255,0.25),
        0 0 18px rgba(255,255,255,0.15);
    display: block;
    transition: 0.6s ease;
}

/* НАВЕДЕНИЕ */
.button:hover {
    background: rgba(255,255,255,0.95);
    box-shadow:
        0 0 30px rgba(255,255,255,0.3),
        0 0 80px rgba(255,255,255,0.15);
    transform: scale(1.35) rotateX(14deg);
}

.button:hover span {
    color: #000;
    letter-spacing: 10px;
    text-shadow: none;
    filter: blur(0.3px);
}

/* ПЛАВНОЕ ПОЯВЛЕНИЕ */
@keyframes appear {
    from {
        opacity: 0;
        transform: translateY(20px) scale(0.9);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

/* ЧЁРНЫЕ СГУСТКИ / ТЕНИ */
.blobs {
    position: absolute;
    width: 200%;
    height: 200%;
    background:
        radial-gradient(circle at 20% 30%, rgba(0,0,0,0.9) 0%, transparent 40%),
        radial-gradient(circle at 70% 60%, rgba(0,0,0,0.85) 0%, transparent 45%),
        radial-gradient(circle at 40% 80%, rgba(0,0,0,0.8) 0%, transparent 50%);
    animation: blobsMove 60s linear infinite;
    filter: blur(40px);
}

/* МЕДЛЕННОЕ ДВИЖЕНИЕ ТЕНЕЙ */
@keyframes blobsMove {
    from {
        transform: translate(0, 0);
    }
    to {
        transform: translate(-300px, -300px);
    }
}