body {
  font-family: var(--font-body);
  font-size: var(--text-base);
  font-weight: var(--weight-regular);
  line-height: var(--leading-normal);
  color: var(--color-text-primary);
  background: var(--color-bg-page);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

h1, h2, h3, h4, h5, h6,
.display-xl, .display-lg, .display-md {
  font-family: var(--font-display);
  font-weight: var(--weight-semibold);
  line-height: var(--leading-tight);
  letter-spacing: var(--tracking-tight);
  color: var(--color-text-primary);
  margin: 0;
}

h1, .h1 { font-size: var(--text-4xl); }
h2, .h2 { font-size: var(--text-3xl); }
h3, .h3 { font-size: var(--text-xl); font-weight: var(--weight-medium); }
h4, .h4 { font-size: var(--text-lg); font-weight: var(--weight-medium); }
h5, .h5 { font-size: var(--text-md); font-weight: var(--weight-medium); }
h6, .h6 { font-size: var(--text-sm); font-weight: var(--weight-medium); }

.display-xl {
  font-size: var(--text-5xl);
  line-height: 1.08;
  letter-spacing: -0.035em;
}

p, .body-base { font-size: var(--text-base); line-height: var(--leading-relaxed); }
.body-lg { font-size: var(--text-md); line-height: var(--leading-relaxed); }
.body-sm { font-size: var(--text-sm); line-height: var(--leading-normal); }
.body-xs { font-size: var(--text-xs); line-height: var(--leading-normal); }

.eyebrow {
  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight: var(--weight-semibold);
  letter-spacing: var(--tracking-wide);
  text-transform: uppercase;
  color: var(--color-text-brand);
}

.label {
  font-size: var(--text-sm);
  font-weight: var(--weight-medium);
  color: var(--color-text-secondary);
}

a {
  color: var(--color-green-400);
  text-decoration: none;
  transition: color var(--duration-fast) var(--ease-default);
}
a:hover { color: var(--color-green-600); }

strong { font-weight: var(--weight-semibold); }
em { font-style: italic; }

.section-header { margin-bottom: var(--space-10); }
.section-header .eyebrow { margin-bottom: var(--space-3); }
.section-header h2 { margin-bottom: var(--space-4); }
.section-header .section-intro {
  font-size: var(--text-lg);
  color: var(--color-text-secondary);
  max-width: 560px;
  line-height: var(--leading-relaxed);
}
.section-header.center { text-align: center; }
.section-header.center .section-intro { margin-inline: auto; }

.text-brand { color: var(--color-text-brand); }
.text-inverse { color: var(--color-text-inverse); }
.text-muted { color: var(--color-text-muted); }
.text-secondary { color: var(--color-text-secondary); }

.line-clamp-3 {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}