
/*
 * Collection and comparison decision polish: move tool evidence higher on the
 * page and keep long reasoning copy out of the first mobile viewport.
 */
.comparison-lead.card {
  grid-template-columns: minmax(0, 0.92fr) minmax(310px, 0.58fr);
  gap: clamp(24px, 4vw, 54px);
  align-items: start;
  padding-top: clamp(22px, 3vw, 32px);
  padding-bottom: clamp(20px, 3vw, 30px);
}

.comparison-lead-brief {
  display: grid;
  gap: 0;
  align-self: stretch;
  max-width: none;
}

.comparison-brief-line {
  display: grid;
  gap: 7px;
  padding: 14px 0;
  border-top: 1px solid var(--o4-premium-line);
}

.comparison-brief-line:first-child {
  padding-top: 0;
  border-top: 0;
}

.comparison-brief-line:last-child {
  padding-bottom: 0;
}

.comparison-brief-line p {
  margin: 0;
  color: rgba(238, 240, 242, 0.64);
  font-size: 0.88rem;
  line-height: 1.48;
}

.comparison-brief-line .panel-label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: rgba(238, 240, 242, 0.52);
  font-size: 0.66rem;
  font-weight: 760;
  letter-spacing: 0.08em;
}

.comparison-brief-line a {
  color: #f4f1e9;
  font-weight: 740;
}

.comparison-tool-card.card {
  overflow: hidden;
  padding: 0;
  border-radius: 8px;
  background: #111318;
}

.comparison-tool-card > h2,
.comparison-tool-card > p,
.comparison-tool-card > .badges {
  padding-inline: 16px;
}

.comparison-tool-card > h2 {
  margin-top: 16px;
  color: #f4f1e9;
  font-size: clamp(1.08rem, 1.35vw, 1.42rem);
  line-height: 1.16;
}

.comparison-tool-card > p {
  margin-top: 9px;
  color: rgba(238, 240, 242, 0.64);
  font-size: 0.84rem;
  line-height: 1.44;
}

.comparison-tool-card > p:nth-of-type(1),
.comparison-tool-card > p:nth-of-type(2) {
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
}

.comparison-tool-card > p:nth-of-type(1) {
  -webkit-line-clamp: 2;
}

.comparison-tool-card > p:nth-of-type(2) {
  -webkit-line-clamp: 3;
}

.comparison-tool-card > p:nth-of-type(n+3):nth-of-type(-n+5) {
  margin-top: 7px;
  font-size: 0.78rem;
  line-height: 1.34;
}

.comparison-tool-card > p:nth-of-type(6),
.comparison-tool-card > p:nth-of-type(7) {
  display: none !important;
}

.comparison-tool-card > .badges {
  gap: 6px;
  margin-top: 11px;
}

.comparison-tool-card > .badges .badge:nth-child(n+3) {
  display: none;
}

.comparison-tool-card > p:last-child {
  margin-top: auto;
  padding: 12px 16px 16px;
}

.comparison-tool-card > p:last-child .button {
  width: 100%;
  min-height: 38px;
}

.comparison-decision-notes.card {
  max-width: 960px;
  margin-top: 18px;
  padding: 18px;
  border-color: var(--o4-premium-line);
  border-radius: 8px;
  background: #111318;
  box-shadow: none;
}

.comparison-decision-notes .editorial-content {
  max-width: 760px;
  color: rgba(238, 240, 242, 0.7);
  font-size: 0.94rem;
  line-height: 1.58;
}

.comparison-decision-notes .editorial-content h2,
.comparison-decision-notes .editorial-content h3 {
  max-width: 18ch;
  color: #f4f1e9;
  font-size: clamp(1.05rem, 1.5vw, 1.42rem);
  line-height: 1.18;
}

.collection-picks.card {
  padding: 18px;
}

.collection-picks h2 {
  margin: 0;
  font-size: clamp(1.22rem, 1.7vw, 1.75rem);
  line-height: 1.15;
}

.collection-pick-card {
  min-height: 112px;
}

@media (max-width: 760px) {
  .collection-shell.card {
    width: 100%;
    min-width: 0;
  }

  .collection-shell > *,
  .comparison-lead > * {
    min-width: 0;
  }

  .comparison-lead.card {
    grid-template-columns: 1fr;
    gap: 18px;
    padding-bottom: 20px;
  }

  .comparison-lead .comparison-lead-copy h1 {
    font-size: clamp(2.18rem, 10.4vw, 3rem);
    line-height: 0.98;
  }

  .comparison-lead-brief {
    padding-left: 0;
    border-left: 0;
  }

  .comparison-brief-line {
    padding: 12px 0;
  }

  .comparison-brief-line:nth-child(3),
  .collection-shell-sidebar {
    display: none;
  }

  .comparison-brief-line p {
    font-size: 0.84rem;
    line-height: 1.42;
  }

  .comparison-tool-grid {
    gap: 12px;
    margin-top: 18px;
  }

  .comparison-tool-card > h2,
  .comparison-tool-card > p,
  .comparison-tool-card > .badges {
    padding-inline: 14px;
  }

  .comparison-tool-card > h2 {
    margin-top: 14px;
    font-size: 1.18rem;
  }

  .comparison-tool-card > p:nth-of-type(n+3):nth-of-type(-n+5) {
    display: inline-flex;
    width: fit-content;
    max-width: 100%;
    min-height: 28px;
    align-items: center;
    gap: 3px;
    margin-right: 5px;
    padding: 0 9px;
    border: 1px solid var(--o4-premium-line);
    border-radius: 999px;
    color: rgba(238, 240, 242, 0.62);
    background: rgba(255, 255, 255, 0.025);
    font-size: 0.72rem;
    line-height: 1.2;
  }

  .comparison-tool-card > .badges {
    display: none;
  }

  .comparison-tool-card > p:last-child {
    display: block;
    padding: 12px 14px 14px;
  }

  .comparison-decision-notes.card {
    margin-top: 14px;
    padding: 15px;
  }

  .comparison-decision-notes .editorial-content {
    font-size: 0.9rem;
    line-height: 1.52;
  }

  .comparison-fit-signal.card {
    margin-top: 14px;
  }

  .collection-picks.card {
    padding: 15px;
  }

  .collection-picks-grid {
    display: flex !important;
    gap: 8px;
    overflow-x: auto;
    border: 0;
    border-radius: 0;
    background: transparent;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
  }

  .collection-picks-grid::-webkit-scrollbar {
    display: none;
  }

  .collection-pick-card {
    flex: 0 0 min(76vw, 260px);
    min-height: 110px;
    border: 1px solid var(--o4-premium-line);
    border-radius: 8px;
    background: #111318;
    scroll-snap-align: start;
  }

  .collection-tools-head {
    margin-top: 28px;
    padding-bottom: 14px;
  }

  .collection-tools-head h2 {
    font-size: 1.45rem;
  }

  .collection-tools-head p:last-child {
    font-size: 0.92rem;
    line-height: 1.46;
  }

  .collection-tool-card > .badges {
    display: none;
  }

  .collection-tool-card-actions {
    grid-template-columns: 1fr;
  }
}
