/*
 * RP Infotech global typography system
 * One self-hosted typeface and one responsive scale for every public page.
 */
@font-face {
    font-family: "Inter";
    src: url("../fonts/InterVariable.woff2") format("woff2-variations");
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
}

:root {
    --rp-font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --rp-text-body: 1rem;
    --rp-text-small: 0.875rem;
    --rp-leading-body: 1.72;
    --rp-heading-1: clamp(2rem, 3.2vw, 2.75rem);
    --rp-heading-2: clamp(1.75rem, 2.6vw, 2.25rem);
    --rp-heading-3: clamp(1.375rem, 1.9vw, 1.625rem);
    --rp-heading-4: clamp(1.1875rem, 1.4vw, 1.3125rem);
    --rp-heading-5: 1.125rem;
    --rp-heading-6: 1rem;
}

html {
    font-family: var(--rp-font-sans) !important;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

html body,
html body button,
html body input,
html body select,
html body textarea,
html body optgroup,
html body label,
html body table,
html body th,
html body td {
    font-family: var(--rp-font-sans) !important;
}

html body {
    font-size: var(--rp-text-body) !important;
    line-height: var(--rp-leading-body);
}

/* Consistent content text across every page template and dynamic record. */
#main-content p,
#main-content li,
#main-content blockquote,
#main-content dd,
#main-content dt {
    font-family: var(--rp-font-sans) !important;
    font-size: var(--rp-text-body) !important;
    line-height: var(--rp-leading-body) !important;
}

/* A semantic heading hierarchy: consistent, responsive and never oversized. */
html body #main-content h1,
html body .page-title-content h1 {
    font-family: var(--rp-font-sans) !important;
    font-size: var(--rp-heading-1) !important;
    line-height: 1.16 !important;
    letter-spacing: -0.025em;
    font-weight: 800 !important;
}

html body #main-content h2,
html body .page-title-content h2 {
    font-family: var(--rp-font-sans) !important;
    font-size: var(--rp-heading-2) !important;
    line-height: 1.22 !important;
    letter-spacing: -0.02em;
    font-weight: 800 !important;
}

html body #main-content h3,
html body .page-title-content h3 {
    font-family: var(--rp-font-sans) !important;
    font-size: var(--rp-heading-3) !important;
    line-height: 1.3 !important;
    letter-spacing: -0.012em;
    font-weight: 750 !important;
}

html body #main-content h4 {
    font-family: var(--rp-font-sans) !important;
    font-size: var(--rp-heading-4) !important;
    line-height: 1.35 !important;
    font-weight: 700 !important;
}

html body #main-content h5 {
    font-family: var(--rp-font-sans) !important;
    font-size: var(--rp-heading-5) !important;
    line-height: 1.4 !important;
    font-weight: 700 !important;
}

html body #main-content h6 {
    font-family: var(--rp-font-sans) !important;
    font-size: var(--rp-heading-6) !important;
    line-height: 1.45 !important;
    font-weight: 700 !important;
}

/* Navigation and interactive controls use one compact UI scale. */
html body .tracer-nav .navbar .navbar-nav .nav-item > a,
html body .mean-container .mean-nav ul li a {
    font-family: var(--rp-font-sans) !important;
    font-size: 0.9375rem !important;
}

html body .tracer-nav .navbar .navbar-nav .nav-item .dropdown-menu li a {
    font-family: var(--rp-font-sans) !important;
    font-size: 0.875rem !important;
}

html body button,
html body input,
html body select,
html body textarea,
html body .default-btn,
html body .read-more-btn,
html body [class*="submit-btn"],
html body [class*="submit_btn"] {
    font-size: 0.9375rem !important;
    line-height: 1.5 !important;
}

/* Small supporting UI remains compact without changing reading content. */
#main-content small,
#main-content .sub-title,
#main-content .post-meta,
#main-content .entry-meta,
#main-content .service-trust-strip,
#main-content .rp-trust-item,
#main-content .ty-eyebrow,
#main-content .badge {
    font-family: var(--rp-font-sans) !important;
    font-size: var(--rp-text-small) !important;
    line-height: 1.5 !important;
}

/* Footer copy is intentionally secondary but consistent on every page. */
html body .footer-area p,
html body .footer-area li,
html body .footer-area a,
html body .footer-bottom-area p,
html body .footer-bottom-area li,
html body .footer-bottom-area a {
    font-family: var(--rp-font-sans) !important;
    font-size: var(--rp-text-small) !important;
    line-height: 1.65 !important;
}

@media (max-width: 767.98px) {
    :root {
        --rp-heading-1: 2rem;
        --rp-heading-2: 1.75rem;
        --rp-heading-3: 1.375rem;
        --rp-heading-4: 1.1875rem;
    }

    #main-content p,
    #main-content li,
    #main-content blockquote,
    #main-content dd,
    #main-content dt {
        font-size: 1rem !important;
        line-height: 1.72 !important;
    }
}