/**
 * 首页 — Hero + 特性卡片栅格
 */
.home-hero {
  text-align: center;
}

.home-hero .md-card__content {
  padding: var(--md-sys-space-10) var(--md-sys-space-6);
}

.home-hero__title {
  margin: 0 0 var(--md-sys-space-3);
  font-size: clamp(1.75rem, 5vw, var(--md-sys-typescale-headline-large-size));
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.25;
}

.home-hero__lead {
  margin: 0 auto var(--md-sys-space-8);
  max-width: 36rem;
  color: var(--md-sys-color-on-surface-variant);
  font-size: var(--md-sys-typescale-body-large-size);
}

.home-features {
  margin-top: var(--md-sys-section-gap);
}

.home-features.md-grid {
  width: 100%;
  max-width: none;
  margin-inline: 0;
}

.home-feature .md-card__content {
  padding: var(--md-sys-space-6);
  height: 100%;
}

.home-feature__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  margin-bottom: var(--md-sys-space-4);
  border-radius: var(--md-sys-shape-corner-medium);
  background: var(--md-sys-color-primary-container);
  color: var(--md-sys-color-on-primary-container);
}

.home-feature__title {
  margin: 0 0 var(--md-sys-space-2);
  font-size: var(--md-sys-typescale-title-large-size);
  font-weight: 600;
}

.home-feature__body {
  margin: 0;
  color: var(--md-sys-color-on-surface-variant);
}

.home-cta-row {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--md-sys-space-3);
}

.home-cta-row a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: var(--md-sys-space-2) var(--md-sys-space-6);
  border-radius: var(--md-sys-shape-corner-full);
  text-decoration: none;
  font-weight: 500;
}

.home-cta-row a:first-child {
  background: var(--md-sys-color-primary);
  color: var(--md-sys-color-on-primary) !important;
}

.home-cta-row a:first-child:hover {
  filter: brightness(1.05);
}

.home-cta-row a:last-child {
  background: var(--md-sys-color-surface-container);
  color: var(--md-sys-color-primary) !important;
}

.home-cta-row a:last-child:hover {
  background: var(--md-sys-color-surface-container-high);
}