/* Sustainability page styles */
.section { 
  margin-block: var(--space-12); 
}
.muted { color: var(--gray-600); font-size: var(--fs-200); }

/* Hero */
.hero { margin-top: var(--space-10); }
.hero-grid { 
  display: grid; 
  grid-template-columns: 1.2fr 1fr; 
  gap: var(--space-8); 
  align-items: center;
}
.hero-copy p { max-width: 60ch; }
.hero-media img { 
  border-radius: var(--radius-xl); 
  box-shadow: var(--shadow-lg); 
  border: 1px solid var(--gray-200);
}
.hero-actions { display: flex; gap: var(--space-3); flex-wrap: wrap; margin-top: var(--space-4); }
@media (max-width: 900px) {
  .hero-grid { grid-template-columns: 1fr; }
}

/* Two-column generic grid */
.grid-two {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-6);
}
@media (max-width: 900px) {
  .grid-two { grid-template-columns: 1fr; }
}

/* Practices grid */
.practices-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-6);
}
@media (max-width: 1000px) {
  .practices-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 650px) {
  .practices-grid { grid-template-columns: 1fr; }
}

/* Media card */
.media-card img { border-radius: var(--radius-lg); }
.media-card figcaption { color: var(--gray-700); font-size: var(--fs-200); margin-top: var(--space-2); }

/* Partner CTA */
.partner-cta { margin-top: var(--space-4); }

/* Metrics */
.metrics-grid { 
  display: grid; 
  grid-template-columns: repeat(4, 1fr); 
  gap: var(--space-6); 
}
@media (max-width: 1100px) {
  .metrics-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 650px) {
  .metrics-grid { grid-template-columns: 1fr; }
}
.kpi p { margin-bottom: var(--space-3); }
.kpi-bar {
  --bar-height: 12px;
  background: var(--gray-200);
  height: var(--bar-height);
  border-radius: var(--radius-round);
  position: relative;
  overflow: hidden;
}
.kpi-fill {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, var(--color-primary), color-mix(in oklab, var(--color-primary), white 15%));
}
.count { font-variant-numeric: tabular-nums; }

/* Final CTA */
.cta-final { text-align: center; }
.cta-final p { margin-inline: auto; }

/* Cards spacing */
.card ul { padding-left: var(--space-6); }
.card ul li { margin-bottom: var(--space-2); }