/* Continuous Mountain Journey Atmosphere & Dynamic Sky */
html:has(body.mountain-home) {
  background-color: var(--sky-bottom, #b4ccd0);
  transition: background-color 0.12s linear;
}

.mountain-atmosphere {
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  display: none;
  overflow: hidden;
}

.mountain-home .mountain-atmosphere {
  display: block;
}

/* Continuous Sky Gradient Base */
.atmosphere-sky-base {
  position: absolute;
  inset: 0;
  z-index: 0;
  background: linear-gradient(
    180deg,
    var(--sky-top, #dfecee) 0%,
    var(--sky-mid, #cfdee1) 45%,
    var(--sky-bottom, #b4ccd0) 100%
  );
  will-change: background;
}

/* Atmospheric Fog Layer - Deep (Behind 3D Mountain Midground) */
.atmospheric-fog-layer.fog-deep {
  position: absolute;
  inset: -12% -25%;
  z-index: 1;
  background: radial-gradient(
    ellipse 135% 65% at 50% 60%,
    rgba(223, 236, 238, 0.75) 0%,
    rgba(207, 222, 225, 0.42) 48%,
    rgba(180, 204, 208, 0) 80%
  );
  opacity: var(--fog-opacity, 0.65);
  filter: blur(40px);
  animation: fogDriftDeep 38s ease-in-out infinite alternate;
  will-change: transform, opacity;
}

/* 3D WebGL Canvas Layer */
#mountain-scene {
  position: relative;
  z-index: 2;
  width: 100%;
  height: 100%;
  display: block;
  filter: contrast(var(--mountain-contrast, 1)) saturate(var(--mountain-saturation, 1));
}

#mountain-scene[data-state="unavailable"] {
  visibility: hidden;
}

/* Atmospheric Fog Layer - Front (Valley Floor Haze) */
.atmospheric-fog-layer.fog-front {
  position: absolute;
  bottom: -6%;
  left: -20%;
  width: 140%;
  height: 48%;
  z-index: 3;
  background: linear-gradient(
    180deg,
    rgba(223, 236, 238, 0) 0%,
    rgba(223, 236, 238, 0.42) 50%,
    rgba(207, 222, 225, 0.22) 100%
  );
  opacity: calc(var(--fog-opacity, 0.65) * 0.72);
  filter: blur(32px);
  animation: fogDriftFront 28s ease-in-out infinite alternate;
  will-change: transform, opacity;
}

@keyframes fogDriftDeep {
  0% { transform: translate3d(-3%, 0, 0); }
  100% { transform: translate3d(3%, -14px, 0); }
}

@keyframes fogDriftFront {
  0% { transform: translate3d(2%, 0, 0); }
  100% { transform: translate3d(-3%, 10px, 0); }
}

@media (prefers-reduced-motion: reduce) {
  .atmospheric-fog-layer.fog-deep,
  .atmospheric-fog-layer.fog-front {
    animation: none;
  }
}

.mountain-home #interactive-grid { visibility: hidden; }
.mountain-home .landing-title,
.mountain-home .landing-brand { color: #edf5f7; text-shadow: 0 2px 16px #10283d80; }
.mountain-home .landing-subtitle,
.mountain-home .landing-links a,
.mountain-home .landing-footer { color: #cfdee4; text-shadow: 0 1px 8px #10283d; }
.mountain-home .landing-links a:hover { color: #efba91; }
.mountain-home .category-panel { box-shadow: 0 12px 32px #081a2c55; border-color: #9abdc14d; }