.dsa-content-nav {
  --dsa-content-nav--padding: var(--ks-spacing-inset-m);
  --dsa-content-nav--background-color: var(--ks-background-color-card);
  --dsa-content-nav--gap: var(--ks-spacing-stack-m);
  --dsa-content-nav--border: var(--ks-border-card);
  --dsa-content-nav--border-radius: var(--ks-border-radius-card);
  --dsa-content-nav__topic--font: var(--dsa-topic--font);
  --dsa-content-nav__topic--font-weight: var(--dsa-topic--font-weight);
  --dsa-content-nav__topic--color: var(--dsa-topic--color);
  --dsa-content-nav__image--aspect-ratio: 16 / 9;
  --dsa-content-nav__image--border-radius: var(--ks-border-radius-card);
  --dsa-content-nav__links--gap: var(--ks-spacing-stack-xs);
  --dsa-content-nav__link--color: var(--ks-text-color-interface-interactive);
  --dsa-content-nav__link--color_hover: var(--ks-text-color-interface-interactive-hover);
  --dsa-content-nav__link--icon-size: 1.25em;
  --dsa-content-nav__toggle-more--font: var(--ks-font-interface-m);
  --dsa-content-nav__toggle-more--font-weight: var(--dsa-link--font-weight);
  --dsa-content-nav__toggle-more--color: var(--dsa-link--color);
  --dsa-content-nav__toggle-more--margin-top: var(--ks-spacing-stack-xs);
}

.dsa-content-nav {
  border-radius: var(--dsa-content-nav--border-radius, var(--ks-border-radius-card));
  padding: var(--dsa-content-nav--padding, var(--ks-spacing-inset-m));
  display: flex;
  flex-wrap: wrap;
  background-color: var(--dsa-content-nav--background-color, var(--ks-background-color-card));
  gap: var(--dsa-content-nav--gap, var(--ks-spacing-stack-m));
  border: var(--dsa-content-nav--border, var(--ks-border-card));
}
.dsa-content-nav__topic {
  font: var(--dsa-content-nav__topic--font, var(--dsa-topic--font));
  color: var(--dsa-content-nav__topic--color, var(--dsa-topic--color));
  font-weight: var(--dsa-content-nav__topic--font-weight, var(--dsa-topic--font-weight));
}
.dsa-content-nav__image {
  flex-basis: var(--dsa-content-nav__image--width, var(--dsa-tile--width_largest));
}
.dsa-content-nav__image img {
  aspect-ratio: var(--dsa-content-nav__image--aspect-ratio, 16/9);
  object-fit: cover;
  border-radius: var(--dsa-content-nav__image--border-radius, var(--ks-border-radius-card));
}
.dsa-content-nav__links {
  display: flex;
  flex-direction: column;
  gap: var(--dsa-content-nav__links--gap, var(--ks-spacing-stack-xs));
}
.dsa-content-nav__links--initial {
  margin-top: var(--dsa-content-nav__links--margin-top, var(--ks-spacing-stack-s));
}
.dsa-content-nav__links--more {
  margin-top: var(--dsa-content-nav__links--gap, var(--ks-spacing-stack-xs));
}
.dsa-content-nav__link {
  --g-link--color: var(--dsa-content-nav__link--color, var(--ks-text-color-interface-interactive));
  --g-link--color-hover: var(--dsa-content-nav__link--color_hover, var(--ks-text-color-interface-interactive-hover));
  font: var(--ks-font-interface-m);
  width: fit-content;
  display: flex;
  align-items: center;
}
.dsa-content-nav__link .icon {
  width: var(--dsa-content-nav__link--icon-size, 1.25em);
  height: var(--dsa-content-nav__link--icon-size, 1.25em);
}
.dsa-content-nav__link--active {
  font-weight: var(--ks-font-weight-bold);
  color: var(--ks-color-text-active);
}
.dsa-content-nav__more-content {
  display: grid;
  grid-template-rows: 0fr;
  transition: var(--ks-transition-collapse);
}
.dsa-content-nav__more-content .dsa-content-nav__links {
  overflow: hidden;
}
.dsa-content-nav__more {
  display: flex;
  flex-direction: column;
}
.dsa-content-nav__more[open] .dsa-content-nav__more-content {
  grid-template-rows: 1fr;
}
.dsa-content-nav__more[open] .dsa-content-nav__toggle-label--more {
  display: none;
}
.dsa-content-nav__more[open] .dsa-content-nav__toggle-label--less {
  display: block;
}
.dsa-content-nav__more[open] .dsa-content-nav__toggle-more .icon {
  transform: rotate(180deg);
}
.dsa-content-nav__toggle-more {
  width: fit-content;
  order: 2;
  color: var(--dsa-content-nav__toggle-more--color, var(--dsa-link--color));
  cursor: pointer;
  font: var(--dsa-content-nav__toggle-more--font, var(--ks-font-interface-m));
  font-weight: var(--dsa-content-nav__toggle-more--font-weight, var(--dsa-link--font-weight));
  display: flex;
  align-items: center;
  gap: calc(var(--ks-spacing-xxs) * 0.25);
  transition: var(--ks-transition-hover);
  margin-top: var(--dsa-content-nav__toggle-more--margin-top, var(--ks-spacing-stack-xs));
}
.dsa-content-nav__toggle-more:hover {
  color: var(--dsa-link--color_hover);
}
.dsa-content-nav__toggle-more .icon {
  transition: var(--ks-transition-collapse);
  transform: translateY(0.05em);
  font-size: inherit;
  color: inherit;
  width: 1.25em;
  height: 1.25em;
}
.dsa-content-nav__toggle-label--more {
  display: block;
}
.dsa-content-nav__toggle-label--less {
  display: none;
}
.dsa-content-nav .c-button {
  width: fit-content;
}