/* ============================================
   АНИМАЦИИ И ДЕКОРАЦИИ ЛОГОТИПА
   ============================================ */

.logo-container {
    position: relative;
    display: inline-block;
    min-width: 150px; /* Минимальная ширина контейнера */
    min-height: 40px; /* Минимальная высота после 730px */
}

.animated-logo {
    transition: transform 0.3s ease;
    animation: logoFloat 3s ease-in-out infinite;
}

@keyframes logoFloat {
    0%, 100% {
        transform: translateY(0) rotate(0deg);
    }
    50% {
        transform: translateY(-4px) rotate(1deg);
    }
}

.logo-link:hover .animated-logo {
    animation: logoHover 0.6s ease-in-out;
    transform: scale(1.05);
}

@keyframes logoHover {
    0%, 100% {
        transform: scale(1.05) rotate(0deg);
    }
    25% {
        transform: scale(1.08) rotate(-2deg);
    }
    75% {
        transform: scale(1.08) rotate(2deg);
    }
}

/* Декорации логотипа */
.logo-decorations {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 10;
    overflow: visible;
}

/* Новогодняя шапка - улучшенный дизайн */
.logo-decoration-newyear-hat {
    position: absolute;
    top: -20px;
    right: -8px;
    width: 32px;
    height: 32px;
    background: linear-gradient(135deg, #ff6b6b 0%, #ee5a6f 50%, #c44569 100%);
    border-radius: 50% 50% 50% 50% / 60% 60% 40% 40%;
    box-shadow: 0 4px 12px rgba(255, 107, 107, 0.4), 
                0 0 0 2px rgba(255, 255, 255, 0.3),
                inset 0 -4px 8px rgba(0, 0, 0, 0.2);
    animation: hatBounce 2.5s ease-in-out infinite;
    transform-origin: center bottom;
}

.logo-decoration-newyear-hat::before {
    content: '';
    position: absolute;
    top: -8px;
    left: 50%;
    transform: translateX(-50%);
    width: 8px;
    height: 8px;
    background: #ffd700;
    border-radius: 50%;
    box-shadow: 0 0 8px rgba(255, 215, 0, 0.8);
    animation: starTwinkle 1.5s ease-in-out infinite;
}

.logo-decoration-newyear-hat::after {
    content: '';
    position: absolute;
    bottom: -12px;
    left: 50%;
    transform: translateX(-50%);
    width: 24px;
    height: 4px;
    background: linear-gradient(90deg, transparent 0%, #ffd700 20%, #ffd700 80%, transparent 100%);
    border-radius: 2px;
}

@keyframes hatBounce {
    0%, 100% {
        transform: rotate(-3deg) translateY(0) scale(1);
    }
    50% {
        transform: rotate(3deg) translateY(-4px) scale(1.05);
    }
}

@keyframes starTwinkle {
    0%, 100% {
        opacity: 1;
        transform: translateX(-50%) scale(1);
    }
    50% {
        opacity: 0.6;
        transform: translateX(-50%) scale(1.2);
    }
}

/* Георгиевская ленточка - улучшенный дизайн */
.logo-decoration-ribbon {
    position: absolute;
    top: 50%;
    left: -12px;
    width: 10px;
    height: 70%;
    background: linear-gradient(to right, 
        #000 0%, #000 18%,
        #FFD700 18%, #FFD700 28%,
        #000 28%, #000 38%,
        #FFD700 38%, #FFD700 48%,
        #000 48%, #000 58%,
        #FFD700 58%, #FFD700 68%,
        #000 68%, #000 78%,
        #FFD700 78%, #FFD700 88%,
        #000 88%, #000 100%);
    border-radius: 5px;
    transform: translateY(-50%);
    animation: ribbonWave 3s ease-in-out infinite;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3),
                inset 0 0 4px rgba(255, 215, 0, 0.2);
    border: 1px solid rgba(255, 255, 255, 0.1);
}

.logo-decoration-ribbon::before {
    content: '';
    position: absolute;
    top: -4px;
    left: 50%;
    transform: translateX(-50%);
    width: 14px;
    height: 6px;
    background: linear-gradient(135deg, #FFD700 0%, #FFA500 100%);
    border-radius: 3px 3px 0 0;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

@keyframes ribbonWave {
    0%, 100% {
        transform: translateY(-50%) rotate(0deg) scaleY(1);
    }
    25% {
        transform: translateY(-50%) rotate(-1.5deg) scaleY(1.02);
    }
    75% {
        transform: translateY(-50%) rotate(1.5deg) scaleY(1.02);
    }
}

/* Пасхальные яйца - улучшенный дизайн */
.logo-decoration-easter-eggs {
    position: absolute;
    top: -12px;
    left: -12px;
    width: 24px;
    height: 32px;
    background: linear-gradient(135deg, #ff9ff3 0%, #f368e0 50%, #ee5a6f 100%);
    border-radius: 50% 50% 50% 50% / 60% 60% 40% 40%;
    box-shadow: 0 3px 10px rgba(238, 90, 111, 0.4),
                inset 0 -2px 6px rgba(0, 0, 0, 0.1),
                0 0 0 1px rgba(255, 255, 255, 0.2);
    animation: eggsFloat 4s ease-in-out infinite;
}

.logo-decoration-easter-eggs::before {
    content: '';
    position: absolute;
    top: 6px;
    left: 50%;
    transform: translateX(-50%);
    width: 8px;
    height: 8px;
    background: radial-gradient(circle, #fff 30%, transparent 30%);
    border-radius: 50%;
    box-shadow: 
        -4px 0 0 -1px rgba(255, 255, 255, 0.6),
        4px 0 0 -1px rgba(255, 255, 255, 0.6),
        0 -4px 0 -1px rgba(255, 255, 255, 0.6),
        0 4px 0 -1px rgba(255, 255, 255, 0.6);
}

.logo-decoration-easter-eggs::after {
    content: '';
    position: absolute;
    top: -8px;
    right: -8px;
    width: 20px;
    height: 26px;
    background: linear-gradient(135deg, #a8e6cf 0%, #88d8a3 50%, #6bc77a 100%);
    border-radius: 50% 50% 50% 50% / 60% 60% 40% 40%;
    box-shadow: 0 3px 10px rgba(107, 199, 122, 0.4),
                inset 0 -2px 6px rgba(0, 0, 0, 0.1),
                0 0 0 1px rgba(255, 255, 255, 0.2);
    animation: eggBounce 2.5s ease-in-out infinite;
    animation-delay: 1s;
}

@keyframes eggsFloat {
    0%, 100% {
        transform: translateY(0) rotate(0deg);
    }
    50% {
        transform: translateY(-6px) rotate(-3deg);
    }
}

@keyframes eggBounce {
    0%, 100% {
        transform: translateY(0) rotate(0deg) scale(1);
    }
    50% {
        transform: translateY(-8px) rotate(8deg) scale(1.05);
    }
}

/* Хэллоуин тыква - улучшенный дизайн */
.logo-decoration-halloween {
    position: absolute;
    top: -14px;
    right: -10px;
    width: 28px;
    height: 32px;
    background: linear-gradient(135deg, #ff8c00 0%, #ff6b35 50%, #ee5a24 100%);
    border-radius: 50% 50% 50% 50% / 55% 55% 45% 45%;
    box-shadow: 0 4px 12px rgba(255, 140, 0, 0.5),
                inset 0 -4px 8px rgba(0, 0, 0, 0.3),
                0 0 0 1px rgba(255, 255, 255, 0.1);
    animation: pumpkinGlow 3s ease-in-out infinite;
    transform-origin: center bottom;
}

.logo-decoration-halloween::before {
    content: '';
    position: absolute;
    top: 8px;
    left: 6px;
    width: 4px;
    height: 6px;
    background: #1a1a1a;
    border-radius: 50% 50% 50% 50% / 60% 60% 40% 40%;
    box-shadow: 10px 0 0 #1a1a1a;
}

.logo-decoration-halloween::after {
    content: '';
    position: absolute;
    top: 16px;
    left: 8px;
    width: 12px;
    height: 4px;
    background: #1a1a1a;
    border-radius: 0 0 50% 50%;
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.5);
}

@keyframes pumpkinGlow {
    0%, 100% {
        filter: drop-shadow(0 0 8px rgba(255, 140, 0, 0.6));
        transform: scale(1) rotate(0deg);
    }
    50% {
        filter: drop-shadow(0 0 16px rgba(255, 140, 0, 0.9));
        transform: scale(1.08) rotate(-2deg);
    }
}

/* День Победы - звезда - улучшенный дизайн */
.logo-decoration-victory-star {
    position: absolute;
    top: -10px;
    left: 50%;
    transform: translateX(-50%);
    width: 24px;
    height: 24px;
    background: linear-gradient(135deg, #FFD700 0%, #FFA500 100%);
    clip-path: polygon(50% 0%, 61% 35%, 98% 35%, 68% 57%, 79% 91%, 50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%);
    animation: starPulse 2s ease-in-out infinite;
    filter: drop-shadow(0 0 8px rgba(255, 215, 0, 0.8));
    box-shadow: 0 0 12px rgba(255, 215, 0, 0.6),
                inset 0 0 8px rgba(255, 255, 255, 0.3);
}

.logo-decoration-victory-star::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 12px;
    height: 12px;
    background: radial-gradient(circle, rgba(255, 255, 255, 0.8) 0%, transparent 70%);
    border-radius: 50%;
    animation: starShine 1.5s ease-in-out infinite;
}

@keyframes starPulse {
    0%, 100% {
        transform: translateX(-50%) scale(1) rotate(0deg);
        opacity: 1;
    }
    50% {
        transform: translateX(-50%) scale(1.15) rotate(5deg);
        opacity: 0.9;
    }
}

@keyframes starShine {
    0%, 100% {
        opacity: 0.6;
        transform: translate(-50%, -50%) scale(1);
    }
    50% {
        opacity: 1;
        transform: translate(-50%, -50%) scale(1.3);
    }
}

/* День влюбленных - сердечки - улучшенный дизайн */
.logo-decoration-valentine {
    position: absolute;
    top: -12px;
    right: -8px;
    width: 20px;
    height: 18px;
    background: linear-gradient(135deg, #ff6b9d 0%, #ee5a6f 100%);
    clip-path: path('M12,21.35l-1.45-1.32C5.4,15.36,2,12.28,2,8.5 C2,5.42,4.42,3,7.5,3c1.74,0,3.41,0.81,4.5,2.09C13.09,3.81,14.76,3,16.5,3 C19.58,3,22,5.42,22,8.5c0,3.78-3.4,6.86-8.55,11.54L12,21.35z');
    animation: heartsFloat 3s ease-in-out infinite;
    filter: drop-shadow(0 2px 6px rgba(255, 107, 157, 0.5));
    box-shadow: inset 0 -2px 4px rgba(0, 0, 0, 0.2);
}

.logo-decoration-valentine::before {
    content: '';
    position: absolute;
    top: -8px;
    left: -10px;
    width: 16px;
    height: 14px;
    background: linear-gradient(135deg, #ff9ff3 0%, #ff6b9d 100%);
    clip-path: path('M12,21.35l-1.45-1.32C5.4,15.36,2,12.28,2,8.5 C2,5.42,4.42,3,7.5,3c1.74,0,3.41,0.81,4.5,2.09C13.09,3.81,14.76,3,16.5,3 C19.58,3,22,5.42,22,8.5c0,3.78-3.4,6.86-8.55,11.54L12,21.35z');
    filter: drop-shadow(0 2px 6px rgba(255, 159, 243, 0.5));
    box-shadow: inset 0 -2px 4px rgba(0, 0, 0, 0.2);
    animation: heartBeat 1.5s ease-in-out infinite;
    animation-delay: 0s;
}

.logo-decoration-valentine::after {
    content: '';
    position: absolute;
    top: -6px;
    right: -10px;
    width: 14px;
    height: 12px;
    background: linear-gradient(135deg, #ff9ff3 0%, #ff6b9d 100%);
    clip-path: path('M12,21.35l-1.45-1.32C5.4,15.36,2,12.28,2,8.5 C2,5.42,4.42,3,7.5,3c1.74,0,3.41,0.81,4.5,2.09C13.09,3.81,14.76,3,16.5,3 C19.58,3,22,5.42,22,8.5c0,3.78-3.4,6.86-8.55,11.54L12,21.35z');
    filter: drop-shadow(0 2px 6px rgba(255, 159, 243, 0.5));
    box-shadow: inset 0 -2px 4px rgba(0, 0, 0, 0.2);
    animation: heartBeat 1.5s ease-in-out infinite;
    animation-delay: 0.75s;
}

@keyframes heartsFloat {
    0%, 100% {
        transform: translateY(0) rotate(0deg);
    }
    50% {
        transform: translateY(-6px) rotate(-2deg);
    }
}

@keyframes heartBeat {
    0%, 100% {
        transform: scale(1) rotate(0deg);
        opacity: 0.9;
    }
    50% {
        transform: scale(1.25) rotate(-3deg);
        opacity: 1;
    }
}

/* Рождество - снежинки - улучшенный дизайн */
.logo-decoration-christmas {
    position: absolute;
    top: -16px;
    left: 50%;
    transform: translateX(-50%);
    width: 20px;
    height: 20px;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.95) 0%, rgba(200, 220, 255, 0.9) 100%);
    clip-path: polygon(50% 0%, 61% 35%, 98% 35%, 68% 57%, 79% 91%, 50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%);
    animation: snowflakesFall 4s linear infinite;
    filter: drop-shadow(0 0 6px rgba(255, 255, 255, 0.8));
    box-shadow: 0 0 10px rgba(200, 220, 255, 0.6),
                inset 0 0 8px rgba(255, 255, 255, 0.5);
}

.logo-decoration-christmas::before {
    content: '';
    position: absolute;
    top: -12px;
    left: -18px;
    width: 16px;
    height: 16px;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.9) 0%, rgba(200, 220, 255, 0.85) 100%);
    clip-path: polygon(50% 0%, 61% 35%, 98% 35%, 68% 57%, 79% 91%, 50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%);
    filter: drop-shadow(0 0 4px rgba(255, 255, 255, 0.7));
    box-shadow: 0 0 8px rgba(200, 220, 255, 0.5);
    animation: snowflakeSpin 3s linear infinite;
    animation-delay: 0s;
}

.logo-decoration-christmas::after {
    content: '';
    position: absolute;
    top: -10px;
    right: -18px;
    width: 14px;
    height: 14px;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.9) 0%, rgba(200, 220, 255, 0.85) 100%);
    clip-path: polygon(50% 0%, 61% 35%, 98% 35%, 68% 57%, 79% 91%, 50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%);
    filter: drop-shadow(0 0 4px rgba(255, 255, 255, 0.7));
    box-shadow: 0 0 8px rgba(200, 220, 255, 0.5);
    animation: snowflakeSpin 3s linear infinite;
    animation-delay: 1.5s;
}

@keyframes snowflakesFall {
    0% {
        transform: translateX(-50%) translateY(0) rotate(0deg) scale(1);
        opacity: 1;
    }
    100% {
        transform: translateX(-50%) translateY(8px) rotate(360deg) scale(0.95);
        opacity: 0.9;
    }
}

@keyframes snowflakeSpin {
    0% {
        transform: rotate(0deg) scale(1);
        opacity: 0.9;
    }
    100% {
        transform: rotate(360deg) scale(0.85);
        opacity: 0.7;
    }
}

/* Адаптивность */
/* После 730px декорации НЕ уменьшаются, т.к. логотип остается 40px */
@media (max-width: 729px) {
    .logo-decoration-newyear-hat {
        width: 28px;
        height: 28px;
        top: -18px;
        right: -7px;
    }
    
    .logo-decoration-halloween {
        width: 24px;
        height: 28px;
        top: -14px;
        right: -8px;
    }
    
    .logo-decoration-victory-star {
        width: 22px;
        height: 22px;
        top: -10px;
    }
    
    .logo-decoration-valentine {
        width: 18px;
        height: 16px;
        top: -12px;
        right: -7px;
    }
    
    .logo-decoration-valentine::before,
    .logo-decoration-valentine::after {
        width: 14px;
        height: 12px;
    }
    
    .logo-decoration-christmas {
        width: 18px;
        height: 18px;
        top: -16px;
    }
    
    .logo-decoration-christmas::before,
    .logo-decoration-christmas::after {
        width: 14px;
        height: 14px;
    }
    
    .logo-decoration-ribbon {
        width: 9px;
        left: -10px;
    }
    
    .logo-decoration-easter-eggs {
        width: 20px;
        height: 26px;
        top: -10px;
        left: -10px;
    }
    
    .logo-decoration-easter-eggs::after {
        width: 16px;
        height: 22px;
    }
    
    /* logo-container остается минимум 40px в высоту */
    .logo-container {
        min-height: 40px !important;
    }
}

/* Для очень маленьких экранов - уменьшаем декорации еще больше */
@media (max-width: 480px) {
    .logo-decoration-newyear-hat {
        width: 22px;
        height: 22px;
        top: -16px;
        right: -6px;
    }
    
    .logo-decoration-halloween {
        width: 20px;
        height: 24px;
        top: -12px;
        right: -6px;
    }
    
    .logo-decoration-victory-star {
        width: 18px;
        height: 18px;
        top: -8px;
    }
    
    .logo-decoration-valentine {
        width: 16px;
        height: 14px;
        top: -10px;
        right: -6px;
    }
    
    .logo-decoration-valentine::before,
    .logo-decoration-valentine::after {
        width: 12px;
        height: 10px;
    }
    
    .logo-decoration-christmas {
        width: 16px;
        height: 16px;
        top: -14px;
    }
    
    .logo-decoration-christmas::before,
    .logo-decoration-christmas::after {
        width: 12px;
        height: 12px;
    }
    
    .logo-decoration-ribbon {
        width: 8px;
        left: -8px;
    }
    
    .logo-decoration-easter-eggs {
        width: 18px;
        height: 22px;
        top: -8px;
        left: -8px;
    }
    
    .logo-decoration-easter-eggs::after {
        width: 14px;
        height: 18px;
    }
}

/* Для экстра маленьких экранов - скрываем декорации полностью */
@media (max-width: 360px) {
    .logo-decorations {
        display: none !important;
    }
}

