/* Ссылки: inline (по умолчанию для a в base.css), навигационная, со стрелкой, ссылка-карточка. */

.op-link--nav {
  display: inline-flex;
  align-items: center;
  min-height: var(--hit-min);
  color: var(--color-text);
  font-weight: var(--font-weight-medium);
  text-decoration: none;
}

.op-link--nav:hover {
  color: var(--color-primary);
  text-decoration: underline;
}

/* Ссылка с иконкой-стрелкой: gap обязателен, иначе flex съедает пробел */
.op-link--arrow {
  display: inline-flex;
  align-items: center;
  min-height: var(--hit-min);
  gap: var(--space-2);
  font-weight: var(--font-weight-semibold);
}

/* Ссылка-карточка: кликабельна вся карточка (родитель — position: relative) */
.op-link--stretched {
  color: inherit;
  text-decoration: none;
}

.op-link--stretched::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
}

.op-link--stretched:hover {
  color: var(--color-primary);
  text-decoration: underline;
}

.op-link--stretched:focus-visible {
  outline: none;
}

.op-link--stretched:focus-visible::after {
  outline: var(--focus-width) solid var(--color-focus);
  outline-offset: calc(var(--focus-offset) * -1);
}