/*
 * All Services page: card hover effects (dark theme)
 * - Reuses global .service-card structure
 * - Adds tasteful motion, brand border + arrow nudge on hover/focus
 */

.hero--services{
  background: linear-gradient(120deg,#1a1f29,#101620);
}

/* Make entire card a link (block anchor inside) */
.svc-card .svc-card__link{
  display:block;
  text-decoration:none;
  color:inherit;
}

/* Hover effects on the card */
.svc-card{
  position:relative;
  overflow:hidden;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease;
}
.svc-card::after{
  /* subtle angled sheen from brand color */
  content:"";
  position:absolute; inset:auto -30% 60% -30%;
  background: radial-gradient(60% 60% at 50% 50%, rgba(220,38,38,.10), transparent 70%);
  transform: translateY(20px) rotate(-6deg);
  transition: opacity .18s ease, transform .18s ease;
  opacity:.0; pointer-events:none;
}

.svc-card:hover,
.svc-card:focus-within{
  transform: translateY(-4px);
  border-color: var(--brand);
  box-shadow: 0 14px 28px rgba(0,0,0,.35), 0 4px 10px rgba(0,0,0,.40);
  background:#151c26;
}
.svc-card:hover::after,
.svc-card:focus-within::after{
  opacity: .7;
  transform: translateY(0) rotate(-6deg);
}

/* Title + CTA */
.svc-card__title{
  margin:.25rem 0 .25rem;
  font-size:1.125rem;
  color: var(--ink);
}
.svc-card__cta{
  display:inline-flex; align-items:center; gap:.4rem;
  margin-top:.35rem; font-weight:600;
  color: var(--ink); text-decoration:none;
}
.svc-card__link:hover .svc-card__cta,
.svc-card__link:focus .svc-card__cta{
  color:#fff;
}

.svc-card__arrow{
  display:inline-block; transition: transform .18s ease;
}
.svc-card:hover .svc-card__arrow,
.svc-card:focus-within .svc-card__arrow{
  transform: translateX(4px);
}

/* Accessible focus ring on the link inside the card */
.svc-card .svc-card__link:focus-visible{
  outline:2px solid var(--brand);
  outline-offset:3px;
  border-radius:.6rem;
}