/* ── Home page cinematic layer ── */
#home-page { cursor: none; }
#home-page a, #home-page button, #home-page .cursor-pointer { cursor: none; }

@media (max-width: 767px) {
    #home-page, #home-page a, #home-page button { cursor: auto; }
    #custom-cursor { display: none !important; }
}

.cinematic-bg {
    filter: brightness(0.88) contrast(1.08) saturate(1.2);
    animation: ken-burns 24s ease-in-out infinite alternate;
    will-change: transform;
}

@keyframes ken-burns {
    from { transform: scale(1.05) translate(0, 0); }
    to { transform: scale(1.12) translate(-1%, -0.5%); }
}

.particle-canvas { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.particle-blend-screen { mix-blend-mode: screen; }

/* Hero entrance */
.hero-enter { opacity: 0; transform: translateY(24px); filter: blur(8px); animation: hero-in 0.9s cubic-bezier(0.16, 1, 0.3, 1) forwards; }
.hero-enter-1 { animation-delay: 0.1s; }
.hero-enter-2 { animation-delay: 0.25s; }
.hero-enter-3 { animation-delay: 0.4s; }
.hero-enter-4 { animation-delay: 0.55s; }
.hero-enter-5 { animation-delay: 0.7s; }
.hero-enter-6 { animation-delay: 0.85s; }
.hero-enter-7 { animation-delay: 1s; }

@keyframes hero-in {
    to { opacity: 1; transform: translateY(0); filter: blur(0); }
}

.hero-card { opacity: 0; animation: card-in 1.2s cubic-bezier(0.16, 1, 0.3, 1) forwards; }
.hero-card-1 { animation-delay: 0.5s; }
.hero-card-2 { animation-delay: 0.7s; }
.hero-card-3 { animation-delay: 0.9s; }
.hero-card-4 { animation-delay: 1.1s; }

@keyframes card-in {
    from { opacity: 0; transform: scale(0.85) translateY(20px); }
    to { opacity: 1; transform: scale(1) translateY(0); }
}

#hero-lightning.is-flash { opacity: 1 !important; }

/* Reveal with blur */
.reveal { opacity: 0; transform: translateY(28px); filter: blur(6px); transition: opacity .9s cubic-bezier(.16,1,.3,1), transform .9s cubic-bezier(.16,1,.3,1), filter .9s cubic-bezier(.16,1,.3,1); }
.reveal.is-visible { opacity: 1; transform: translateY(0); filter: blur(0); }

/* Preloader */
#cinematic-preloader.is-done { opacity: 0; pointer-events: none; }
#preloader-line.is-active { width: 240px; opacity: 0.8; }
#preloader-quote.is-visible { opacity: 1; filter: blur(0); }
#preloader-brand.is-visible { display: flex !important; opacity: 1; filter: blur(0); transform: scale(1); }

.preloader-star {
    position: absolute; width: 4px; height: 4px; border-radius: 50%;
    background: rgba(56, 189, 248, 0.5);
    animation: star-float 6s ease-in-out infinite;
}

@keyframes star-float {
    0%, 100% { transform: translateY(0); opacity: 0.2; }
    50% { transform: translateY(-30px); opacity: 0.7; }
}

@keyframes float {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}
.animate-float { animation: float 4s ease-in-out infinite; }

/* Custom cursor — scale задаётся в JS, здесь только цвета */
#cursor-ring.is-link { border-color: #22d3ee; background: rgba(34,211,238,0.05); box-shadow: 0 0 15px rgba(34,211,238,0.2); }
#cursor-ring.is-glow { border-color: #f5c76b; background: rgba(245,199,107,0.1); box-shadow: 0 0 25px rgba(245,199,107,0.35); }
#cursor-dot.is-link { background: #22d3ee; }
#cursor-dot.is-glow { background: #f5c76b; box-shadow: 0 0 8px #f5c76b; }

/* Active states */
.nav-section-link.is-active { color: #e7e5e4; background: rgba(28,25,23,0.45); box-shadow: 0 0 12px rgba(34,211,238,0.08); }
.hero-world-btn.is-active { background: rgba(8,47,73,0.15); border-color: rgba(34,211,238,0.5); box-shadow: 0 0 12px rgba(34,211,238,0.1); }
.creator-arch-btn.is-active { background: rgba(8,47,73,0.15); border-color: rgba(34,211,238,0.5); }
.creator-mot-btn.is-active { background: rgba(69,26,3,0.1); border-color: rgba(245,158,11,0.7); }
.realm-card.is-selected { z-index: 10; box-shadow: 0 0 20px rgba(34,211,238,0.1); }
.path-node-trigger.is-selected { background: rgba(8,47,73,0.15); border-color: rgba(34,211,238,0.4); transform: scale(1.02); }

/* Gallery */
.gallery-card:hover { transform: translateY(-4px); box-shadow: 0 20px 50px rgba(0,0,0,0.5); }
.gallery-card .gallery-eye { opacity: 0; transition: opacity 0.3s; }
.gallery-card:hover .gallery-eye { opacity: 1; }
#gallery-modal.is-open { display: flex; animation: modal-in 0.4s cubic-bezier(0.16,1,0.3,1); }
#gallery-modal .gallery-modal-inner { animation: modal-up 0.5s cubic-bezier(0.16,1,0.3,1); }

@keyframes modal-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes modal-up { from { opacity: 0; transform: scale(0.95) translateY(15px); } to { opacity: 1; transform: scale(1) translateY(0); } }

/* Demo */
#vn-viewport.is-shaking { animation: vn-shake 0.45s ease-in-out; }
@keyframes vn-shake {
    0%, 100% { transform: translate(0,0); }
    20% { transform: translate(-10px,8px); }
    40% { transform: translate(10px,-8px); }
    60% { transform: translate(-8px,6px); }
    80% { transform: translate(8px,-6px); }
}
.demo-choice-btn { transition: all 0.25s ease; }
.demo-choice-btn:hover:not(:disabled) { transform: translateX(6px); }

/* D3 graph */
.story-graph-node { cursor: pointer; transition: all 0.3s; }
.story-graph-node:hover circle { filter: drop-shadow(0 0 8px rgba(34,211,238,0.5)); }
.story-graph-link { stroke: #1c1917; stroke-width: 2; fill: none; }
.story-graph-link.active { stroke: url(#linkGradient); stroke-width: 2.5; }

/* Feature cards */
.feature-card .feature-sparkle { opacity: 0; transition: opacity 0.4s; }
.feature-card:hover .feature-sparkle { opacity: 1; }
.feature-card:hover .feature-icon { transform: scale(1.1); color: #22d3ee; border-color: rgba(34,211,238,0.4); }

/* Tilt */
.tilt-card { transform-style: preserve-3d; will-change: transform; }
#glow-hover, .glow-hover { position: relative; }

/* Feedback */
#feedback-fab { animation: float 5s ease-in-out infinite; }
#feedback-modal.is-open { display: flex; }

/* Forge */
.saga-log-filled { border-style: solid !important; border-color: rgba(34,211,238,0.4) !important; }

/* World crossfade */
#worlds-hero-image.is-fading { opacity: 0; transform: scale(1.05); }