.intro-pending body { overflow: hidden; }

.site-intro {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: none;
  place-items: center;
  overflow: hidden;
  background: #000;
  color: #ffffff;
}

.intro-pending .site-intro { display: grid; }
.site-intro::before, .site-intro::after { position: absolute; inset: 0; content: ""; pointer-events: none; }
.site-intro::before { background: linear-gradient(rgba(255,255,255,0.055) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,0.055) 1px, transparent 1px); background-size: 42px 42px; }
.site-intro::after { background: radial-gradient(circle at center, transparent 0 12%, rgba(0,0,0,0.18) 26%, rgba(0,0,0,0.88) 70%); }

.site-intro-hud { position: absolute; inset: 0; z-index: 0; display: grid; place-items: center; overflow: hidden; perspective: 1100px; }
.hud-ring, .hud-crosshair, .hud-sweep { position: absolute; border: 1px solid rgba(255, 255, 255, 0.42); border-radius: 50%; transform-style: preserve-3d; }
.hud-ring-one { width: min(92vw, 970px); aspect-ratio: 1; border-style: dashed; animation: hud-spin 14s linear infinite; }
.hud-ring-two { width: min(67vw, 710px); aspect-ratio: 1; border-color: rgba(255, 255, 255, 0.24); transform: rotateX(66deg) rotateZ(15deg); animation: hud-tilt 7s ease-in-out infinite; }
.hud-ring-three { width: min(46vw, 490px); aspect-ratio: 1; border-width: 2px; border-color: rgba(255, 255, 255, 0.58); box-shadow: 0 0 50px rgba(255, 255, 255, 0.14), inset 0 0 44px rgba(255, 255, 255, 0.1); animation: hud-pulse 1.65s ease-in-out infinite; }
.hud-crosshair { width: min(87vw, 910px); aspect-ratio: 1; border-color: rgba(255, 255, 255, 0.18); }
.hud-crosshair::before, .hud-crosshair::after { position: absolute; top: 50%; left: -6%; width: 112%; height: 1px; content: ""; background: linear-gradient(90deg, transparent, rgba(255,255,255,0.5), transparent); }
.hud-crosshair::after { top: -6%; left: 50%; width: 1px; height: 112%; }
.hud-sweep { width: min(74vw, 780px); aspect-ratio: 1; border: 0; background: conic-gradient(from 0deg, transparent 0 76%, rgba(255,255,255,0.3) 84%, transparent 92%); mix-blend-mode: screen; animation: hud-spin 3.4s linear infinite; }
.hud-corner { position: absolute; width: 34px; height: 34px; border-color: rgba(255,255,255,0.68); animation: hud-corner 1.8s ease-in-out infinite alternate; }
.hud-corner-tl { top: 7%; left: 6%; border-top: 1px solid; border-left: 1px solid; }.hud-corner-tr { top: 7%; right: 6%; border-top: 1px solid; border-right: 1px solid; }.hud-corner-bl { bottom: 7%; left: 6%; border-bottom: 1px solid; border-left: 1px solid; }.hud-corner-br { right: 6%; bottom: 7%; border-right: 1px solid; border-bottom: 1px solid; }
.site-intro-readout { position: absolute; top: clamp(1.2rem, 4vw, 3.5rem); left: clamp(1.2rem, 4vw, 3.5rem); right: clamp(1.2rem, 4vw, 3.5rem); z-index: 2; display: flex; justify-content: space-between; gap: 1rem; color: rgba(255,255,255,0.78); font: 700 0.56rem/1 "Manrope", sans-serif; letter-spacing: 0.16em; animation: hud-readout 1s steps(2, end) infinite; }

.site-intro-blueprint {
  position: relative;
  z-index: 1;
  width: min(82vw, 720px);
  text-align: center;
  transform-origin: 50% 53.3%;
  animation: lens-flight 2s cubic-bezier(0.75, 0.02, 0.28, 1) forwards, blueprint-glitch 0.7s steps(2, end) 0.12s 2;
}

.site-intro-blueprint svg { display: block; width: 100%; height: auto; filter: drop-shadow(0 0 13px rgba(255,255,255,0.32)); }
.site-intro-blueprint svg path, .site-intro-blueprint svg circle { fill: none; stroke: currentColor; stroke-width: 2; vector-effect: non-scaling-stroke; }
.site-intro-blueprint .blueprint-grid { opacity: 0.16; }
.site-intro-blueprint .camera-body { opacity: 0.78; }
.site-intro-blueprint .camera-lens { opacity: 0.95; }
.site-intro-blueprint .blueprint-measure { opacity: 0.55; }
.site-intro-blueprint text { fill: currentColor; font: 500 16px/1 monospace; letter-spacing: 0.08em; }
.site-intro-blueprint p { margin: -2.8rem 0 0; font: 500 0.62rem/1.4 "Manrope", sans-serif; letter-spacing: 0.22em; }

.site-intro-skip { position: absolute; right: clamp(1rem,3vw,2.5rem); bottom: clamp(1rem,3vw,2.5rem); z-index: 3; border: 0; background: rgba(255,255,255,0.08); color: rgba(255,255,255,0.78); cursor: pointer; padding: 0.55rem 0.7rem; font: 600 0.58rem/1 "Manrope", sans-serif; letter-spacing: 0.14em; backdrop-filter: blur(12px); }
.site-intro-exit-grid { position: absolute; inset: 0; z-index: 10; display: grid; grid-template-columns: repeat(6, 1fr); grid-template-rows: repeat(4, 1fr); opacity: 0; pointer-events: none; }
.site-intro-exit-grid span { background: #000; box-shadow: inset 0 0 0 0.5px rgba(255,255,255,0.035); transform: scale(1.03); transform-origin: center; }
.site-intro.is-exiting { background: transparent; }
.site-intro.is-exiting::before,
.site-intro.is-exiting::after,
.site-intro.is-exiting .site-intro-hud,
.site-intro.is-exiting .site-intro-blueprint,
.site-intro.is-exiting .site-intro-readout,
.site-intro.is-exiting .site-intro-skip { opacity: 0; transition: opacity 90ms ease; }
.site-intro.is-exiting .site-intro-exit-grid { opacity: 1; }
.site-intro.is-exiting .site-intro-exit-grid span { animation: mosaic-release 360ms cubic-bezier(0.65, 0, 0.35, 1) calc(var(--sequence) * 13ms) forwards; }

@keyframes lens-flight { 0% { opacity: 0; transform: scale(0.55) rotateX(14deg); } 18% { opacity: 1; transform: scale(0.83) rotateX(0); } 57% { opacity: 1; transform: scale(1); } 76% { opacity: 1; transform: scale(1.1); } 100% { opacity: 0; transform: scale(18) rotateZ(8deg); } }
@keyframes mosaic-release { 0% { opacity: 1; transform: scale(1.03) rotate(0); filter: blur(0); } 65% { opacity: 0.72; } 100% { opacity: 0; transform: scale(0.05) rotate(var(--twist)); filter: blur(5px); } }
@keyframes hud-spin { to { transform: rotate(360deg); } }
@keyframes hud-tilt { 50% { transform: rotateX(72deg) rotateZ(-18deg) scale(1.08); } }
@keyframes hud-pulse { 50% { transform: scale(1.13); opacity: 0.35; } }
@keyframes hud-corner { to { transform: scale(1.45); opacity: 0.38; } }
@keyframes hud-readout { 50% { opacity: 0.38; } }
@keyframes blueprint-glitch { 25% { translate: 3px -1px; } 50% { translate: -2px 1px; } 75% { translate: 1px 2px; } }

@media (max-width: 620px) { .site-intro-blueprint { width: 112vw; } .site-intro-blueprint p { margin-top: -1.8rem; } .site-intro-readout span:nth-child(2) { display: none; } .hud-ring-one, .hud-crosshair { width: 126vw; } .hud-ring-two { width: 96vw; } .hud-ring-three { width: 68vw; } .hud-sweep { width: 110vw; } }
@media (prefers-reduced-motion: reduce) { .site-intro-blueprint { animation: none; opacity: 1; transform: scale(0.92); } .site-intro.is-exiting { opacity: 0; transition: opacity 100ms ease; } .site-intro-exit-grid { display: none; } .hud-ring, .hud-sweep, .hud-corner, .site-intro-readout { animation: none; } }