/* ==========================================================================
   SAGHA REAL ESTATE & BUILDERS — 3D & MOTION ENGINE STYLES
   Emil Kowalski Physics, 3D Tilt Transforms, Tactile Micro-Interactions
   ========================================================================== */

/* 3D Perspective Containers */
.perspective-container {
  perspective: 1200px;
  transform-style: preserve-3d;
}

.card-3d {
  position: relative;
  transform-style: preserve-3d;
  transition: transform 180ms cubic-bezier(0.16, 1, 0.3, 1),
              box-shadow 180ms cubic-bezier(0.16, 1, 0.3, 1);
  will-change: transform;
}

/* Specular Light Cursor Glare */
.glare-overlay {
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  z-index: 5;
  background: radial-gradient(circle at 50% 50%, rgba(255, 240, 200, 0.14) 0%, transparent 65%);
  opacity: 0;
  transition: opacity 0.3s ease;
}

.card-3d:hover .glare-overlay {
  opacity: 1;
}

/* Tactile 3D Button Micro-Interactions */
.btn-3d {
  transform-style: preserve-3d;
  transition: transform 120ms cubic-bezier(0.16, 1, 0.3, 1), 
              box-shadow 120ms cubic-bezier(0.16, 1, 0.3, 1);
  will-change: transform;
}

.btn-3d:hover {
  transform: translateY(-2px);
}

.btn-3d:active {
  transform: translateY(1px) scale(0.97) !important;
}

/* Blueprint Grid Shimmer Animation */
@keyframes blueprintShimmer {
  0% { background-position: 0% 0%; }
  100% { background-position: 100% 100%; }
}

.blueprint-active-shimmer {
  animation: blueprintShimmer 25s linear infinite;
}

/* Pulse Live Status Dot */
.status-dot-pulse {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #10B981;
  box-shadow: 0 0 10px #10B981;
  animation: pulseDot 2s infinite ease-in-out;
  margin-right: 6px;
}

@keyframes pulseDot {
  0% { transform: scale(1); opacity: 1; }
  50% { transform: scale(1.4); opacity: 0.5; }
  100% { transform: scale(1); opacity: 1; }
}

/* Elevation 3D Model Lighting Shift */
.lighting-day {
  filter: drop-shadow(0 20px 30px rgba(0, 0, 0, 0.5)) brightness(1.05);
}

.lighting-night {
  filter: drop-shadow(0 20px 40px rgba(197, 168, 128, 0.3)) hue-rotate(-20deg) brightness(0.85);
}

/* Number Count-Up Glow */
.count-glow {
  text-shadow: 0 0 25px rgba(197, 168, 128, 0.6);
  transition: text-shadow 0.3s;
}

/* Particle Canvas Container */
#blueprintCanvas {
  position: fixed;
  inset: 0;
  width: 100vw;
  height: 100vh;
  pointer-events: none;
  z-index: 0;
  opacity: 0.4;
}

/* Mobile Drawer Transition */
.mobile-nav-drawer {
  position: fixed;
  top: 70px;
  left: 0;
  right: 0;
  background: rgba(8, 12, 20, 0.98);
  backdrop-filter: blur(25px);
  border-bottom: 1px solid var(--card-border);
  padding: 1.5rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  z-index: 999;
  transform: translateY(-120%);
  opacity: 0;
  transition: all 0.3s var(--ease-smooth);
}

.mobile-nav-drawer.open {
  transform: translateY(0);
  opacity: 1;
}

.mobile-nav-drawer a {
  color: var(--text-primary);
  text-decoration: none;
  font-size: 1.05rem;
  padding: 8px 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}