/* ============================================================
   VEEDA — coming-soon shells (Music / Merch / Tour / 404)
   Loads after base.css and stage.css.
   ============================================================ */

/* Ghost of the wordmark behind the headline */
.watermark {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -58%);
  width: min(92vw, 780px);
  height: auto;
  mix-blend-mode: screen;
  opacity: 0.09;
  animation: wm-flicker 9s linear infinite;
  pointer-events: none;
}

@keyframes wm-flicker {
  0%, 19%, 21%, 23%, 80%, 100% { opacity: 0.09; }
  20% { opacity: 0.055; }
  22% { opacity: 0.075; }
}

.whisper {
  font-size: clamp(0.72rem, 1.5vw, 0.82rem);
  font-weight: 300;
  letter-spacing: 0.14em;
  line-height: 1.9;
  color: rgba(239, 230, 221, 0.55);
  max-width: 30rem;
  opacity: 0;
  animation: whisper-in 0.9s ease-out 1.35s forwards;
}

@keyframes whisper-in {
  to { opacity: 1; }
}

.whisper a {
  color: var(--amber);
  text-decoration: none;
  border-bottom: 1px solid rgba(255, 157, 61, 0.4);
  padding-bottom: 1px;
  transition: border-color 0.3s ease, color 0.3s ease;
}

.whisper a:hover, .whisper a:focus-visible {
  color: #ffc07a;
  border-color: #ffc07a;
}

/* Slightly larger headline than the homepage — it carries the page */
.shell .headline { font-size: clamp(1.5rem, 5vw, 2.9rem); }

/* Per-page atmosphere shifts, same family */
body.merch {
  --glow-color: rgba(150, 115, 190, 0.36);
  --stage-tint: rgba(130, 96, 170, 0.22);
}

body.tour {
  --glow-color: rgba(215, 72, 22, 0.42);
  --stage-tint: rgba(205, 78, 20, 0.28);
}

@media (prefers-reduced-motion: reduce) {
  .watermark { animation: none; opacity: 0.09; }
  .whisper { animation: none; opacity: 1; }
}