/* ================================================================
   OnlySatvik — global typography (v2.8.8)

   ONE pairing for the whole site, per the owner's pick:
   Poppins for headings, Inter for body. Until this layer existed
   the site quietly ran five fonts: Rubik (the base theme's font,
   injected by the ACF skin CSS in wp_head), Poppins/Inter (the
   v2 surfaces), Roboto (the order-confirmation template),
   Monoton (decorative legacy elements) and Arial Narrow
   (leftover components) — the "messed up fonts" the owner saw.

   This file loads after the design layers and outranks the
   skin-generated CSS, so every surface — legacy pages, Woo
   pages, Elementor pages, the cart drawer — lands on the same
   two families. Icon fonts (Font Awesome) and monospace are
   deliberately untouched.
   ================================================================ */

:root {
	/* The older design system's token pointed at Arial Narrow;
	   re-point it so every component using var(--os-font) (cart
	   drawer, order bar) follows the site pairing. */
	--os-font: 'Inter', 'Helvetica Neue', Arial, sans-serif;
}

/* Body text: Inter. Includes the exact selector groups the
   base theme's skin CSS uses for text, menu-adjacent copy and
   breadcrumbs, so nothing falls back to the skin's font. */
body,
.sb-text,
.sb-text.sb-text-lg,
.sb-faq .sb-answer,
.description,
.single-post-text,
.post-text-bottom,
.sb-breadcrumbs,
.sb-preloader .sb-preloader-body .sb-loading,
.sb-faq .sb-plus-minus-toggle,
input,
select,
textarea {
	font-family: 'Inter', 'Helvetica Neue', Arial, sans-serif !important;
}

/* Headings and heading-like UI: Poppins. Covers the element
   selectors and the skin's .sb-h* classes, the main navigation,
   buttons, the text logotype, and the three decorative elements
   that used to render in Monoton (404 numeral, feature numbers,
   the experience illustration headline). */
h1, h2, h3, h4, h5, h6,
.sb-h1, .sb-h2, .sb-h3, .sb-h4, .sb-h5, .sb-h6,
nav .sb-navigation li a,
button,
.sb-btn,
.button,
input[type='submit'],
input[type='button'],
.sb-404,
.sb-features-item .sb-number,
.sb-illustration-2 .sb-experience .sb-exp-content .sb-h1,
span.logotype__title,
.sb-btn .sb-icon,
.sb-filter .sb-filter-link,
.sb-input-number-frame .sb-input-number-btn,
.wp-block-button__link,
.wp-block-search .wp-block-search__button {
	font-family: 'Poppins', 'Arial Narrow', 'Helvetica Neue', Arial, sans-serif !important;
}

/* Letter spacing (v2.9.61): the base theme's heading rules carry
   negative tracking tuned for its old font — h1 −3px, h2 −2px,
   h3 −1px (plus −1px on category titles, the success title and
   two WooCommerce headings). Poppins is a much wider face, so
   those values make heading letters touch and overlap (owner's
   phone screenshot, 2026-11-01). Headings sit at normal spacing
   everywhere; Poppins needs no squeezing to look right. */
h1, h2, h3, h4, h5, h6,
.sb-h1, .sb-h2, .sb-h3, .sb-h4, .sb-h5, .sb-h6,
.sb-cate-title,
.sb-success-result .sb-success-title,
#customer_login h2,
.woocommerce .woocommerce-order-details h2,
.woocommerce .woocommerce-order-downloads h2 {
	letter-spacing: 0 !important;
}

/* Elementor: the kit's global fonts live in the database and
   widgets can carry their own typography, so pin the two
   widget families customers actually read. Everything else in
   Elementor inherits the body/headings rules above. */
.elementor-heading-title {
	font-family: 'Poppins', 'Arial Narrow', 'Helvetica Neue', Arial, sans-serif !important;
}
.elementor-widget-text-editor {
	font-family: 'Inter', 'Helvetica Neue', Arial, sans-serif !important;
}

/* Elementor widgets the kit's global typography would otherwise
   reach first (v2.9.34 audit): buttons, menu items, tab and
   accordion titles are heading-like (Poppins); icon-list and
   box descriptions are body copy (Inter). The staging audit
   found the base theme's skin CSS still naming Roboto for its
   own selectors — every one of those selectors is now pinned
   above (preloader and button icons included), and the audit
   harness re-checks that coverage on every build. */
.elementor-button,
.elementor-nav-menu--main .elementor-item,
.elementor-accordion .elementor-tab-title,
.elementor-toggle .elementor-tab-title,
.elementor-icon-box-title,
.elementor-image-box-title {
	font-family: 'Poppins', 'Arial Narrow', 'Helvetica Neue', Arial, sans-serif !important;
}
.elementor-icon-list-text,
.elementor-icon-box-description,
.elementor-image-box-description {
	font-family: 'Inter', 'Helvetica Neue', Arial, sans-serif !important;
}

/* Heading line-height (v2.9.47): Elementor's heading default is
   line-height 1, so a wrapped h1/h2 sits its lines exactly on top
   of each other (390px audit: 40px font / 40px leading, 4px of
   line-box intersection). Pin headings to 1.15 so multi-line
   headings breathe; single-line headings are unaffected in
   practice (the line box is the text height either way). */
h1,
h2,
.elementor-heading-title {
	line-height: 1.15 !important;
}