/* Общие настройки */
body {
    margin: 0;
    font-family: "Cinzel", serif;
    background: #0a0a0a;
    color: #f5f5f5;
    overflow: hidden;
}

/* Звёздный фон */
.stars {
    position: fixed;
    z-index: 1;
    top: 0; left: 0;
    width: 100vw;
    height: 100vh;
    background: url("assets/stars.png");
    background-size: cover;
    animation: starsPulse 6.5s ease-in-out infinite;
    opacity: 0.18s;
    animation: starsMove 30s linear infinite, starsGlow 6s ease-in-out infinite;
}

@keyframes starsGlow {
    0% { opacity: 0.17; }
    50% { opacity: 0.23; }
    100% { opacity: 0.17; }
}


@keyframes starsPulse {
    0% { opacity: 0.15; }
    50% { opacity: 0.23; }
    100% { opacity: 0.15; }
}
/* Лёгкое усиление звёзд слева */
.stars::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 45%; /* освещаем только левую часть */
    height: 100%;
    background: radial-gradient(
        circle at 30% 50%,
        rgba(255,255,255,0.16) 0%,
        rgba(255,255,255,0.10) 20%,
        rgba(255,255,255,0) 70%
    );
    pointer-events: none;
    mix-blend-mode: screen;
}

/* Центр */
.center {
    z-index: 4;
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -55%);
    text-align: center;
}

/* Лев */
.seal-container {
    position: relative;
    width: 260px;
    margin: 0 auto 25px;
    z-index: 4;
}

.seal {
    width: 100%;
    opacity: 0;
    transform: translateY(20px) scale(0.95);
    filter: drop-shadow(0 0 12px rgba(255, 215, 150, 0.1));
    animation: lionFadeIn 2.4s ease-out forwards;
}

@keyframes lionFadeIn {
    0% { opacity: 0; transform: translateY(35px) scale(0.9); filter: blur(6px); }
    60% { opacity: 0.9; transform: translateY(0) scale(1); filter: blur(0); }
    100% { opacity: 1; transform: translateY(0) scale(1); }
}

/* Золотой свет по льву */
.gold-sweep {
    position: absolute;
    top: 0; left: -90%;
    width: 100%; height: 100%;
    background: linear-gradient(
        120deg,
        rgba(255,255,255,0) 0%,
        rgba(255,224,150,0.45) 50%,
        rgba(255,255,255,0) 100%
    );
    animation: sweep 6s ease-in-out infinite;
    pointer-events: none;
}

@keyframes sweep {
    0% { transform: translateX(0); opacity: 0; }
    40% { opacity: 0.2; }
    60% { transform: translateX(200%); opacity: 0.2; }
    100% { opacity: 0; }
}
.seal-container:hover .seal {
    filter: drop-shadow(0 0 18px rgba(240,200,130,0.55));
    transform: translateY(-3px) scale(1.04);
    transition: 0.6s ease;
}

/* Созвездие VL */
.constellation {
    position: absolute;
    top: 38%;
    left: 68%;
    transform: translate(-50%, -50%);
    width: 260px;
    z-index: 6;
    pointer-events: none;
    opacity: 0;
    animation: constellationFade 2s ease forwards;
    animation-delay: 2.3s;
}

@keyframes constellationFade {
    from { opacity: 0; transform: translate(-50%, -40%); }
    to   { opacity: 0.85; transform: translate(-50%, -50%); }
}
.star {
    filter: drop-shadow(0 0 4px #d5b36d);
    animation: twinkle 4s ease-in-out infinite;
}

@keyframes twinkle {
    0% { opacity: 0.7; }
    50% { opacity: 1; }
    100% { opacity: 0.7; }
}

/* Звёзды */
.star {
    fill: #d8b674;
    filter: drop-shadow(0 0 4px #d8b674);
    animation: twinkle 4s ease-in-out infinite;
}

.big {
    r: 6;
    filter: drop-shadow(0 0 12px #e4cda1);
}

@keyframes twinkle {
    0% { opacity: 0.7; transform: scale(1); }
    50% { opacity: 1; transform: scale(1.12); }
    100% { opacity: 0.7; transform: scale(1); }
}

/* Линии VL */
.line {
    fill: none;
    stroke: #d8b674;
    stroke-width: 1.4;
    stroke-linecap: round;
    opacity: 0.9;
    stroke-dasharray: 400;
    stroke-dashoffset: 400;
    animation: draw 6s ease forwards;
}

@keyframes draw {
    to { stroke-dashoffset: 0; }
    0% { stroke-dashoffset: 400; opacity: 0; }
    40% { opacity: 0.4; }
    100% { stroke-dashoffset: 0; opacity: 1; }
}

/* Полупрозрачный фон */
.backplate {
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -55%);
    width: 480px;
    height: 580px;
    background: rgba(8,8,8,0.30);
    backdrop-filter: blur(6px);
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 20px;
    z-index: 2;
}

/* Текст */
.fade-in {
    opacity: 0;
    transform: translateY(10px);
    animation: fadeInUp 2.2s ease forwards;
}

@keyframes fadeInUp {
    from { opacity: 0; transform: translateY(20px); }
    to   { opacity: 1; transform: translateY(0); }
}

.brand {
    font-size: 2.4rem;
    letter-spacing: 6px;
    font-weight: 600;
    margin: 0;
    transition: 0.6s ease;
    opacity: 1 !important;
}

.brand:hover {
    text-shadow: 
        0 0 6px rgba(240,200,130,0.45),
        0 0 14px rgba(240,200,130,0.65),
        0 0 24px rgba(240,200,130,0.55);
    color: #fff5e0;
    transform: scale(1.04);
    transition: 0.4s ease;
}

.brand.glow {
    animation: goldShimmer 5s ease-in-out infinite;
}

@keyframes goldShimmer {
    0% { text-shadow: 0 0 4px rgba(255,220,170,0.3); }
    50% { text-shadow: 0 0 12px rgba(255,220,170,0.6); }
    100% { text-shadow: 0 0 4px rgba(255,220,170,0.3); }
}

/* Курсор-метеор */
.cursor-glow {
    position: fixed;
    top: 0;
    left: 0;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(255,220,150,0.9) 0%, rgba(255,220,150,0.0) 70%);
    pointer-events: none;
    mix-blend-mode: screen;
    filter: blur(4px);
    opacity: 0;
    transition: opacity 0.3s ease;
    z-index: 999;
}

/* Корона для слова VEROLION */
.verolion-title {
    position: relative;
    display: inline-block;
}

.verolion-word {
    position: relative;
    display: inline-block;
    opacity: 1 !important;
}

.v-letter {
    position: relative;
    display: inline-block;
    z-index: 3;
    opacity: 1 !important;
}

.mini-crown {
    position: absolute;
    width: 32px;
    top: -24px; /* опустили на 14px */
    left: -3px;
    z-index: 4;
    pointer-events: none;
}