html {
  scroll-behavior: smooth;
}

body {
  font-feature-settings: "cv02", "cv03", "cv04", "cv11";
}

.eyebrow-pill {
  display: inline-flex;
  align-items: center;
  border: 1px solid #dbeafe;
  border-radius: 999px;
  background: #eff6ff;
  padding: .45rem .75rem;
  color: #1d4ed8;
  font-size: .75rem;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.section-eyebrow {
  color: #155eef;
  font-size: .75rem;
  font-weight: 700;
  letter-spacing: .18em;
  text-align: center;
  text-transform: uppercase;
}

.section-title {
  margin-top: .75rem;
  color: #101828;
  font-size: 2rem;
  font-weight: 600;
  letter-spacing: -.03em;
  line-height: 1.12;
}

@media (min-width: 640px) {
  .section-title {
    font-size: 2.5rem;
  }
}

.section-lead {
  margin-top: 1rem;
  color: #667085;
  font-size: 1.05rem;
  line-height: 1.8;
}

.card {
  border: 1px solid #e5e7eb;
  border-radius: 1.5rem;
  background: #fff;
  box-shadow: 0 1px 2px rgba(16, 24, 40, .04);
}

.btn-primary,
.btn-secondary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  padding: .85rem 1.2rem;
  font-size: .9rem;
  font-weight: 700;
  transition: .2s;
}

.btn-primary {
  gap: .5rem;
  background: #101828;
  color: #fff;
}

.btn-primary:hover {
  background: #344054;
}

.btn-secondary {
  border: 1px solid #d0d5dd;
  background: #fff;
  color: #344054;
}

.btn-secondary:hover {
  background: #f9fafb;
}

.language-menu {
  position: absolute;
  top: calc(100% + .5rem);
  right: 0;
  width: 12rem;
  overflow: hidden;
  border: 1px solid #e5e7eb;
  border-radius: 1rem;
  background: #fff;
  box-shadow: 0 16px 40px rgba(16, 24, 40, .12);
  padding: .35rem;
}

.prose h1 {
  font-size: 2.25rem;
  font-weight: 600;
  letter-spacing: -.03em;
  line-height: 1.15;
}

.prose h2 {
  margin-top: 2rem;
  font-size: 1.35rem;
  font-weight: 600;
}

.prose p,
.prose li {
  color: #475467;
  line-height: 1.8;
}
