/* Discovery pages only; this sheet is not loaded by tools or Photo Processing. */
.image-directory #categories { scroll-margin-top: 100px; }
.image-directory .image-category-card h3 { font-size: 18px; }
.image-directory .image-category-card p { line-height: 1.5; }
.image-directory .image-category-grid { grid-auto-rows: 1fr; }
@media (min-width: 1200px) {
  .image-directory .image-category-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 24px 16px; }
}
.image-directory .image-category-card .image-tool-card__art { aspect-ratio: 4 / 3; position: relative; flex: 0 0 auto; }
.image-directory .image-category-card .image-tool-card__art img { position: absolute; inset: 12px; width: calc(100% - 24px); height: calc(100% - 24px); aspect-ratio: auto; object-fit: contain; }
.image-directory .image-directory-help { padding-block: 0 32px; }
.image-directory .image-directory-help h2,
.image-directory .image-related-categories h2 { font-size: 23px; font-weight: 650; margin: 0 0 18px; line-height: 1.3; }
.image-directory .image-help-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; margin-bottom: 28px; max-width: 1000px; }
.image-directory .image-help-grid h3 { font-size: 17px; margin: 0 0 8px; }
.image-directory .image-help-grid p,
.image-directory .image-directory-help details p { margin: 0; color: #52616e; max-width: 85ch; }
.image-directory .image-directory-help details { max-width: 1000px; border-top: 1px solid #cdd4d5; padding: 14px 0; }
.image-directory .image-directory-help details:last-child { border-bottom: 1px solid #cdd4d5; }
.image-directory .image-directory-help summary { cursor: pointer; font-weight: 600; padding: 4px 0; }
.image-directory .image-directory-help details p { margin: 10px 0 4px; }
.image-directory summary:focus-visible { outline: 3px solid #2867d8; outline-offset: 4px; }
.image-directory .image-related-categories { padding-bottom: 40px; }
.image-directory .image-related-categories > div { display: flex; flex-wrap: wrap; gap: 10px 16px; }
.image-directory .image-related-categories a { display: inline-flex; align-items: center; min-height: 44px; color: #286457; text-underline-offset: 4px; }
@media (max-width: 599px) {
  .image-directory .image-help-grid { grid-template-columns: 1fr; gap: 18px; }
}