/* ProgettoGiano — programmi.css (Spoke 1: tool comparison) */

.hero-compact {
  background: var(--cream);
  border-bottom: 1px solid var(--beige-deep);
  padding: var(--sp-section) 0 var(--sp-section-sm);
}
.hero-compact h1 { font-size: 40px; }
.hero-compact .lead { max-width: 720px; }

.review { margin-bottom: var(--sp-xxl); padding-bottom: var(--sp-xl); border-bottom: 1px solid var(--hairline-soft); }
.review:last-child { border-bottom: 0; }
.review h3 { display: flex; align-items: center; gap: var(--sp-sm); flex-wrap: wrap; }
.review .badge { font-size: 12px; }
.rating { display: inline-flex; gap: 2px; color: var(--sunshine-800); vertical-align: middle; }
.rating .icon { width: 18px; height: 18px; }
.review .verdict { font-weight: 500; }
.review .site-link { font-size: 14px; }

.mobile-tools { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: var(--sp-lg); margin: var(--sp-xl) 0; }

.choose-list { list-style: none; padding: 0; }
.choose-list li {
  display: flex;
  gap: var(--sp-sm);
  align-items: flex-start;
  padding: var(--sp-sm) 0;
  border-bottom: 1px solid var(--hairline-soft);
}
.choose-list .icon { color: var(--primary); margin-top: 3px; }

@media (max-width: 768px) {
  .hero-compact h1 { font-size: 30px; }
}