.accordion-item {
  border-top: 1px solid var(--theme-foreground-shade);
  transition: color var(--timing) var(--easing);
}
.accordion-item button {
  align-items: center;
  display: flex;
  padding: var(--space-12) 0;
  position: relative;
  text-align: left;
  width: 100%;
}
.accordion-item__title {
  flex-grow: 1;
}
.accordion-item__icon {
  --icon-size: 24px;
  height: var(--icon-size);
  position: relative;
  text-align: right;
  transition: transform 0.3s ease;
  width: var(--icon-size);
}
.accordion-item__icon .icon {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
}
.accordion-item__icon .expand {
  opacity: 1;
  transition: opacity 0.3s ease;
}
.accordion-item__icon .minimize {
  opacity: 0;
  transition: opacity 0.3s ease;
}
.accordion-item__animation-wrapper {
  display: grid;
  grid-template-rows: 0fr;
  position: relative;
  transition: grid-template-rows var(--timing) ease-out;
}
.accordion-item__animation-content {
  overflow: hidden;
}
.accordion-item__content {
  color: var(--theme-foreground-faded);
  -moz-column-gap: var(--grid-gap);
  column-gap: var(--grid-gap);
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  max-width: 60ch;
  opacity: 0;
  transition: opacity var(--timing) var(--easing);
}
.accordion-item__content ul,
.accordion-item__content > * {
  font-feature-settings: "liga" on;
  font-feature-settings: "ss12" on, "liga" on;
  -webkit-margin-before: var(--space-24);
  font-family: var(--text-sans);
  font-size: calc(var(--t-body-1-size) * 1px);
  font-size: calc(var(--t-body-1-size) / 390 * 100vw);
  font-variation-settings: "wght" var(--t-body-1-weight),
    "wdth" var(--t-body-1-width);
  grid-column: 1 / span 11;
  letter-spacing: var(--t-body-1-letter-spacing);
  line-height: calc(var(--t-body-1-line-height) * 1px);
  line-height: calc(var(--t-body-1-line-height) / var(--t-body-1-size));
  margin-block-start: var(--space-24);
}
@media (min-width: 640px) {
  .accordion-item__content ul,
  .accordion-item__content > * {
    font-size: calc(var(--t-body-1-size) / 640 * 100vw);
  }
}
@media (min-width: 1024px) {
  .accordion-item__content ul,
  .accordion-item__content > * {
    font-size: calc(var(--t-body-1-size) / 1024 * 100vw);
  }
}
@media (min-width: 1440px) {
  .accordion-item__content ul,
  .accordion-item__content > * {
    font-size: calc(var(--t-body-1-size) / 1440 * 100vw);
  }
}
@media (min-width: 1920px) {
  .accordion-item__content ul,
  .accordion-item__content > * {
    font-size: calc(var(--t-body-1-size) / 1920 * 100vw);
  }
}
.accordion-item__content ul:first-child,
.accordion-item__content > :first-child {
  -webkit-margin-before: 0;
  margin-block-start: 0;
}
.accordion-item--active .accordion-item__animation-wrapper {
  grid-template-rows: 1fr;
}
.accordion-item--active .accordion-item__icon {
  transform: rotate(-180deg);
}
.accordion-item--active .expand {
  opacity: 0;
}
.accordion-item--active .minimize {
  opacity: 1;
}
.accordion-item--active .accordion-item__content {
  font-feature-settings: "liga" on;
  font-feature-settings: "ss12" on, "liga" on;
  font-family: var(--text-sans);
  font-size: calc(var(--t-body-1-size) * 1px);
  font-size: calc(var(--t-body-1-size) / 390 * 100vw);
  font-variation-settings: "wght" var(--t-body-1-weight),
    "wdth" var(--t-body-1-width);
  letter-spacing: var(--t-body-1-letter-spacing);
  line-height: calc(var(--t-body-1-line-height) * 1px);
  line-height: calc(var(--t-body-1-line-height) / var(--t-body-1-size));
  opacity: 1;
  padding-bottom: var(--space-16);
}
@media (min-width: 640px) {
  .accordion-item--active .accordion-item__content {
    font-size: calc(var(--t-body-1-size) / 640 * 100vw);
  }
}
@media (min-width: 1024px) {
  .accordion-item--active .accordion-item__content {
    font-size: calc(var(--t-body-1-size) / 1024 * 100vw);
  }
}
@media (min-width: 1440px) {
  .accordion-item--active .accordion-item__content {
    font-size: calc(var(--t-body-1-size) / 1440 * 100vw);
  }
}
@media (min-width: 1920px) {
  .accordion-item--active .accordion-item__content {
    font-size: calc(var(--t-body-1-size) / 1920 * 100vw);
  }
}
.accordion-item--inactive {
  color: var(--theme-foreground-neutral);
  transition: color var(--timing) var(--easing);
}
.accordion-item--inactive .accordion-item__icon {
  border-color: var(--theme-foreground-neutral);
}
.accordion-item--inactive .accordion-item__icon:after,
.accordion-item--inactive .accordion-item__icon:before {
  background-color: var(--theme-foreground-neutral);
}
@media (min-width: 64rem) {
  .accordion-item button {
    padding: var(--space-16) 0;
  }
  .accordion-item__icon {
    --icon-size: 24px;
  }
  .accordion-item--active button {
    padding-bottom: var(--space-12);
  }
  .accordion-item--active .accordion-item__content {
    padding-bottom: var(--space-24);
  }
}
