/* ProgettoGiano — home.css (pillar page specific) */

/* Hero sunset band */
.hero {
  background: linear-gradient(135deg, var(--sunshine-700) 0%, var(--sunshine-900) 60%, var(--primary) 100%);
  padding: var(--sp-hero) 0;
}
.hero .container {
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: var(--sp-xxl);
  align-items: center;
}
.hero h1 {
  font-size: 52px;
  color: var(--ink);
}
.hero .lead { color: var(--ink-tint); margin-bottom: var(--sp-xl); }
.hero .img-placeholder { margin: 0; }
.hero .img-frame { background: var(--cream-light); }

/* Steps */
.step { margin-bottom: var(--sp-xxl); }
.step h3 {
  display: flex;
  align-items: center;
  gap: var(--sp-sm);
}
.step h3 .icon { color: var(--primary); width: 24px; height: 24px; }
.step-num {
  font-family: var(--font-display);
  color: var(--primary);
  margin-right: 2px;
}

/* Tool teaser cards */
.tool-card h4 { display: flex; align-items: center; gap: var(--sp-xs); }
.tool-card h4 .icon { color: var(--primary); }
.tool-card .badge { margin-bottom: var(--sp-sm); }
.tool-card .verdict { font-size: 14px; color: var(--steel); font-style: italic; margin-bottom: 0; }

/* Mini mistakes list */
.mistake-item {
  display: flex;
  gap: var(--sp-md);
  align-items: flex-start;
  padding: var(--sp-md) 0;
  border-bottom: 1px solid var(--hairline-soft);
}
.mistake-item .icon { color: var(--primary); margin-top: 4px; }
.mistake-item p { margin-bottom: 0; }

@media (max-width: 768px) {
  .hero { padding: var(--sp-section) 0; }
  .hero .container { grid-template-columns: 1fr; }
  .hero h1 { font-size: 36px; }
}