/* ============================================================
   NMREC — GLOBAL TYPOGRAPHY SYSTEM
   Version: 2026-09-15

   HEADINGS
   Urbanist 500 / 600 / 700

   BODY / UI
   Poppins 300 / 400 / 500 / 600
============================================================ */


/* ============================================================
   GOOGLE FONTS
============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,300;0,400;0,500;0,600;1,300;1,400;1,500;1,600&family=Urbanist:ital,wght@0,500;0,600;0,700;1,500;1,600;1,700&display=swap');


/* ============================================================
   VARIABLES
============================================================ */

:root {

    /* Families */

    --font-heading:
        "Urbanist",
        sans-serif;

    --font-body:
        "Poppins",
        sans-serif;


    /* Urbanist */

    --urbanist-medium:
        500;

    --urbanist-semibold:
        600;

    --urbanist-bold:
        700;


    /* Poppins */

    --poppins-light:
        300;

    --poppins-regular:
        400;

    --poppins-medium:
        500;

    --poppins-semibold:
        600;

}


/* ============================================================
   GLOBAL BASE
============================================================ */

html,
body {

    font-family:
        var(--font-body) !important;

}


body {

    font-weight:
        var(--poppins-regular);

}


/* ============================================================
   BODY TEXT
============================================================ */

p,
li,
dt,
dd,
blockquote,
figcaption,
caption,
table,
th,
td {

    font-family:
        var(--font-body) !important;

    font-weight:
        var(--poppins-regular);

}


/* ============================================================
   HEADINGS
============================================================ */

h1,
h2,
h3,
h4,
h5,
h6 {

    font-family:
        var(--font-heading) !important;

    font-style:
        normal;

}


/* Primary headings */

h1,
h2 {

    font-weight:
        var(--urbanist-bold) !important;

}


/* Secondary headings */

h3 {

    font-weight:
        var(--urbanist-semibold) !important;

}


/* Small headings */

h4,
h5,
h6 {

    font-weight:
        var(--urbanist-medium) !important;

}


/* ============================================================
   OFFICIAL NMREC HEADING CLASSES
============================================================ */

.nmrec-heading-medium {

    font-family:
        var(--font-heading) !important;

    font-weight:
        var(--urbanist-medium) !important;

}


.nmrec-heading-semibold {

    font-family:
        var(--font-heading) !important;

    font-weight:
        var(--urbanist-semibold) !important;

}


.nmrec-heading-bold {

    font-family:
        var(--font-heading) !important;

    font-weight:
        var(--urbanist-bold) !important;

}


/* ============================================================
   OFFICIAL NMREC BODY CLASSES
============================================================ */

.nmrec-body-light {

    font-family:
        var(--font-body) !important;

    font-weight:
        var(--poppins-light) !important;

}


.nmrec-body-regular {

    font-family:
        var(--font-body) !important;

    font-weight:
        var(--poppins-regular) !important;

}


.nmrec-body-medium {

    font-family:
        var(--font-body) !important;

    font-weight:
        var(--poppins-medium) !important;

}


.nmrec-body-semibold {

    font-family:
        var(--font-body) !important;

    font-weight:
        var(--poppins-semibold) !important;

}


/* ============================================================
   NAVIGATION
============================================================ */

nav,
nav a,
nav button,
header a,
header button {

    font-family:
        var(--font-body) !important;

}


nav a,
nav button,
header a,
header button {

    font-weight:
        var(--poppins-medium);

}


/* ============================================================
   BUTTONS / CTAs
============================================================ */

button,
.btn,
.button,
[role="button"],
input[type="submit"],
input[type="button"] {

    font-family:
        var(--font-body) !important;

    font-weight:
        var(--poppins-semibold);

}


/* ============================================================
   LINKS
============================================================ */

a {

    font-family:
        var(--font-body) !important;

}


/* ============================================================
   FORMS
============================================================ */

label {

    font-family:
        var(--font-body) !important;

    font-weight:
        var(--poppins-medium);

}


input,
textarea,
select,
option {

    font-family:
        var(--font-body) !important;

    font-weight:
        var(--poppins-regular);

}


/* ============================================================
   SMALL TEXT / METADATA
============================================================ */

small,
.meta,
.metadata,
.caption {

    font-family:
        var(--font-body) !important;

    font-weight:
        var(--poppins-regular);

}


/* ============================================================
   SUPPORTING / HERO TEXT
============================================================ */

.supporting-text,
.lead,
.hero-support {

    font-family:
        var(--font-body) !important;

    font-weight:
        var(--poppins-light);

}


/* ============================================================
   EYEBROWS / SECTION LABELS
============================================================ */

.eyebrow,
.overline,
.kicker,
.section-label {

    font-family:
        var(--font-heading) !important;

    font-weight:
        var(--urbanist-semibold) !important;

}


/* ============================================================
   ARTICLES / BLOG / PRIVACY
============================================================ */

.article-content,
.article-content p,
.article-content li,
.article-content dt,
.article-content dd {

    font-family:
        var(--font-body) !important;

    font-weight:
        var(--poppins-regular) !important;

}


.article-content h1,
.article-content h2 {

    font-family:
        var(--font-heading) !important;

    font-weight:
        var(--urbanist-bold) !important;

}


.article-content h3 {

    font-family:
        var(--font-heading) !important;

    font-weight:
        var(--urbanist-semibold) !important;

}


.article-content h4,
.article-content h5,
.article-content h6 {

    font-family:
        var(--font-heading) !important;

    font-weight:
        var(--urbanist-medium) !important;

}


.article-content blockquote {

    font-family:
        var(--font-body) !important;

    font-weight:
        var(--poppins-regular) !important;

    font-style:
        italic;

}


/* ============================================================
   FOOTER
============================================================ */

footer {

    font-family:
        var(--font-body) !important;

    font-weight:
        var(--poppins-regular);

}


footer a,
footer p,
footer li {

    font-family:
        var(--font-body) !important;

}


/* ============================================================
   TAILWIND FAMILY COMPATIBILITY

   These mappings prevent old pages from reintroducing
   Montserrat, serif fonts or monospace fonts into the
   institutional visual system.
============================================================ */

.font-sans {

    font-family:
        var(--font-body) !important;

}


.font-serif {

    font-family:
        var(--font-heading) !important;

}


.font-mono {

    font-family:
        var(--font-body) !important;

}


/* ============================================================
   LEGACY WEIGHT COMPATIBILITY

   IMPORTANT:
   Poppins 700 is intentionally NOT used.

   Old utility classes that remain elsewhere in the site
   are safely constrained to the weights loaded by NMRec.
============================================================ */

.font-thin,
.font-extralight,
.font-light {

    font-weight:
        var(--poppins-light) !important;

}


.font-normal {

    font-weight:
        var(--poppins-regular) !important;

}


.font-medium {

    font-weight:
        var(--poppins-medium) !important;

}


.font-semibold {

    font-weight:
        var(--poppins-semibold) !important;

}


/*
   Legacy bold utilities are limited to 600.

   Official headings should use:
   .nmrec-heading-bold

   Official CTAs should use:
   .nmrec-body-semibold
*/

.font-bold,
.font-extrabold,
.font-black {

    font-weight:
        var(--poppins-semibold) !important;

}


/* ============================================================
   CORRECTION FOR LEGACY HEADING + BOLD COMBINATIONS

   Prevents old h1/h2 elements containing font-bold,
   font-extrabold or font-black from being reduced to
   Poppins-style 600.

   They remain Urbanist 700.
============================================================ */

h1.font-bold,
h1.font-extrabold,
h1.font-black,
h2.font-bold,
h2.font-extrabold,
h2.font-black {

    font-family:
        var(--font-heading) !important;

    font-weight:
        var(--urbanist-bold) !important;

}


h3.font-bold,
h3.font-extrabold,
h3.font-black,
h3.font-semibold {

    font-family:
        var(--font-heading) !important;

    font-weight:
        var(--urbanist-semibold) !important;

}


h4.font-bold,
h4.font-extrabold,
h4.font-black,
h4.font-semibold,
h5.font-bold,
h5.font-extrabold,
h5.font-black,
h5.font-semibold,
h6.font-bold,
h6.font-extrabold,
h6.font-black,
h6.font-semibold {

    font-family:
        var(--font-heading) !important;

    font-weight:
        var(--urbanist-medium) !important;

}


/* ============================================================
   EXPLICIT NMREC CLASSES ALWAYS WIN

   Repeated at the end intentionally so these classes override
   legacy Tailwind weight utilities when both are present.
============================================================ */

.nmrec-heading-medium {

    font-family:
        var(--font-heading) !important;

    font-weight:
        500 !important;

}


.nmrec-heading-semibold {

    font-family:
        var(--font-heading) !important;

    font-weight:
        600 !important;

}


.nmrec-heading-bold {

    font-family:
        var(--font-heading) !important;

    font-weight:
        700 !important;

}


.nmrec-body-light {

    font-family:
        var(--font-body) !important;

    font-weight:
        300 !important;

}


.nmrec-body-regular {

    font-family:
        var(--font-body) !important;

    font-weight:
        400 !important;

}


.nmrec-body-medium {

    font-family:
        var(--font-body) !important;

    font-weight:
        500 !important;

}


.nmrec-body-semibold {

    font-family:
        var(--font-body) !important;

    font-weight:
        600 !important;

}