/* tribeCast.org — Shared Styles */
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@300;400;500;600&display=swap');

html { background: #09090b; }
body {
  background: radial-gradient(circle at 30% -20%, #27272a 0%, #09090b 100%);
  background-attachment: fixed;
}

/* Entrance animations (IntersectionObserver) */
.motion-ready [data-entrance] {
  opacity: 0;
  filter: blur(10px);
  transform: translate3d(0, 20px, 0);
  transition: opacity 0.7s cubic-bezier(0.2, 0.7, 0.2, 1),
    filter 0.7s cubic-bezier(0.2, 0.7, 0.2, 1),
    transform 0.7s cubic-bezier(0.2, 0.7, 0.2, 1);
  transition-delay: var(--motion-delay, 0ms);
}
.motion-ready [data-entrance].is-visible {
  opacity: 1;
  filter: blur(0);
  transform: translate3d(0, 0, 0);
}
.motion-ready [data-reveal] {
  opacity: 0;
  filter: blur(8px);
  transition: opacity 0.65s ease, filter 0.65s ease;
  transition-delay: var(--motion-delay, 0ms);
}
.motion-ready [data-reveal].is-visible {
  opacity: 1;
  filter: blur(0);
}

/* Card breathing animation */
@keyframes card-breath {
  0%, 100% { filter: brightness(1) saturate(1); }
  50% { filter: brightness(1.08) saturate(1.08); }
}
@keyframes card-glow {
  0%, 100% { opacity: 0.06; }
  50% { opacity: 0.22; }
}
.card-loop {
  position: relative;
  isolation: isolate;
  animation: card-breath 6s ease-in-out infinite;
}
.card-loop::after {
  content: "";
  position: absolute;
  inset: -1px;
  border-radius: inherit;
  pointer-events: none;
  background: radial-gradient(80% 60% at 50% 0%, rgba(255, 69, 0, 0.14), transparent 72%);
  opacity: 0.08;
  animation: card-glow 6s ease-in-out infinite;
}

/* Activity bar animation */
[data-activity-bar] {
  width: 0;
  transition: width 1s cubic-bezier(0.4, 0, 0.2, 1);
}
[data-activity-bar].is-visible {
  width: var(--target-width);
}

/* Scrollbar hide */
.scrollbar-hide::-webkit-scrollbar { display: none; }
.scrollbar-hide { -ms-overflow-style: none; scrollbar-width: none; }

/* Scan-line overlay (reusable) */
.scan-lines {
  position: absolute;
  inset: 0;
  opacity: 0.04;
  pointer-events: none;
  mix-blend-mode: screen;
  background: repeating-linear-gradient(90deg, #fff, #fff 1px, transparent 1px, transparent 4px);
}

/* Step visibility for Apply form */
[data-step] { display: none; }
[data-step].active { display: block; }