@layer components {
  .checklist {
    display: flex;
    flex-direction: column;
    gap: .875rem;
    & li { display: flex; align-items: flex-start; gap: .9rem; }
    & svg {
      width: 1.1875rem;
      height: 1.1875rem;
      flex: none;
      margin-top: .1875rem;
      fill: none;
      stroke: var(--pw-success);
      stroke-width: 2;
      stroke-linecap: round;
      stroke-linejoin: round;
    }
    & span { color: var(--pw-fg-subtle); font-size: var(--pw-fs-md); font-weight: 300; line-height: 1.7; }
    & strong { color: var(--pw-fg-strong); font-weight: 400; }
  }
}