/* Apple-elegant ambient background — layered depth, restrained, immersive */

body {
  background: #030305 !important;
}

/* Wave layer — slow, steady, visible movement */
.bg-wave {
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  overflow: hidden;
  opacity: 0.6;
}

.bg-wave::before,
.bg-wave::after {
  content: "";
  position: absolute;
  left: -50%;
  width: 200%;
  height: 100%;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 320'%3E%3Cpath fill='rgba(218,185,130,0.1)' d='M0,160 L60,170 C120,180,240,200,360,190 C480,180,600,140,720,150 C840,160,960,220,1080,200 C1200,180,1320,80,1380,30 L1440,0 L1440,320 L0,320 Z'/%3E%3Cpath fill='rgba(205,164,105,0.08)' d='M0,200 L80,190 C160,180,320,160,480,175 C640,190,800,240,960,220 C1120,200,1280,120,1360,80 L1440,40 L1440,320 L0,320 Z'/%3E%3Cpath fill='rgba(184,134,84,0.06)' d='M0,120 L120,135 C240,150,480,180,720,165 C960,150,1200,90,1320,60 L1440,30 L1440,320 L0,320 Z'/%3E%3C/svg%3E");
  background-size: 50% 100%;
  background-repeat: repeat-x;
  background-position: 0 100%;
  animation: wave-drift 25s linear infinite;
}

.bg-wave::after {
  animation-direction: reverse;
  animation-duration: 30s;
  opacity: 0.8;
  top: 10%;
}

@keyframes wave-drift {
  0% { transform: translateX(0) translateY(0); }
  100% { transform: translateX(25%) translateY(-2%); }
}

/* Layered ambient light — soft gradients, Apple-like depth */
.bg-ambient {
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  overflow: hidden;
}

.bg-ambient::before,
.bg-ambient::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  filter: blur(140px);
  opacity: 0.5;
  animation: ambient-breath 90s ease-in-out infinite;
}

.bg-ambient::before {
  width: 90vmax;
  height: 90vmax;
  background: radial-gradient(
    circle,
    rgba(218, 185, 130, 0.2) 0%,
    rgba(218, 185, 130, 0.08) 35%,
    transparent 65%
  );
  top: -15%;
  left: -15%;
  animation-delay: 0s;
}

.bg-ambient::after {
  width: 70vmax;
  height: 70vmax;
  background: radial-gradient(
    circle,
    rgba(205, 164, 105, 0.15) 0%,
    rgba(184, 134, 84, 0.06) 40%,
    transparent 70%
  );
  bottom: -20%;
  right: -15%;
  animation-delay: -45s;
}

@keyframes ambient-breath {
  0%, 100% { transform: translate(0, 0) scale(1); opacity: 0.5; }
  25% { transform: translate(2%, 1%) scale(1.02); opacity: 0.55; }
  50% { transform: translate(-1%, 2%) scale(0.98); opacity: 0.48; }
  75% { transform: translate(1%, -1%) scale(1.01); opacity: 0.52; }
}

/* Noise texture — premium feel */
.bg-noise {
  position: fixed;
  inset: 0;
  z-index: 0;
  opacity: 0.025;
  pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* Soft vignette — focus toward center */
.bg-vignette {
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background: radial-gradient(
    ellipse 110% 110% at 50% 50%,
    transparent 45%,
    rgba(3, 3, 5, 0.4) 100%
  );
}
