/* ==========================================================================
   Related / explore link cards — site interconnection
   ========================================================================== */

.nn .nn-related__grid {
  display: grid;
  gap: 14px;
  grid-template-columns: 1fr;
}

@media (min-width: 700px) {
  .nn .nn-related__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
}

@media (min-width: 1000px) {
  .nn .nn-related__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

.nn .nn-related__card {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 7px;
  padding: 26px 26px 54px;
  background: var(--nn-paper);
  border: 1px solid var(--nn-line);
  border-radius: var(--nn-radius-lg);
  text-decoration: none;
  transition: transform 220ms var(--nn-ease),
              box-shadow 220ms var(--nn-ease),
              border-color 220ms var(--nn-ease);
}

.nn .nn-related__card:hover {
  transform: translateY(-3px);
  border-color: rgba(30, 63, 196, 0.32);
  box-shadow: var(--nn-shadow-md);
}

.nn .nn-related__tag {
  font-family: var(--nn-sans);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--nn-terra-text);
}

.nn .nn-related__title {
  font-family: var(--nn-serif);
  font-size: 25px;
  line-height: 1.12;
  letter-spacing: -0.015em;
  color: var(--nn-ink);
}

.nn .nn-related__text {
  font-family: var(--nn-sans);
  font-size: 14.5px;
  line-height: 1.6;
  color: var(--nn-ink-soft);
}

.nn .nn-related__go {
  position: absolute;
  left: 26px;
  bottom: 22px;
  display: inline-flex;
  align-items: center;
  color: var(--nn-cobalt);
}

.nn .nn-related__card:hover .nn-arrow {
  transform: translateX(4px);
}

.nn .nn-related__go .nn-arrow {
  transition: transform 220ms var(--nn-ease);
}

@media (prefers-reduced-motion: reduce) {
  .nn .nn-related__card,
  .nn .nn-related__go .nn-arrow { transition: none; }
  .nn .nn-related__card:hover { transform: none; }
}