/* Font stacks — families loaded via Google Fonts link in app/layout.tsx */
:root {
  --font-plus-jakarta: 'Plus Jakarta Sans', system-ui, sans-serif;
  --font-inter: 'Inter', system-ui, sans-serif;
  --font-poppins: 'Poppins', system-ui, sans-serif;
  --font-manrope: 'Manrope', system-ui, sans-serif;
  --font-roboto: 'Roboto', system-ui, sans-serif;
}

/* Plus Jakarta Sans — SaaSo-style headings */
.ss-h1,
.ss-h2,
.ss-h3,
.ss-h4,
.ss-eyebrow,
.ss-btn,
.ss-pricing-card__name,
.ss-pricing-card__price,
.ss-blog-card__title,
.ss-footer h4,
.ss-footer__brand,
.mkt-brand,
.mkt-btn.mkt-btn--primary {
  font-family: var(--font-plus-jakarta), var(--font-poppins), sans-serif;
  letter-spacing: -0.02em;
}

/* Inter — body & UI */
.mkt-shell,
.ss-lead,
.ss-contact-field input,
.ss-contact-field select,
.ss-contact-field textarea,
.mkt-nav__link {
  font-family: var(--font-inter), var(--font-manrope), system-ui, sans-serif;
}

/* Legacy optibiz classes still used in how-it-works */
.font-display,
.ob-h1,
.ob-h2,
.ob-h3,
.ob-page-hero .ob-h1,
.auth-hero-title,
.auth-form-head h1,
.mkt-nav__brand,
.pricing-plan-card__name {
  font-family: var(--font-plus-jakarta), var(--font-poppins), var(--font-manrope), sans-serif;
  letter-spacing: -0.02em;
}

body,
.font-ui,
.ob-lead,
.ob-btn,
.auth-hero-sub,
.auth-check-item,
.auth-switch,
.auth-divider,
.btn,
label.label,
.auth-checkbox span,
.ob-process__tab-label {
  font-family: var(--font-inter), var(--font-manrope), system-ui, sans-serif;
}

.font-body,
input,
textarea,
select,
.auth-field-hint,
.auth-page .auth-form-body .input,
.auth-page .auth-form-body .label,
.pricing-compare__table,
.ob-contact-field input,
.ob-contact-field textarea,
.ob-contact-field select {
  font-family: var(--font-roboto), var(--font-inter), system-ui, sans-serif;
}