/* Copyright 2025 Renofy Ltd. All rights reserved. */
/* === Simple Scroll Highlight System === */
.scroll-target {
  scroll-margin-top: 80px; /* Offset for headers */
  position: relative;
  transition: transform 0.4s ease, box-shadow 0.4s ease, border 0.4s ease;
}

/* Target any card element that gets highlighted */
.highlighted,
[class*="-card"].highlighted,
[class*="__panel"].highlighted {
  transform: translateY(-2px);
  box-shadow: 0 8px 25px rgba(215, 0, 92, 0.3);
  border: 2px solid var(--color-pink);
  border-radius: var(--radius-lg);
  animation: scroll-glow 0.6s ease-out;
  position: relative;
  z-index: 10;
}

@keyframes scroll-glow {
  0% {
    box-shadow: 0 0 0 rgba(215, 0, 92, 0);
    transform: scale(1);
  }
  50% {
    box-shadow: 0 0 30px rgba(215, 0, 92, 0.5);
    transform: scale(1.02);
  }
  100% {
    box-shadow: 0 8px 25px rgba(215, 0, 92, 0.3);
    transform: translateY(-2px);
  }
}

/* Mobile adjustments */
@media (max-width: 600px) {
  .scroll-target {
    scroll-margin-top: 60px;
  }

  .highlighted,
  [class*="-card"].highlighted,
  [class*="__panel"].highlighted {
    transform: translateY(-1px);
    box-shadow: 0 4px 20px rgba(215, 0, 92, 0.4);
    border: 2px solid var(--color-pink);
    border-left: none;
    border-right: none;
    border-radius: 0;
  }
}

/* Touch feedback */
@media (hover: none) and (pointer: coarse) {
  [onclick*="scroll"],
  .link--pink,
  .job-specification-card__name,
  .job-specification-card__value-badge {
    -webkit-tap-highlight-color: rgba(215, 0, 92, 0.1);
  }
}