/* ── INTRO OVERLAY ── */
.intro {
  position: fixed;
  inset: 0;
  z-index: 1000;
  background: var(--ink);
  display: grid;
  place-items: center;
  transition: opacity 0.7s var(--ease-cinema), visibility 0.7s;
}
.intro--pullback {
  animation: intro-pullback 1.1s var(--ease-cinema) forwards;
}
.intro--gone {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
@keyframes intro-pullback {
  0%   { clip-path: inset(0 0 0 0); opacity: 1; }
  100% { clip-path: inset(0 50% 0 50%); opacity: 0; }
}

/* ── WALL (inside the intro) ── */
.intro__wall {
  position: relative;
  width: min(600px, 88vw);
  display: grid;
  place-items: center;
}

/* ── PAINT CANVAS AREA ── */
.intro__paint {
  width: 100%;
  position: relative;
  min-height: 60px;
}
.intro__paint svg {
  display: block;
  width: 100%;
  height: auto;
  filter: drop-shadow(0 0 24px rgba(255,249,249,0.25));
}

/* ── OVERSPRAY DOTS ── */
.overspray {
  position: absolute;
  border-radius: 50%;
  background: var(--bone);
  opacity: 0.55;
  pointer-events: none;
  animation: fade-dot 0.9s ease-out forwards;
}
@keyframes fade-dot {
  0%   { opacity: 0.55; transform: scale(1); }
  100% { opacity: 0; transform: scale(2.5); }
}