
/*
 * Broad mobile/detail cleanup: archive and detail pages should never feel like
 * desktop panels squeezed onto a phone. Stack proof content, keep heroes inside
 * the viewport, and reduce first-screen card pressure.
 */
@media (max-width: 760px) {
  .archive-header-collections.card,
  .archive-header-use-cases.card,
  .archive-header-editorial.card,
  .archive-header-comparisons.card,
  .archive-header-coverage.card {
    gap: 14px !important;
    min-height: 0 !important;
    padding: 22px 0 18px !important;
    border-bottom: 1px solid rgba(238, 240, 242, 0.1);
  }

  .archive-header-collections .archive-proof-card,
  .archive-header-use-cases .archive-proof-card,
  .archive-header-editorial .archive-proof-card,
  .archive-header-comparisons .archive-proof-card,
  .archive-header-coverage .archive-proof-card {
    display: none !important;
  }

  .archive-header-collections .archive-header-copy h1,
  .archive-header-use-cases .archive-header-copy h1,
  .archive-header-editorial .archive-header-copy h1,
  .archive-header-comparisons .archive-header-copy h1,
  .archive-header-coverage .archive-header-copy h1 {
    max-width: 12ch !important;
    font-size: clamp(2.45rem, 11vw, 3.1rem) !important;
    line-height: 0.96 !important;
  }

  .archive-header-collections .section-intro,
  .archive-header-use-cases .section-intro,
  .archive-header-editorial .section-intro,
  .archive-header-comparisons .section-intro,
  .archive-header-coverage .section-intro {
    max-width: 34rem;
    font-size: 0.94rem;
    line-height: 1.46;
  }

  .archive-header-collections .archive-header-meta .badge:nth-child(n+3),
  .archive-header-use-cases .archive-header-meta .badge:nth-child(n+3),
  .archive-header-editorial .archive-header-meta .badge:nth-child(n+3),
  .archive-header-comparisons .archive-header-meta .badge:nth-child(n+3),
  .archive-header-coverage .archive-header-meta .badge:nth-child(n+3) {
    display: none;
  }

  .collection-picks.card {
    overflow: hidden;
    padding: 14px;
  }

  .collection-picks-grid,
  .article-shell-use-case .article-proof-grid,
  .article-shell-coverage .article-proof-grid,
  .article-shell-review-detail .article-proof-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
    overflow: visible !important;
    margin-inline: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    scroll-snap-type: none !important;
  }

  .collection-pick-card,
  .article-shell-use-case .article-proof-card,
  .article-shell-coverage .article-proof-card,
  .article-shell-review-detail .article-proof-card {
    flex: none !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    max-width: 100% !important;
    padding: 13px !important;
    scroll-snap-align: none !important;
  }

  .collection-pick-card h3,
  .article-shell-use-case .article-proof-card p:not(.panel-label),
  .article-shell-coverage .article-proof-card p:not(.panel-label),
  .article-shell-review-detail .article-proof-card p:not(.panel-label) {
    overflow-wrap: anywhere;
  }

  .article-shell-use-case .article-proof-card p:not(.panel-label),
  .article-shell-coverage .article-proof-card p:not(.panel-label) {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
  }

  .section-tool-single,
  .tool-single-shell,
  .tool-single-shell > *,
  .tool-hero-dossier,
  .tool-hero-dossier > *,
  .tool-hero-main,
  .tool-hero-copy,
  .tool-hero-meta {
    box-sizing: border-box;
    width: 100%;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: hidden;
  }

  .tool-hero-dossier.card {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 16px !important;
    margin-inline: 0 !important;
    padding: 14px !important;
  }

  .tool-hero-dossier .tool-hero-topline {
    display: grid;
    grid-template-columns: 1fr;
    gap: 6px;
  }

  .tool-hero-path,
  .tool-hero-path a {
    min-width: 0;
    overflow-wrap: anywhere;
  }

  .tool-hero-dossier h1 {
    max-width: 100% !important;
    font-size: clamp(2.55rem, 12vw, 3.25rem) !important;
    line-height: 0.94 !important;
    overflow-wrap: anywhere;
  }

  .tool-hero-dossier .tool-hero-summary {
    max-width: 100%;
    font-size: 0.95rem;
    line-height: 1.42;
  }

  .tool-dossier-facts {
    grid-template-columns: 1fr !important;
    gap: 0 !important;
  }

  .tool-dossier-facts div {
    min-width: 0 !important;
    padding: 12px !important;
  }

  .tool-dossier-facts strong {
    display: block;
    max-width: 100%;
    overflow-wrap: anywhere;
  }

  .tool-hero-actions {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
  }

  .tool-hero-actions .button {
    width: 100%;
    justify-content: center;
  }

  .tool-jump-nav-compact {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
    overflow: visible !important;
  }

  .tool-jump-nav-compact a {
    width: 100%;
    min-width: 0 !important;
    justify-content: center;
    padding-inline: 10px;
  }

  .tool-dossier-signal .meta-list,
  .tool-dossier-signal .meta-list-compact {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
  }

  .tool-dossier-signal .meta-list li,
  .tool-dossier-signal .meta-list-compact li {
    display: grid !important;
    grid-template-columns: minmax(0, 0.42fr) minmax(0, 1fr) !important;
    gap: 8px !important;
    width: 100%;
    min-width: 0 !important;
  }

  .tool-dossier-signal .meta-list li span,
  .tool-dossier-signal .meta-list-compact li span {
    min-width: 0;
    overflow-wrap: anywhere;
    text-align: right;
  }

  .tool-proof-card--hero .tool-proof-surface {
    min-height: 210px !important;
    aspect-ratio: 16 / 9 !important;
  }

  .collection-tool-card .tool-proof-card--stack .tool-proof-surface,
  .article-shell-use-case .tool-proof-card--related .tool-proof-surface,
  .article-shell-coverage .tool-proof-card--related .tool-proof-surface {
    height: auto !important;
    min-height: 170px !important;
    aspect-ratio: 16 / 8.7;
  }

  .collection-tool-card .tool-proof-card--stack.tool-proof-card--no-screenshot .tool-proof-surface,
  .collection-tool-card .tool-proof-card--stack.is-proof-missing .tool-proof-surface,
  .article-shell-use-case .tool-proof-card--related.tool-proof-card--no-screenshot .tool-proof-surface,
  .article-shell-use-case .tool-proof-card--related.is-proof-missing .tool-proof-surface,
  .article-shell-coverage .tool-proof-card--related.tool-proof-card--no-screenshot .tool-proof-surface,
  .article-shell-coverage .tool-proof-card--related.is-proof-missing .tool-proof-surface {
    min-height: 156px !important;
  }

  .collection-tool-card .tool-proof-card--stack.tool-proof-card--no-screenshot .tool-proof-fallback-identity,
  .collection-tool-card .tool-proof-card--stack.is-proof-missing .tool-proof-fallback-identity,
  .article-shell-use-case .tool-proof-card--related.tool-proof-card--no-screenshot .tool-proof-fallback-identity,
  .article-shell-use-case .tool-proof-card--related.is-proof-missing .tool-proof-fallback-identity,
  .article-shell-coverage .tool-proof-card--related.tool-proof-card--no-screenshot .tool-proof-fallback-identity,
  .article-shell-coverage .tool-proof-card--related.is-proof-missing .tool-proof-fallback-identity {
    align-content: start;
    min-height: 0;
    padding: 14px !important;
  }

  .collection-tool-card .tool-proof-card--stack.tool-proof-card--no-screenshot .tool-proof-fallback-identity strong,
  .collection-tool-card .tool-proof-card--stack.is-proof-missing .tool-proof-fallback-identity strong,
  .article-shell-use-case .tool-proof-card--related.tool-proof-card--no-screenshot .tool-proof-fallback-identity strong,
  .article-shell-use-case .tool-proof-card--related.is-proof-missing .tool-proof-fallback-identity strong,
  .article-shell-coverage .tool-proof-card--related.tool-proof-card--no-screenshot .tool-proof-fallback-identity strong,
  .article-shell-coverage .tool-proof-card--related.is-proof-missing .tool-proof-fallback-identity strong {
    display: -webkit-box;
    overflow: hidden;
    font-size: 0.98rem !important;
    line-height: 1.1;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }

  .collection-tool-card .tool-proof-card--stack.tool-proof-card--no-screenshot .tool-proof-fallback-identity small,
  .collection-tool-card .tool-proof-card--stack.is-proof-missing .tool-proof-fallback-identity small,
  .article-shell-use-case .tool-proof-card--related.tool-proof-card--no-screenshot .tool-proof-fallback-identity small,
  .article-shell-use-case .tool-proof-card--related.is-proof-missing .tool-proof-fallback-identity small,
  .article-shell-coverage .tool-proof-card--related.tool-proof-card--no-screenshot .tool-proof-fallback-identity small,
  .article-shell-coverage .tool-proof-card--related.is-proof-missing .tool-proof-fallback-identity small {
    display: -webkit-box;
    overflow: hidden;
    white-space: normal;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
  }

  .collection-tool-card .tool-proof-card--stack.tool-proof-card--no-screenshot .tool-proof-fallback-eyebrow,
  .collection-tool-card .tool-proof-card--stack.tool-proof-card--no-screenshot .tool-proof-fallback-identity strong,
  .collection-tool-card .tool-proof-card--stack.tool-proof-card--no-screenshot .tool-proof-fallback-identity small,
  .collection-tool-card .tool-proof-card--stack.is-proof-missing .tool-proof-fallback-eyebrow,
  .collection-tool-card .tool-proof-card--stack.is-proof-missing .tool-proof-fallback-identity strong,
  .collection-tool-card .tool-proof-card--stack.is-proof-missing .tool-proof-fallback-identity small,
  .article-shell-use-case .tool-proof-card--related.tool-proof-card--no-screenshot .tool-proof-fallback-eyebrow,
  .article-shell-use-case .tool-proof-card--related.tool-proof-card--no-screenshot .tool-proof-fallback-identity strong,
  .article-shell-use-case .tool-proof-card--related.tool-proof-card--no-screenshot .tool-proof-fallback-identity small,
  .article-shell-use-case .tool-proof-card--related.is-proof-missing .tool-proof-fallback-eyebrow,
  .article-shell-use-case .tool-proof-card--related.is-proof-missing .tool-proof-fallback-identity strong,
  .article-shell-use-case .tool-proof-card--related.is-proof-missing .tool-proof-fallback-identity small,
  .article-shell-coverage .tool-proof-card--related.tool-proof-card--no-screenshot .tool-proof-fallback-eyebrow,
  .article-shell-coverage .tool-proof-card--related.tool-proof-card--no-screenshot .tool-proof-fallback-identity strong,
  .article-shell-coverage .tool-proof-card--related.tool-proof-card--no-screenshot .tool-proof-fallback-identity small,
  .article-shell-coverage .tool-proof-card--related.is-proof-missing .tool-proof-fallback-eyebrow,
  .article-shell-coverage .tool-proof-card--related.is-proof-missing .tool-proof-fallback-identity strong,
  .article-shell-coverage .tool-proof-card--related.is-proof-missing .tool-proof-fallback-identity small {
    display: none !important;
  }

  .collection-tool-card .tool-proof-card--stack.tool-proof-card--no-screenshot .tool-proof-fallback-mark,
  .collection-tool-card .tool-proof-card--stack.is-proof-missing .tool-proof-fallback-mark,
  .article-shell-use-case .tool-proof-card--related.tool-proof-card--no-screenshot .tool-proof-fallback-mark,
  .article-shell-use-case .tool-proof-card--related.is-proof-missing .tool-proof-fallback-mark,
  .article-shell-coverage .tool-proof-card--related.tool-proof-card--no-screenshot .tool-proof-fallback-mark,
  .article-shell-coverage .tool-proof-card--related.is-proof-missing .tool-proof-fallback-mark {
    width: 44px;
    height: 44px;
    margin: 0;
  }

  .collection-tool-card .tool-proof-card--stack.tool-proof-card--has-screenshot:not(.is-proof-loaded) .tool-proof-body,
  .collection-tool-card .tool-proof-card--stack.tool-proof-card--has-screenshot:not(.is-proof-loaded) .tool-proof-overlay,
  .article-shell-use-case .tool-proof-card--related.tool-proof-card--has-screenshot:not(.is-proof-loaded) .tool-proof-body,
  .article-shell-use-case .tool-proof-card--related.tool-proof-card--has-screenshot:not(.is-proof-loaded) .tool-proof-overlay,
  .article-shell-coverage .tool-proof-card--related.tool-proof-card--has-screenshot:not(.is-proof-loaded) .tool-proof-body,
  .article-shell-coverage .tool-proof-card--related.tool-proof-card--has-screenshot:not(.is-proof-loaded) .tool-proof-overlay {
    display: none !important;
  }
}

@media (max-width: 420px) {
  .collection-single-section,
  .editorial-shell,
  .section-tool-single {
    padding-top: 22px;
  }

  .tool-hero-dossier h1 {
    font-size: clamp(2.35rem, 11vw, 2.9rem) !important;
  }

  .post-type-archive-tool .directory-hero-search .button,
  .tax-tool_category .directory-hero-search .button,
  .tax-use_case_type .directory-hero-search .button,
  .tax-workflow_stage .directory-hero-search .button {
    width: auto !important;
    min-width: 82px !important;
    overflow: visible !important;
    color: #11100c !important;
  }

  .post-type-archive-tool .directory-hero-search .button .button-icon,
  .tax-tool_category .directory-hero-search .button .button-icon,
  .tax-use_case_type .directory-hero-search .button .button-icon,
  .tax-workflow_stage .directory-hero-search .button .button-icon {
    margin-right: 6px;
  }
}
