/* === JUHEMZENITH - Architectural Precision Design System === */

.material-symbols-outlined { font-variation-settings: 'wght' 300, 'opsz' 24; }

/* Glass Effect */
.glass-effect { backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); border: 1px solid rgba(255,255,255,0.2); }

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

/* Drift Animation */
@keyframes drift {
    0% { transform: translate(0,0) rotate(0deg); }
    50% { transform: translate(30px,15px) rotate(5deg); }
    100% { transform: translate(0,0) rotate(0deg); }
}
.floating-element {
    position: absolute; pointer-events: none; opacity: 0.1; z-index: 0;
    animation: drift 15s ease-in-out infinite;
}

/* Wave Reveal */
.wave-reveal {
    opacity: 0; transform: translateY(30px);
    transition: opacity 1.2s cubic-bezier(0.22,1,0.36,1), transform 1.2s cubic-bezier(0.22,1,0.36,1);
}
.wave-reveal.active { opacity: 1; transform: translateY(0); }

/* Magnetic Hover */
.magnetic-hover { transition: transform 0.3s cubic-bezier(0.22,1,0.36,1), letter-spacing 0.3s ease; }
.magnetic-hover:hover { transform: scale(1.05); letter-spacing: 0.15em; }

/* Liquid Card */
.liquid-card { transition: transform 0.6s cubic-bezier(0.22,1,0.36,1), filter 0.6s ease; perspective: 1000px; }
.liquid-card:hover { transform: scale(1.02) rotateX(2deg) rotateY(2deg); }

/* Staggered Reveal Items */
.reveal-item {
    opacity: 0; transform: translateY(20px);
    transition: all 0.8s cubic-bezier(0.22,1,0.36,1);
}
.reveal-item.visible { opacity: 1; transform: translateY(0); }

/* Section Reveal */
.section-reveal { opacity: 0; transform: translateY(40px); transition: all 1s cubic-bezier(0.22,1,0.36,1); }
.section-reveal.active { opacity: 1; transform: translateY(0); }
.section-reveal.active .reveal-item { opacity: 1; transform: translateY(0); }

/* Hero Canvas */
canvas#hero-shader { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -1; }

/* Header Scroll States */
header { transition: all 0.5s cubic-bezier(0.22,1,0.36,1); }
header.scrolled { backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); }

/* Scroll Progress */
#scroll-progress { transition: width 0.1s ease-out; }

/* Custom Scrollbar */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: #f9f9f9; }
::-webkit-scrollbar-thumb { background: #c8c6c5; }
::-webkit-scrollbar-thumb:hover { background: #5f5e5e; }

/* Selection */
::selection { background: #1a1c1c; color: white; }

/* Mobile Menu */
#mobile-menu { opacity: 0; visibility: hidden; transition: opacity 0.4s ease, visibility 0.4s ease; }
#mobile-menu.open { opacity: 1; visibility: visible; }

/* Admin Bar Fix */
.admin-bar #main-header { top: 32px; }
@media screen and (max-width:782px) {
    .admin-bar #main-header { top: 46px !important; }
    #wpadminbar { position: fixed !important; }
}

/* Responsive */
@media (max-width:768px) {
    .reveal-item { transition-duration: 0.5s; }
    .floating-element { display: none; }
}

/* Floating Service Pulse */
@keyframes service-pulse {
    0% { box-shadow: 0 0 0 0 rgba(197,165,90,0.4); }
    70% { box-shadow: 0 0 0 12px rgba(197,165,90,0); }
    100% { box-shadow: 0 0 0 0 rgba(197,165,90,0); }
}
.service-btn { animation: service-pulse 2s infinite; }

/* Counter Animation */
@keyframes countUp {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

/* Ghost Button Animation */
@keyframes border-dance {
    0% { background-position: 0 0; }
    100% { background-position: 200% 0; }
}