
/*
 * Clarity pass: make the tool archive easier for first-time users.
 * Visual proof comes first; explanatory text becomes secondary.
 */
.archive-header-directory {
  padding: clamp(18px, 2vw, 26px);
}

.hero-copy-column .hero-trust-inline,
.quick-searches .quick-chip:nth-child(n+4) {
  display: none;
}

.hero-copy-column h1 {
  max-width: 11ch;
}

.hero-intro {
  max-width: 40rem;
}

.archive-header-directory .archive-header-copy h1 {
  max-width: 12ch;
}

.archive-header-directory .section-intro {
  max-width: 48ch;
  font-size: clamp(0.98rem, 1.08vw, 1.08rem);
}

.archive-proof.card.archive-proof-card {
  padding: 14px;
}

.archive-proof-card h2 {
  font-size: 1rem;
}

.archive-proof-card li {
  font-size: 0.78rem;
}

.hero-home .hero-actions {
  max-width: 35rem;
}

.hero-home .hero-actions .button {
  flex: 1 1 13rem;
}

.home-feature-grid .featured-tool-card {
  display: grid;
  gap: 10px;
  padding: 10px;
  border-radius: 18px;
}

.home-feature-grid .featured-tool-card.is-emphasis {
  grid-column: auto;
  grid-row: auto;
  min-height: 0;
  padding: 10px;
  transform: none;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.035), transparent 100%),
    linear-gradient(180deg, rgba(20, 21, 28, 0.98), rgba(10, 12, 18, 0.98));
}

.home-feature-grid .featured-tool-card.is-emphasis h3 {
  font-size: clamp(1.14rem, 1.4vw, 1.46rem);
}

.home-feature-grid .featured-tool-card.is-emphasis .tool-card-summary {
  font-size: 0.86rem;
}

.tool-proof-card--home-feature {
  margin: 0;
}

.tool-proof-card--home-feature .tool-proof-surface {
  min-height: 172px;
  aspect-ratio: 16 / 10;
  border-radius: 14px;
}

.tool-proof-card--home-feature .tool-proof-overlay {
  padding: 12px;
  background:
    linear-gradient(180deg, rgba(3, 6, 11, 0.48), transparent 36%, rgba(3, 6, 11, 0.82));
}

.tool-proof-card--home-feature .tool-proof-body {
  display: none;
}

.tool-proof-card--home-feature .tool-proof-fallback,
.tool-proof-card--archive-preview .tool-proof-fallback {
  display: grid;
  align-items: end;
}

.tool-proof-card--home-feature .tool-proof-fallback-copy,
.tool-proof-card--archive-preview .tool-proof-fallback-copy {
  display: grid;
  max-width: 90%;
  padding: 12px;
}

.tool-proof-card--home-feature .tool-proof-fallback-title,
.tool-proof-card--archive-preview .tool-proof-fallback-title {
  font-size: 0.94rem;
}

.tool-proof-card--home-feature .tool-proof-fallback-text,
.tool-proof-card--archive-preview .tool-proof-fallback-text {
  display: none;
}

.tool-proof-card--home-feature .tool-proof-logo,
.tool-proof-card--home-feature .tool-proof-monogram {
  width: 38px;
  height: 38px;
  border-radius: 12px;
}

.tool-proof-card--home-feature .tool-proof-label {
  font-size: 0.54rem;
}

.tool-proof-card--home-feature .tool-proof-vendor {
  max-width: 15rem;
  overflow: hidden;
  font-size: 0.84rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.home-feature-grid .featured-tool-card .article-card-topline,
.home-feature-grid .featured-tool-card h3,
.home-feature-grid .featured-tool-card .tool-card-summary,
.home-feature-grid .featured-tool-card .article-card-note,
.home-feature-grid .featured-tool-card .badges,
.home-feature-grid .featured-tool-card .tool-card-footer {
  padding-inline: 4px;
}

.home-feature-grid .featured-tool-card h3 {
  display: -webkit-box;
  overflow: hidden;
  margin-block: 0;
  font-size: clamp(1.14rem, 1.4vw, 1.46rem);
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.home-feature-grid .featured-tool-card .tool-card-summary {
  display: -webkit-box;
  overflow: hidden;
  min-height: 2.7em;
  font-size: 0.86rem;
  line-height: 1.36;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.home-feature-grid .featured-tool-card .article-card-note {
  display: none;
}

.home-feature-grid .featured-tool-card .badges .badge:nth-child(n+2),
.section-discovery .feature-card .badges .badge:nth-child(n+2),
.section-discovery .feature-card .tool-card-footer .button:nth-child(n+2),
.contribute-card-home .hero-actions .button:nth-child(n+3) {
  display: none;
}

.directory-pathways {
  gap: 14px;
  padding: clamp(16px, 2vw, 22px);
}

.directory-pathways-head {
  grid-template-columns: minmax(0, 1fr) minmax(220px, 0.42fr);
  gap: 16px;
}

.directory-pathways-head h2 {
  font-size: clamp(1.55rem, 2vw, 2rem);
}

.directory-pathways-head > p {
  max-width: 28rem;
  font-size: 0.92rem;
}

.directory-pathway-grid {
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 8px;
}

.directory-pathway-card {
  min-height: 142px;
  padding: 13px;
  border-radius: 14px;
}

.directory-pathway-card .o4-card-icon {
  width: 34px;
  height: 34px;
  border-radius: 11px;
}

.directory-pathway-card .o4-card-icon .o4-ui-icon {
  width: 17px;
  height: 17px;
}

.directory-pathway-card h3 {
  margin: 7px 0 6px;
  font-size: 0.96rem;
}

.directory-pathway-card p:not(.card-meta) {
  display: -webkit-box;
  overflow: hidden;
  font-size: 0.74rem;
  line-height: 1.34;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.directory-pathway-footer {
  gap: 6px;
  padding-top: 10px;
}

.directory-pathway-footer a {
  font-size: 0.7rem;
}

.directory-tool-card {
  padding: 10px;
  border-radius: 18px;
}

.directory-tool-card-frame {
  gap: 10px;
}

.directory-tool-card .article-card-topline {
  order: 2;
}

.directory-tool-title {
  order: 3;
  display: -webkit-box;
  overflow: hidden;
  margin-top: 0;
  font-size: clamp(1.1rem, 1.25vw, 1.34rem);
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.directory-tool-card .tool-card-summary {
  order: 4;
  min-height: 2.75em;
  color: rgba(216, 220, 223, 0.75);
  font-size: 0.84rem;
  line-height: 1.36;
  -webkit-line-clamp: 2;
}

.directory-tool-meta-row {
  order: 5;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
}

.directory-tool-meta-row span {
  min-width: 0;
  min-height: 31px;
  padding: 0 8px;
  border-radius: 10px;
  font-size: 0.66rem;
}

.directory-tool-meta-row span:first-child {
  grid-column: 1 / -1;
}

.tool-proof-card--archive-preview {
  order: 1;
  margin: 0;
}

.tool-proof-card--archive-preview .tool-proof-surface {
  min-height: 166px;
  aspect-ratio: 16 / 10;
  border-radius: 14px;
}

.tool-proof-card--archive-preview .tool-proof-overlay {
  align-content: start;
  padding: 11px;
  background:
    linear-gradient(180deg, rgba(3, 6, 11, 0.52), transparent 34%, rgba(3, 6, 11, 0.8));
}

.tool-proof-card--archive-preview .tool-proof-head {
  gap: 8px;
}

.tool-proof-card--archive-preview .tool-proof-logo,
.tool-proof-card--archive-preview .tool-proof-monogram {
  width: 36px;
  height: 36px;
  border-radius: 11px;
}

.tool-proof-card--archive-preview .tool-proof-label {
  font-size: 0.54rem;
}

.tool-proof-card--archive-preview .tool-proof-vendor {
  max-width: 14rem;
  overflow: hidden;
  font-size: 0.82rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tool-proof-card--archive-preview .tool-proof-body {
  display: none;
}

.directory-tool-card .badges {
  order: 6;
}

.directory-tool-card .badges .badge:nth-child(n+2) {
  display: none;
}

.directory-tool-card-actions {
  order: 7;
}

@media (max-width: 1280px) {
  .directory-pathway-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .directory-pathway-card {
    min-height: 132px;
  }
}

@media (max-width: 720px) {
  .archive-header-directory .archive-header-copy h1 {
    max-width: none;
  }

  .directory-pathways-head {
    grid-template-columns: 1fr;
  }

  .directory-pathway-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .directory-pathway-card {
    min-height: 124px;
    padding: 12px;
  }

  .directory-pathway-card p:not(.card-meta) {
    display: none;
  }

  .tool-proof-card--archive-preview .tool-proof-surface {
    min-height: 142px;
  }

  .tool-proof-card--home-feature .tool-proof-surface {
    min-height: 148px;
  }

  .tool-proof-card--archive-preview .tool-proof-brand-copy {
    display: grid;
  }

  .directory-tool-meta-row {
    grid-template-columns: 1fr;
  }
}
