@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&family=Poppins:wght@600;700&display=swap');

/* Typography Defaults */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-headings);
  color: var(--color-dark-text);
  line-height: 1.2;
  letter-spacing: -0.02em;
}

h1 {
  font-size: 3.5rem;
  font-weight: var(--weight-bold);
}

h2 {
  font-size: 2.75rem;
  font-weight: var(--weight-semibold);
}

h3 {
  font-size: 2rem;
  font-weight: var(--weight-semibold);
}

h4 {
  font-size: 1.5rem;
  font-weight: var(--weight-semibold);
}

p {
  font-family: var(--font-body);
  font-size: 1.125rem;
  font-weight: var(--weight-regular);
  color: var(--color-light-text);
  line-height: 1.6;
}

/* Responsive typography scaling */
@media (max-width: 992px) {
  h1 { font-size: 2.85rem; }
  h2 { font-size: 2.25rem; }
  h3 { font-size: 1.75rem; }
  p { font-size: 1.05rem; }
}

@media (max-width: 576px) {
  h1 { font-size: 2.25rem; }
  h2 { font-size: 1.85rem; }
  h3 { font-size: 1.5rem; }
  p { font-size: 1rem; }
}

/* Typography Utility Classes */
.text-display {
  font-family: var(--font-headings);
  font-size: 4.5rem;
  font-weight: var(--weight-bold);
  line-height: 1.1;
  letter-spacing: -0.03em;
}

@media (max-width: 992px) {
  .text-display { font-size: 3.5rem; }
}
@media (max-width: 576px) {
  .text-display { font-size: 2.75rem; }
}

.text-lead {
  font-size: 1.25rem;
  line-height: 1.7;
  font-weight: var(--weight-medium);
}

.text-meta {
  font-size: 0.875rem;
  font-weight: var(--weight-medium);
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--color-primary-green);
}

.text-semibold {
  font-weight: var(--weight-semibold);
}

.text-bold {
  font-weight: var(--weight-bold);
}