/* Roughdraft Studio — motion + reveal layer (loads after styles.css) */

/* soft ambient glow behind hero */
.hero::before {
  content: ""; position: absolute; inset: -20% -10% 40% 30%; z-index: -1; filter: blur(10px); pointer-events: none;
  background:
    radial-gradient(48% 52% at 78% 22%, rgba(201, 162, 91, .20), transparent 70%),
    radial-gradient(42% 46% at 40% 60%, rgba(35, 43, 33, .10), transparent 72%);
  animation: floatbg 22s var(--ease) infinite alternate;
}
@keyframes floatbg { to { transform: translate3d(0, -22px, 0) scale(1.05); } }
.status-dot { animation: pulse 2.6s ease-in-out infinite; }
@keyframes pulse { 0%, 100% { box-shadow: 0 0 0 4px rgba(123,154,109,.16); } 50% { box-shadow: 0 0 0 8px rgba(123,154,109,.05); } }

/* header gains a hairline + shadow once scrolled */
.site-header.scrolled { border-bottom-color: var(--line); box-shadow: 0 10px 30px -24px rgba(23,21,15,.5); background: color-mix(in srgb, var(--paper) 94%, transparent); }

/* scroll reveals */
[data-reveal] { opacity: 0; transform: translateY(26px); transition: opacity .8s var(--ease), transform .8s var(--ease); will-change: opacity, transform; }
[data-reveal].in { opacity: 1; transform: none; }
[data-stagger] > * { opacity: 0; transform: translateY(22px); transition: opacity .65s var(--ease), transform .65s var(--ease); }
[data-stagger].in > * { opacity: 1; transform: none; }
[data-stagger].in > *:nth-child(2) { transition-delay: .06s; }
[data-stagger].in > *:nth-child(3) { transition-delay: .12s; }
[data-stagger].in > *:nth-child(4) { transition-delay: .18s; }
[data-stagger].in > *:nth-child(5) { transition-delay: .24s; }
[data-stagger].in > *:nth-child(6) { transition-delay: .30s; }

@media (prefers-reduced-motion: reduce) {
  .hero::before, .status-dot { animation: none; }
  [data-reveal], [data-stagger] > * { opacity: 1; transform: none; transition: none; }
}