.examples-page .collection {
  max-width:1392px;
  padding:clamp(58px,8vw,118px) clamp(20px,5vw,80px) 95px;
  margin:auto;
  color:#173d34;
}

.collection-intro {
  display:grid;
  grid-template-columns:minmax(0,1.4fr) minmax(220px,.6fr);
  align-items:end;
  gap:34px;
  padding-bottom:34px;
  border-bottom:1px solid #aabbb0;
}

.collection-intro .eyebrow {
  margin-bottom:18px;
}

.collection h1 {
  font-size:clamp(56px,7.8vw,112px);
  line-height:.97;
  letter-spacing:-.075em;
  margin:0;
}

.collection h1 em {
  font-family:Georgia,serif;
  font-weight:400;
  letter-spacing:-.065em;
}

.collection-intro .collection-lead {
  font-size:clamp(16px,1.6vw,22px);
  line-height:1.45;
  max-width:32ch;
  margin:0 0 4px;
}

.collection-tools {
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:12px;
  padding:21px 0 28px;
}

.collection-tools[hidden],.collection-card[hidden] {
  display:none;
}

.collection-filters {
  display:flex;
  gap:6px;
  flex-wrap:wrap;
}

.collection-filters button {
  font:inherit;
  font-size:13px;
  font-weight:550;
  border:1px solid #a6b7aa;
  color:#214338;
  background:transparent;
  border-radius:22px;
  min-height:40px;
  padding:8px 14px;
  cursor:pointer;
}

.collection-filters button[aria-pressed=true] {
  background:#1a4035;
  color:white;
  border-color:#1a4035;
}

#collection-count,.collection-meta {
  font:600 11px/1.3 ui-monospace,monospace;
  letter-spacing:.065em;
  text-transform:uppercase;
}

.collection-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:36px 24px;
  padding-top:12px;
}

.collection-card {
  min-width:0;
}

.collection-card>a {
  display:block;
  color:inherit;
  text-decoration:none;
}

.collection-cover {
  overflow:hidden;
  border:1px solid #243e3425;
  border-radius:6px;
  background:#e4e7dc;
}

.collection-cover img {
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:3/2;
  object-fit:cover;
  transition:transform .3s;
}

.collection-card a:hover img {
  transform:scale(1.025);
}

.collection-meta {
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin:15px 0 7px;
  color:#426357;
}

.collection-meta span:last-child {
  font-size:16px;
}

.collection-card h2 {
  font:600 clamp(24px,2.35vw,37px)/1.08 system-ui,sans-serif;
  letter-spacing:-.055em;
  margin:0;
}

.collection-card p {
  font-size:14px;
  line-height:1.5;
  color:#466156;
  margin:8px 0 0;
  max-width:50ch;
}

.collection a:focus-visible,.collection button:focus-visible {
  outline:3px solid #286e5a;
  outline-offset:4px;
}

@media(max-width:900px) {
  .collection-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media(max-width:650px) {
  .collection-intro {
    grid-template-columns:1fr;
    gap:18px;
  }
  .collection-grid {
    gap:30px;
    grid-template-columns:1fr;
  }
  .collection-tools {
    align-items:flex-start;
  }
  .collection-filters button {
    font-size:12px;
    padding-inline:11px;
  }
  .collection-intro .collection-lead {
    max-width:41ch;
  }
}

@media(prefers-reduced-motion:reduce) {
  .collection-cover img {
    transition:none;
  }
}
.kind-select {display:grid;gap:5px;font:600 11px/1.3 system-ui,sans-serif;color:#345143}
.kind-select select {background:#fffef8;color:#173d34;border:1px solid #8ea698;border-radius:7px;padding:8px 32px 8px 10px;font:500 14px/1.4 system-ui,sans-serif;min-height:40px}
.collection-direction {display:block;margin-top:10px;color:#5d6d61;font:11px/1.4 ui-monospace,monospace}
.no-collection {padding:28px 0;font-size:16px}.no-collection button {background:none;border:0;padding:8px;color:inherit;text-decoration:underline;cursor:pointer}
.no-collection[hidden] {display:none}
.featured-types {margin-block:18px 28px}.featured-types .collection-card h2 {font-size:clamp(25px,2.9vw,42px)}