/* Technique page (feedback 28.10.) shares the look of the Knowledge Base detail pages: title left in the header,
   narrow text column with the same typography; below the content the list "Used in" */
@import url("guide.css");

.technique-used { margin-top: 3rem; padding-top: 2rem; border-top: 1px solid var(--color-light-border); }
.kb-prose:empty + .technique-used,
.technique-used:first-child { margin-top: 0; padding-top: 0; border-top: 0; }
.technique-used__title { margin: 0 0 1.25rem; font-size: var(--fs-h3); font-weight: 600; line-height: 1.3; color: #0f172a; }
.technique-used__group + .technique-used__group { margin-top: 1.25rem; }
.technique-used__label {
  margin: 0 0 0.6rem;
  font-size: var(--fs-small);
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--color-text-secondary);
}
.technique-used__list { display: flex; flex-wrap: wrap; gap: 0.5rem 0.6rem; margin: 0; padding: 0; list-style: none; }
.technique-used__link {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.35rem 0.9rem;
  border: 1px solid var(--color-light-border);
  border-radius: 999px;
  font-size: var(--fs-small);
  font-weight: 500;
  color: #0f172a;
  text-decoration: none;
  transition: border-color 0.2s, color 0.2s;
}
.technique-used__link .icon { flex: none; color: var(--color-primary); transition: transform 0.2s; }
.technique-used__link:hover,
.technique-used__link:focus-visible { border-color: var(--color-primary); color: var(--color-primary); text-decoration: none; }
.technique-used__link:hover .icon { transform: translateX(3px); }
