/* ==========================================================================
   Site-wide typography: one sleek, modern sans-serif (Jost) for every heading
   and all text, smaller headings, and no bold anywhere.
   Loaded last so it wins over every other Verto stylesheet.
   ========================================================================== */

:root {
	--vbx-font-head: "Jost", "Helvetica Neue", Arial, sans-serif;
	--vbx-font-body: "Jost", "Helvetica Neue", Arial, sans-serif;
	--vbx-font: "Jost", "Helvetica Neue", Arial, sans-serif;
}

/* 1. Everything Verto draws: regular weight. */
html body :where(.vbx, .vbb, .vbb-grid, .vbb-cta, #verto-header, #verto-footer, .vbx-form-card, .vbx-capture, .vb-modal, .vbx-buddy, .vb-form, .vbx-grv, .vbx-smenu, .vbx-roi, .vbx-pa, .vbx-dpa3, .vbx-pushask, .entry-content) * {
	font-weight: 400 !important;
}

/* 2. A little emphasis where it helps reading, never bold: buttons, links in menus,
      labels, strong text, numbers in cards, form labels. */
html body :where(.vbx, .vbb, .vbb-grid, .vbb-cta, #verto-header, #verto-footer, .vbx-form-card, .vbx-capture, .vb-modal, .vbx-buddy, .vb-form, .vbx-grv, .vbx-smenu, .vbx-roi, .vbx-pa, .vbx-dpa3, .vbx-pushask, .entry-content) :is(strong, b, th, label, button, .wp-block-button__link, .wp-element-button, .vbx-label, .vbx-status, .vbx-rec-heading, .vbx-rec-caption, .vbx-rec-cap, .vbx-svc-tag, .vbx-step-num, .vbx-footer-heading, .vbf-h, .vbh-link, .vbx-svc-link, .vbx-tool-cat) {
	font-weight: 500 !important;
}

/* 3. Headings: same family as the text, regular weight, calm spacing. */
html body :is(h1, h2, h3, h4, h5, h6),
html body .vbx :is(h1, h2, h3, h4, h5, h6):not(#vbx-reset),
html body :is(.vbx-title, .vbx-hero-title, .vbx-page-title, .vbx-cta-title, .vbx-pcta-title, .vbx-show-title, .vbx-news-title, .vbx-form-title, .vbx-pa-title, .vbx-pa-h, .vbx-pa-res-title, .vbx-pa-final-h, .vbx-pa-startcard-h, .vbx-dpa-title, .vbx-dpa-h, .vbx-calc-cta-title, .vbx-calc-h, .vbx-roi-h, .vbx-roi-next-h, .vbx-smenu-h, .vbx-nx-h, .vbx-feat-head, .vbx-wiz-q, .vbb-hero-title, .vbb-post-title, .vbb-card-title, .vbb-side-cta-t, .vbf-news-title, .vbf-svc-t, .vbh-pane-title, .vbh-feat-t, .vbh-tools-h) {
	font-family: var(--vbx-font-head) !important;
	font-weight: 400 !important;
	font-style: normal !important;
	letter-spacing: -0.012em !important;
	line-height: 1.18 !important;
}

/* 4. Smaller sizes. */
/* Page H1s */
html body :is(.vbx-hero-title, .vbx-page-title, .vbb-hero-title, .vbb-post-title),
html body .vbx-hero .vbx-hero-title {
	font-size: clamp(30px, 3.4vw, 48px) !important;
	line-height: 1.12 !important;
	--vbx-mw: 20ch;
	max-width: 20ch;
}
/* Section H2s */
html body .vbx .vbx-title,
html body :is(.vbx-cta-title, .vbx-pcta-title, .vbx-pa-title, .vbx-dpa-title, .vbx-pa-res-title, .vbx-dpa-start-l h3) {
	font-size: clamp(24px, 2.4vw, 34px) !important;
	--vbx-mw: 24ch;
}
html body .vbx-pa.is-started .vbx-pa-title { font-size: clamp(20px, 2vw, 26px) !important; }
/* Card and sub-section titles (H3s) */
html body .vbx h3:not(#vbx-reset),
html body :is(.vbx-svc-title, .vbx-loop-title, .vbx-feature-title, .vbx-value-title, .vbx-step-title, .vbx-work-title, .vbx-service-title, .vbx-prov-title, .vbx-feat-title, .vbx-help-title, .vbx-next-title, .vbx-ct-way-title, .vbx-ct-hours-title, .vbx-tool-card-title, .vbx-abt-val-title, .vbx-stats-sub, .vbx-plan-name, .vbx-show-title, .vbx-pa-h, .vbx-dpa-h, .vbx-calc-h, .vbx-roi-h, .vbx-roi-next-h, .vbx-smenu-h, .vbx-nx-h, .vbx-feat-head, .vbx-wiz-q, .vbx-pa-final-h, .vbx-pa-startcard-h, .vbx-form-title, .vbb-card-title, .vbb-side-cta-t, .vbf-svc-t, .vbh-pane-title, .vbh-feat-t) {
	font-size: clamp(17px, 1.35vw, 20px) !important;
	line-height: 1.3 !important;
}
/* Newsletter and small panel headings */
html body :is(.vbx-news-title, .vbf-news-title) { font-size: clamp(20px, 1.8vw, 24px) !important; }
/* Blog article headings */
html body .vbb :is(.vbb-content, .entry-content) h2 { font-size: clamp(22px, 2vw, 28px) !important; }
html body .vbb :is(.vbb-content, .entry-content) h3 { font-size: clamp(18px, 1.5vw, 22px) !important; }
/* Big numbers: lighter and a bit smaller */
html body :is(.vbx-badge-num, .vbx-leads-num, .vbx-statstrip-list strong, .vbx-rec-score, .vbx-plan-price, .vbx-calc-kpi strong, .vbx-roi-kpi strong, .vbx-grv-score, .vbx-pa-score-num) {
	font-weight: 400 !important;
	letter-spacing: -0.02em !important;
}
html body .vbx-badge-num { font-size: clamp(48px, 5vw, 72px) !important; }
html body .vbx-statstrip-list strong { font-size: clamp(26px, 2.4vw, 34px) !important; }
html body .vbx-rec-score { font-size: 30px !important; }
/* Scrolling ribbons and the big background word */
html body .vbx-ribbons li { font-size: clamp(16px, 1.6vw, 21px) !important; }
html body .vbx-ribbon-word { font-weight: 300 !important; }

/* 5. Header and footer menus: regular, slightly smaller. */
html body #verto-header :is(a, button) { font-weight: 400 !important; }
html body #verto-header :is(.vbh-cta, .wp-block-button__link, .vbh-btn) { font-weight: 500 !important; }

/* 6. Inline SVG pictures (dashboards, reports): no bold numbers either. */
html body :where(.vbx, .vbb) svg text { font-weight: 400 !important; font-family: var(--vbx-font-body) !important; }

/* Page headings (H1): tall Oswald capitals with a gold italic accent word. */
@font-face { font-family: "Oswald"; src: url("fonts/oswald-600.woff2") format("woff2"); font-weight: 600; font-style: normal; font-display: swap; }
html body :is(.vbx-hero-title, .vbx-page-title, .vbb-hero-title):not(#vbx-x),
html body :is(.vbx, .vbb, .entry-content) h1:is(.vbx-hero-title, .vbx-page-title, .vbb-hero-title):not(#vbx-x),
html body .vbx-hero .vbx-hero-title:not(#vbx-x) {
	font-family: "Oswald", "Arial Narrow", "Helvetica Neue", Arial, sans-serif !important;
	font-weight: 600 !important;
	text-transform: uppercase;
	letter-spacing: 0 !important;
	line-height: 1.06 !important;
	font-size: clamp(38px, 5vw, 72px) !important;
	--vbx-mw: 22ch;
	max-width: 22ch;
}
html body .vbx-hero .vbx-hero-title:not(#vbx-x),
html body :is(.vbx, .entry-content) .vbx-hero h1.vbx-hero-title:not(#vbx-x) { font-size: clamp(44px, 6vw, 88px) !important; max-width: 16ch; }
html body :is(.vbx, .vbb, .entry-content) :is(.vbx-hero-title, .vbx-page-title, .vbb-hero-title) em.vbx-accent:not(#vbx-x),
html body :is(.vbx-hero-title, .vbx-page-title, .vbb-hero-title) em.vbx-accent {
	font-family: "Playfair Display", Georgia, "Times New Roman", serif !important;
	font-style: italic !important;
	font-weight: 500 !important;
	text-transform: none;
	letter-spacing: 0;
	font-size: .9em;
	color: var(--vbx-accent, #334155);
}
:is(.vbx-light, .is-light) :is(.vbx-hero-title, .vbx-page-title) em.vbx-accent { color: #1E293B; }
@media (max-width: 600px) {
	html body :is(.vbx-hero-title, .vbx-page-title, .vbb-hero-title):not(#vbx-x),
	html body :is(.vbx, .vbb, .entry-content) h1:is(.vbx-hero-title, .vbx-page-title, .vbb-hero-title):not(#vbx-x),
	html body .vbx-hero .vbx-hero-title:not(#vbx-x) { font-size: clamp(32px, 9.6vw, 44px) !important; line-height: 1.08 !important; max-width: none; }
}

/* "What Every … Includes" headings: same size as the other section headings. */
html body .vbx .vbx-feat-head:not(#vbx-reset),
html body .vbx h3.vbx-feat-head:not(#vbx-reset) {
	font-size: clamp(24px, 2.4vw, 34px) !important;
	line-height: 1.18 !important;
	--vbx-mw: 24ch;
}