/* ── Section 3 entrance: developing out of the light ── */
.contact-intro.s3-ready { --dev: 0; }
.contact-intro.s3-ready .intro-image { overflow: hidden; }
.contact-intro.s3-ready .intro-image img {
  /* The veil carries the entrance; keep the full-resolution photograph unfiltered. */
  filter: none !important;
  scale: 1;
}
/* Warm-white veil in the exact tone of the eye journey's white-out; it lifts as the frame develops */
.contact-intro.s3-ready .s3-veil {
  display: block;
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: #fffaf0;
  opacity: clamp(0, calc(1.1 - 1.7 * var(--dev)), 1);
}
.contact-intro.s3-ready.s3-done .s3-veil { display: none; }
.contact-intro.s3-ready .newspaper-trigger { z-index: 2; }

/* Headline: each line rises from behind a mask */
.contact-intro .s3-line { display: block; overflow: hidden; padding-bottom: .06em; margin-bottom: -.06em; }
.contact-intro.s3-ready .s3-line > span {
  display: block;
  transform: translateY(108%);
  transition: transform 1s var(--k-ease, cubic-bezier(.16, 1, .3, 1));
  transition-delay: calc(var(--i) * .12s + .05s);
}
.contact-intro.s3-ready.s3-in .s3-line > span { transform: none; }

/* Copy, links and buttons follow in sequence */
.contact-intro.s3-ready .s3-rise {
  opacity: 0;
  translate: 0 var(--k-rise, 20px);
  transition: opacity var(--k-dur, .9s) ease, translate var(--k-dur, .9s) var(--k-ease, cubic-bezier(.16, 1, .3, 1));
  transition-delay: calc(.25s + var(--i) * var(--k-stagger, .08s));
}
.contact-intro.s3-ready.s3-in .s3-rise { opacity: 1; translate: 0 0; }

/* A single streak of light crosses the frame as it lands */
.s3-streak {
  position: absolute;
  left: 0; right: 0; top: 46%;
  height: 1px;
  z-index: 3;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(255, 244, 222, .0) 10%, rgba(255, 244, 222, .95) 50%, rgba(255, 244, 222, 0) 90%, transparent);
  box-shadow: 0 0 18px 2px rgba(255, 236, 200, .55);
  opacity: 0;
  transform: scaleX(0);
}
.contact-intro.s3-ready.s3-in .s3-streak { animation: s3-streak 1.4s cubic-bezier(.2, .8, .2, 1) .1s both; }
@keyframes s3-streak {
  0% { opacity: 0; transform: scaleX(0); }
  35% { opacity: 1; }
  100% { opacity: 0; transform: scaleX(1.25); }
}
@media (max-width: 800px) { .s3-streak { top: 34svh; } }

@media all {
  :where(html[data-koan-motion="reduced"]) .contact-intro .s3-line > span, :where(html[data-koan-motion="reduced"]) .contact-intro.s3-ready .s3-rise { transform: none; opacity: 1; translate: none; transition: none; }
  :where(html[data-koan-motion="reduced"]) .s3-streak { display: none; }
}
/* Section 3 handles its own entrance on vertical screens: skip the generic section dim/blur */
#interview.s3-ready { opacity: 1 !important; filter: none !important; }
#interview.s3-ready .intro-copy, #interview.s3-ready .intro-image { filter: none !important; }
/* Keep the whole next frame covered during the white handoff. */
.contact-intro:not(.s3-ready) .s3-veil, .contact-intro:not(.s3-ready) .s3-streak { display: none; }
.contact-intro.s3-ready .s3-veil-full { z-index: 4; display: block; }
  .contact-intro.s3-ready .intro-image .s3-veil { display: none; }
.contact-intro.s3-ready.s3-done .s3-veil-full { display: none; }
