/* 1. ВЕРХНЕЕ МЕНЮ: ПОЛНЫЙ 3D-ОБОРОТ ПРИ НАВЕДЕНИИ */
header a, nav a, .nav-link, [class*="nav"] a, [class*="menu"] a {
    display: inline-block !important;
    background: rgba(160, 32, 240, 0.15) !important;
    border: 1px solid rgba(160, 32, 240, 0.4) !important;
    color: #fff !important;
    padding: 6px 14px !important;
    font-size: 13px !important;
    text-transform: uppercase !important;
    border-radius: 6px !important;
    margin: 4px !important;
    /* Настройка для 3D */
    transform-style: preserve-3d !important;
    transition: transform 1s cubic-bezier(0.175, 0.885, 0.32, 1.275), background 0.4s !important;
    cursor: pointer !important;
}

/* Эффект шикарного переворота на 360 градусов */
header a:hover, nav a:hover, [class*="nav"] a:hover {
    background: #a020f0 !important;
    transform: perspective(1000px) rotateY(360deg) scale(1.1) !important;
    box-shadow: 0 0 20px rgba(160, 32, 240, 0.6) !important;
}

/* 2. ОСНОВНЫЕ КНОПКИ КУПИТЬ: 3D-НАКЛОН + ЭФФЕКТ НАЖАТИЯ */
button, .btn, .btn-primary, .buy-btn, [class*="button"] {
    background-color: #a020f0 !important;
    background: #a020f0 !important;
    border: none !important;
    color: #fff !important;
    transform-style: preserve-3d !important;
    transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), box-shadow 0.4s ease !important;
    transform: perspective(1000px) rotateX(0) rotateY(0) !important;
}

/* Наведение: наклон */
button:hover, .btn:hover {
    background: #bf40ff !important;
    transform: perspective(1000px) rotateY(-15deg) rotateX(10deg) scale(1.08) !important;
    box-shadow: 0 10px 30px rgba(160, 32, 240, 0.6) !important;
}

/* ЭФФЕКТ НАЖАТИЯ: Кнопка "проваливается" на 1 секунду */
button:active, .btn:active {
    transform: perspective(1000px) scale(0.85) translateZ(-50px) !important; /* Уходит вглубь */
    background: #7a18b8 !important;
    transition: transform 0.1s !important; /* Мгновенный отклик */
}

/* 3. ТЕКСТ YGALAND: БЫСТРЫЙ ПЕРЕЛИВ + 3D ПЕРЕВОРОТ */
.navbar-brand, .site-name, [class*="logo"], h1.title {
    display: inline-block !important;
    color: #ffffff !important;
    text-shadow: 0 0 15px #a020f0, 0 0 30px #a020f0 !important;
    transition: transform 1.2s cubic-bezier(0.175, 0.885, 0.32, 1.275) !important;
    transform-style: preserve-3d !important;
    animation: neon-flash 1.5s infinite alternate ease-in-out !important;
}

.navbar-brand:hover, .site-name:hover {
    transform: perspective(1000px) rotateY(360deg) scale(1.2) !important;
}

@keyframes neon-flash {
    0% { text-shadow: 0 0 10px #a020f0; filter: brightness(1); }
    100% { text-shadow: 0 0 30px #bf40ff, 0 0 50px #a020f0; filter: brightness(1.4); }
}

/* 4. АНИМАЦИЯ БАНКОВ (УВЕЛИЧЕНИЕ ПРИ НАВЕДЕНИИ) */
.payment-method, .payment-item, [class*="payment-method"], .method-select-item {
    transition: all 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275) !important;
    cursor: pointer !important;
}

.payment-method:hover, .payment-item:hover {
    transform: scale(1.1) translateY(-5px) !important;
    box-shadow: 0 10px 25px rgba(160, 32, 240, 0.4) !important;
}

/* 5. ПЛАВНОЕ ПОЯВЛЕНИЕ ПРИ ЗАГРУЗКЕ */
.item, .shop-item, .card {
    animation: slide-up-view 1s ease-out both !important;
}

@keyframes slide-up-view {
    0% { opacity: 0; transform: translateY(30px); }
    100% { opacity: 1; transform: translateY(0); }
}
/* ЭФФЕКТ СВЕТЯЩЕГОСЯ КУРСОРА (НЕ УДАЛЯЯ ТВОИ 3D ЭФФЕКТЫ) */
html, body {
    /* Заменяем обычную стрелку на аккуратную неоновую точку */
    cursor: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org" width="20" height="20" viewBox="0 0 20 20"><circle cx="10" cy="10" r="5" fill="%23a020f0" filter="blur(1px)" stroke="white" stroke-width="0.5"/></svg>') 10 10, auto !important;
}

/* Изменение курсора при наведении на кнопки (сохраняет твои hover-эффекты) */
a:hover, button:hover, .btn:hover, [class*="nav"] a:hover {
    cursor: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org" width="24" height="24" viewBox="0 0 24 24"><circle cx="12" cy="12" r="7" fill="%23bf40ff" filter="blur(2px)"/><circle cx="12" cy="12" r="3" fill="white"/></svg>') 12 12, pointer !important;
}

/* МЯГКОЕ ФИОЛЕТОВОЕ СВЕЧЕНИЕ ПОЗАДИ ВСЕГО КОНТЕНТА */
body::before {
    content: "";
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /* Создает глубокий фиолетовый градиент в углах, не мешая тексту */
    background: radial-gradient(circle at 50% 50%, transparent 60%, rgba(160, 32, 240, 0.1) 100%);
    pointer-events: none;
    z-index: -1;
}