/* =========================
   ARCANE NAV ATMOSPHERE
   ========================= */

/* =========================
   NAV CONTAINER FIELD
   ========================= */

.nav {
  position: relative;
  isolation: isolate;
  z-index: 2;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 20px;
  flex-wrap: nowrap;
}

/* =========================
   NAV BUTTON BASE STATE
   ========================= */

.nav a {
  position: relative;
  z-index: 3;

  display: inline-block;

  text-decoration: none;

  transition: transform 0.25s ease, filter 0.25s ease;
}

/* =========================
   BUTTON ARCANE GLOW (SUBTLE BASE)
   ========================= */

.nav a::after {
  content: "";

  position: absolute;
  inset: -10px;

  background: radial-gradient(
    circle at center,
    rgba(232, 221, 201, 0.18),
    transparent 70%
  );

  opacity: 0;

  transform: scale(0.9);

  transition: opacity 0.25s ease, transform 0.25s ease;

  z-index: -1;

  filter: blur(6px);

  mix-blend-mode: screen;
}

/* =========================
   HOVER STATE (ACTIVATION)
   ========================= */

.nav a:hover {
  transform: translateY(-3px) scale(1.02);
  filter: brightness(1.1);
}

.nav a:hover::after {
  opacity: 1;
  transform: scale(1.2);
}

/* =========================
   CAROUSEL ATMOSPHERE
   ========================= */

.carousel::before {
  content: "";
  position: absolute;
  inset: -100px;

  background:
    radial-gradient(circle at center, rgba(0,0,0,0.8), transparent 70%),
    radial-gradient(circle at 50% 80%, rgba(232,221,201,0.08), transparent 70%);

  filter: blur(40px);
  z-index: 0;
}

/* center item glow */
.carousel-item.active img {
  box-shadow:
    0 0 40px rgba(232,221,201,0.2),
    0 0 80px rgba(0,0,0,0.8);
}

/* subtle breathing */
.carousel-item.active {
  animation: pulse 4s ease-in-out infinite;
  }

@keyframes pulse {
  0%,100% { 
  transform: transalateX(-50%) scale(1); 
  }
  50% { 
  transform: translateX(-50%) scale(1.03); 
  }
}

.newsletter-inner {
  transition: transform 0.4s ease, box-shadow 0.4s ease;
}

.newsletter-inner:hover {
  transform: scale(1.02);
  box-shadow: 0 0 40px rgba(232, 221, 201, 0.08);
}