/* ============================================
   GAJ-DASTAK — Ambient Falling Leaves
   Full-page, continuous, subtle leaf drift
   Like walking through a quiet forest
   ============================================ */

/* --- Fixed full-viewport container --- */
.leaf-canvas {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  pointer-events: none;
  overflow: hidden;
  z-index: 900; /* Above content, below modals/nav overlays */
}

/* --- Individual Leaf --- */
.ambient-leaf {
  position: absolute;
  top: -80px;
  pointer-events: none;
  will-change: transform, opacity;
  filter: drop-shadow(0 1px 2px rgba(0,0,0,0.1));
  animation:
    ambientFall var(--fall-duration, 12s) var(--fall-delay, 0s) linear forwards,
    ambientSway var(--sway-duration, 4s) var(--fall-delay, 0s) ease-in-out infinite,
    ambientSpin var(--spin-duration, 8s) var(--fall-delay, 0s) linear infinite;
}

.ambient-leaf svg {
  width: 100%;
  height: 100%;
  display: block;
}

/* --- Fall: top to well below viewport --- */
@keyframes ambientFall {
  0% {
    transform: translateY(0);
    opacity: 0;
  }
  3% {
    opacity: var(--leaf-opacity, 0.25);
  }
  90% {
    opacity: var(--leaf-opacity, 0.25);
  }
  100% {
    transform: translateY(calc(100vh + 120px));
    opacity: 0;
  }
}

/* --- Horizontal sway: gentle sinusoidal drift --- */
@keyframes ambientSway {
  0%   { transform: translateX(0); }
  25%  { transform: translateX(var(--sway-x, 25px)); }
  50%  { transform: translateX(0); }
  75%  { transform: translateX(calc(var(--sway-x, 25px) * -1)); }
  100% { transform: translateX(0); }
}

/* --- Rotation: slow tumble --- */
@keyframes ambientSpin {
  from { rotate: 0deg; }
  to   { rotate: var(--leaf-rotation, 360deg); }
}

/* --- Color variants: military green + amber gold palette --- */

/* Military / olive greens */
.leaf--forest svg path   { fill: #4A5D23; }
.leaf--olive svg path    { fill: #6B7B3A; }
.leaf--moss svg path     { fill: #5C6B2F; }
.leaf--sage svg path     { fill: #7C8C4E; }

/* Amber / gold tones */
.leaf--amber svg path    { fill: #C8952E; }
.leaf--gold svg path     { fill: #B8860B; }
.leaf--honey svg path    { fill: #D4A030; }
.leaf--copper svg path   { fill: #A0722A; }

/* SVG vein lines */
.ambient-leaf svg line {
  stroke: rgba(0, 0, 0, 0.08);
}

/* --- Page Content Fade (kept for page transitions) --- */
.page-content {
  transition: opacity 0.4s ease-out;
}

.page-content.fading-out {
  opacity: 0;
}

.page-content.fading-in {
  animation: contentFadeIn 0.6s ease-out forwards;
}

@keyframes contentFadeIn {
  from {
    opacity: 0;
    transform: translateY(12px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* --- Reduced motion: respect user preference --- */
@media (prefers-reduced-motion: reduce) {
  .leaf-canvas {
    display: none;
  }
}