/* ==========================================================================
   PROMESA DESIGN SYSTEM
   TYPOGRAPHY 3.0 - QONTO DIRECTION, SOFTER LETTER SPACING
   ========================================================================== */

body {
  font-family: var(--pb-font-main);
  font-size: 18px;
  line-height: 1.65;
  color: var(--pb-color-ink);
  font-weight: 400;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0;
  font-weight: 850;
  color: var(--pb-color-ink);
  text-wrap: balance;
}

h1 {
  font-size: var(--pb-h1);
  max-width: 13ch;
  line-height: .94;
  letter-spacing: -0.026em;
}

h2 {
  font-size: var(--pb-h2);
  max-width: 16ch;
  line-height: .99;
  letter-spacing: -0.024em;
}

h3 {
  font-size: var(--pb-h3);
  line-height: 1.08;
  letter-spacing: -0.018em;
}

h4 {
  font-size: 1.55rem;
  line-height: 1.2;
  letter-spacing: -0.012em;
}

p {
  margin: 0;
  color: var(--pb-color-muted);
}

strong {
  color: var(--pb-color-ink);
  font-weight: 720;
}

.pb-lead,
.product-hero-lead {
  font-size: var(--pb-text-lead);
  line-height: 1.56;
  max-width: 42rem;
  color: var(--pb-color-muted);
}

.pb-small {
  font-size: 15px;
  line-height: 1.55;
  color: var(--pb-color-muted);
}

.pb-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 22px;
  font-size: 13px;
  font-weight: 760;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--pb-color-gold);
}

.pb-eyebrow::before {
  content: "";
  width: 38px;
  height: 1px;
  background: currentColor;
}

a {
  transition: color var(--pb-duration) var(--pb-ease), opacity var(--pb-duration) var(--pb-ease);
}

a:hover { color: var(--pb-color-green); }

ul,
ol {
  margin: 0;
  padding-left: 22px;
}

li {
  margin-bottom: 12px;
  color: var(--pb-color-muted);
}

blockquote {
  margin: 0;
  padding-left: 32px;
  border-left: 3px solid var(--pb-color-gold);
  font-size: 1.4rem;
  line-height: 1.5;
  color: var(--pb-color-ink);
}

.pb-section-header,
.product-section-heading {
  max-width: 850px;
  margin-bottom: 72px;
}

.pb-section-header h2,
.product-section-heading h2 {
  margin-bottom: 24px;
}

.pb-section-header p,
.product-section-heading p:not(.pb-eyebrow) {
  font-size: 1.18rem;
  line-height: 1.7;
}

.pb-stat-value {
  font-size: clamp(3rem,5vw,5rem);
  font-weight: 900;
  line-height: 1;
  letter-spacing: -.04em;
  color: var(--pb-color-green);
}

.pb-stat-label {
  margin-top: 12px;
  font-size: 15px;
  color: var(--pb-color-muted);
}

@media (max-width: 992px) {
  h1 { max-width: 100%; }
  h2 { max-width: 100%; }
  .pb-section-header,
  .product-section-heading { margin-bottom: 56px; }
}

@media (max-width: 768px) {
  body { font-size: 17px; }
  h1 { line-height: .98; letter-spacing: -0.022em; }
  h2 { line-height: 1.02; letter-spacing: -0.02em; }
  .pb-section-header,
  .product-section-heading { margin-bottom: 42px; }
  .pb-lead,
  .product-hero-lead { font-size: 1.12rem; }
}

/* ==========================================================
   PROMESA FRAMEWORK 3.1 — Mercury-style lighter typography
========================================================== */

h1,
h2,
h3,
h4,
h5,
h6 {
	font-weight: 520;
	letter-spacing: -0.008em;
}

h1 {
	line-height: 1.04;
	letter-spacing: -0.012em;
}

h2 {
	line-height: 1.08;
	letter-spacing: -0.006em;
}

h3 {
	line-height: 1.14;
	letter-spacing: -0.004em;
}

strong {
	font-weight: 620;
}

.pb-eyebrow {
	font-weight: 540;
	letter-spacing: 0.22em;
}

.pb-lead,
.product-hero-lead {
	line-height: 1.68;
	letter-spacing: 0.002em;
}

.pb-stat-value {
	font-weight: 560;
	letter-spacing: -0.012em;
}
