/* A luminous sweep runs only while the contact details are visible. */
#contact.contact {
  background: #040e20;
  isolation: isolate;
}
#contact.contact::before {
  /* Override the former image before it becomes a rendered background. */
  background: none;
}
.contact-halo {
  position: absolute;
  inset: 0;
  z-index: -1;
  overflow: hidden;
  pointer-events: none;
  background:
    radial-gradient(ellipse at 87% 83%, #0c3c5a70, transparent 57%),
    linear-gradient(125deg, #040e20, #07162b 67%, #071e32);
}
.contact-halo::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, #040e2099, #040e2033 50%, transparent 80%);
  pointer-events: none;
}
.contact-halo-art {
  position: absolute;
  width: clamp(980px, 88vw, 1480px);
  height: auto;
  aspect-ratio: 1;
  max-width: none;
  top: 60px;
  right: clamp(-360px, -18vw, -180px);
  overflow: visible;
}
.contact-halo-atmosphere { opacity: .52; }
.contact-halo-rest { opacity: .7; }
.contact-halo-sweep { opacity: 0; }
#contact .contact-halo .contact-halo-sweep {
  /* The existing mobile reset intentionally stops transforms elsewhere. */
  transform: rotate(var(--contact-light-turn, 85deg)) !important;
  transform-origin: 50% 50%;
  transform-box: view-box;
}
#contact.contact-light-running .contact-halo-sweep {
  will-change: transform, opacity;
}
#contact.contact-light-running .contact-halo-atmosphere {
  will-change: opacity;
}
#contact .contact-grid,
#contact > .footer { position: relative; z-index: 1; }
/* The old photograph needed broad dark scrims. Keep the new light clear. */
#contact .contact-grid > div:first-child::before,
#contact .contact-details::before,
#contact .footer::before { display: none; }
@media (min-width: 761px) {
  .contact-halo-art { top: 210px; }
  /* Reuse the same six sweep shapes; wider screens get a prismatic white core.
     Fixed soft edges on desktop only; no extra animated nodes or blend passes. */
  .contact-halo-rest > circle:nth-child(1) { stroke: url(#hanyoung-contact-prism-rest); stroke-width: 74; opacity: .075; filter: blur(10px); }
  .contact-halo-rest > circle:nth-child(2) { stroke: url(#hanyoung-contact-prism-rest); stroke-width: 34; opacity: .22; filter: blur(4px); }
  .contact-halo-rest > circle:nth-child(3) { stroke: url(#hanyoung-contact-prism-rest); stroke-width: 14; opacity: .55; filter: blur(1.5px); }
  .contact-halo-rest > circle:nth-child(4) { stroke-width: 7.5; opacity: .96; }
  .contact-halo-sweep > circle:nth-child(1) { stroke: url(#hanyoung-contact-prism); stroke-width: 76; opacity: .19; filter: blur(12px); }
  .contact-halo-sweep > circle:nth-child(2) { stroke: url(#hanyoung-contact-prism); stroke-width: 38; opacity: .7; filter: blur(5px); }
  .contact-halo-sweep > circle:nth-child(3) { stroke: url(#hanyoung-contact-prism-core); stroke-width: 22; opacity: .8; filter: blur(2px); }
  .contact-halo-sweep > circle:nth-child(4) { stroke: url(#hanyoung-contact-prism-core); stroke-width: 12; }
  .contact-halo-sweep > circle:nth-child(5) { stroke: #fff; stroke-width: 20; }
  .contact-halo-sweep > circle:nth-child(6) { stroke: #ffd5b4; stroke-width: 4; opacity: .75; }
}
@media (max-width: 760px) {
  .contact-halo-art { width: 1040px; right: -540px; top: 135px; }
  .contact-halo::after {
    background: linear-gradient(180deg, #040e2066, #040e2033 53%, #040e2066);
  }
}
@media (max-width: 380px) {
  .contact-halo-art { right: -565px; }
}
@media (prefers-reduced-motion: reduce) {
  html:not(.motion-override) #contact .contact-halo-sweep { opacity: 0 !important; }
}
@media print {
  #contact.contact { background: white; }
  .contact-halo { display: none; }
}
