.guides-landing .ac-collection-introduction {
  margin-top: 42px;
  border-top: 1px solid currentColor;
}

.ac-guide-directory {
  display: grid;
  grid-template-columns: minmax(0, 31fr) minmax(0, 61fr);
  column-gap: 8%;
  row-gap: 56px;
  padding-block: 64px 72px;
}

.ac-guide-directory h2,
.ac-guide-closing h2 {
  margin: 0;
  font-size: clamp(26px, 3vw, 38px);
  font-weight: 500;
  line-height: 1.12;
  letter-spacing: -.035em;
  text-wrap: pretty;
}

.ac-guide-directory ul {
  margin: 0;
  padding: 0;
  list-style: none;
  border-top: 1px solid var(--line, #c7c7c2);
}

.ac-guide-directory li {
  position: relative;
  min-width: 0;
  padding: 20px 38px 20px 0;
  border-bottom: 1px solid var(--line, #c7c7c2);
}

.ac-guide-directory li p {
  max-width: 62ch;
  margin: 0;
  line-height: 1.55;
}

.ac-guide-directory li p + p {
  margin-top: 8px;
}

.ac-guide-directory li a {
  display: block;
  font-size: clamp(19px, 1.8vw, 25px);
  font-weight: 500;
  line-height: 1.23;
  letter-spacing: -.025em;
  text-decoration: none;
  text-wrap: pretty;
}

.ac-guide-directory li a:hover {
  text-decoration: underline;
  text-underline-offset: .19em;
}

.ac-guide-directory li a::before {
  position: absolute;
  inset: 0;
  content: "";
}

.ac-guide-directory li a > .ac-arrow-icon {
  position: absolute;
  inset-block-start: 20px;
  inset-inline-end: 0;
  font-size: .9em;
}

.ac-guide-directory li a:focus-visible {
  outline: none;
}

.ac-guide-directory li a:focus-visible::before {
  outline: 2px solid currentColor;
  outline-offset: 4px;
}

body.guides-landing[data-ac-width="generic"] > main#main .ac-guide-closing {
  width: 100%;
  max-width: none;
  margin: 0;
  padding-block: 42px 76px;
  border-top: 1px solid var(--line, #c7c7c2);
}

.ac-guide-closing p {
  max-width: 60ch;
}

@media (max-width: 680px) {
  .ac-guide-directory {
    grid-template-columns: minmax(0, 1fr);
    row-gap: 16px;
    padding-block: 42px 54px;
  }

  .ac-guide-directory ul + h2 {
    margin-top: 22px;
  }

  .ac-guide-directory li {
    padding: 17px 29px 17px 0;
  }

  .ac-guide-directory li a > .ac-arrow-icon {
    inset-block-start: 17px;
  }

  body.guides-landing[data-ac-width="generic"] > main#main .ac-guide-closing {
    padding-block: 32px 54px;
  }
}

@media (max-width: 600px) {
  .guides-landing .ac-collection-introduction {
    margin-top: 30px;
  }
}
