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

:root {
  --sans: "Inter", sans-serif !important;
  --mono: "Inter", sans-serif !important;
  --display: "Space Grotesk", sans-serif !important;
}

body, button, input, select, textarea {
  font-family: "Inter", sans-serif !important;
}

h1, h2, h3, h1 strong, h2 strong, h3 strong, h1 em, h2 em, h3 em {
  font-family: "Space Grotesk", sans-serif !important;
  font-weight: 600;
  letter-spacing: -.04em;
}

h1 strong, h2 strong, h3 strong, h1 em, h2 em, h3 em {
  font-style: normal !important;
}

.hero-copy h1 {
  font-size: clamp(36px, 3.8vw, 56px) !important;
  line-height: 1.04 !important;
}

.pain-title h2,
.section-intro h2,
.flow-copy h2,
.human-ai-story .human-chapter h2,
.vision-statement h2,
.pricing-intro h2,
.questions-heading h2,
.final-copy h2 {
  font-size: clamp(32px, 3.8vw, 56px) !important;
  line-height: 1.06 !important;
}

@media (max-width: 600px) {
  .hero-copy h1 { font-size: clamp(30px, 8.5vw, 38px) !important; }
  .pain-title h2,
  .section-intro h2,
  .flow-copy h2,
  .human-ai-story .human-chapter h2,
  .vision-statement h2,
  .pricing-intro h2,
  .questions-heading h2,
  .final-copy h2 { font-size: clamp(28px, 8vw, 36px) !important; }
}