/* ─── Engineering Overlay ──────────────────────────────────────────────────── */

#eng-overlay {
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 9998;
}

#eng-right {
  position: absolute;
  right: 3px;
  top: 0;
  width: 1px;
  height: 100%;
  background: rgba(255, 255, 255, 0.08);
}

#eng-bottom {
  position: absolute;
  bottom: 3px;
  left: 0;
  width: 100%;
  height: 1px;
  background: rgba(255, 255, 255, 0.08);
}

/* Fixed end ticks */
.eng-tick {
  position: absolute;
  background: rgba(255, 255, 255, 0.22);
}

/* Right line — horizontal ticks at top & bottom */
#eng-right .eng-tick.top    { top: 0;    left: -6px; width: 13px; height: 1px; }
#eng-right .eng-tick.bottom { bottom: 0; left: -6px; width: 13px; height: 1px; }

/* Bottom line — vertical ticks at left & right */
#eng-bottom .eng-tick.left  { left: 0;  top: -6px; width: 1px;  height: 13px; }
#eng-bottom .eng-tick.right { right: 0; top: -6px; width: 1px;  height: 13px; }

/* Cursor-tracking markers */
.eng-tracker {
  position: absolute;
  background: rgba(255, 255, 255, 0.55);
}

/* Slides vertically on right line */
#eng-y-tracker { top: 0; left: -6px; width: 13px; height: 1px; }

/* Slides horizontally on bottom line */
#eng-x-tracker { left: 0; top: -6px; width: 1px; height: 13px; }

/* Mobile: move bottom line up, shorter ticks */
@media (max-width: 1023px) {
  #eng-bottom { bottom: 103px; }

  /* Cap all tick lengths at 5px, re-center on their line */
  #eng-right .eng-tick.top,
  #eng-right .eng-tick.bottom,
  #eng-y-tracker              { left: -2px; width: 5px; }

  #eng-bottom .eng-tick.left,
  #eng-bottom .eng-tick.right,
  #eng-x-tracker              { top: -2px; height: 5px; }
}

/* ─── Image hover expand ────────────────────────────────────────────────────── */

.img-expand {
  transform: scale(0.95);
  transition: transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
}
.img-expand:hover {
  transform: scale(1);
}

/* ─── Mobile Image Colorisation ─────────────────────────────────────────────── */

@media (max-width: 1023px) {
  /* Ensure filter transitions smoothly for all images (including gallery images
     that don't carry Tailwind transition classes) */
  img { transition: filter 0.5s ease; }
}