/* ============================================================================
   TYPOGRAPHY
   ----------------------------------------------------------------------------
   Heading font: Poppins (600 / 700). Body font: Manrope (400 / 500 / 600).
   Heading scale and body sizes follow the Volume-1 spec. Responsive sizing is
   handled in responsive.css; this file sets the desktop baseline.
   ============================================================================ */

body {
    font-family: var(--font-body);
    font-weight: var(--fw-regular);
    font-size: var(--body-size);
    line-height: var(--line-height-base);
    color: var(--color-text);
    background-color: var(--color-white);
    letter-spacing: 0.1px;
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-heading);
    font-weight: var(--fw-bold);
    line-height: var(--line-height-heading);
    color: var(--color-navy);
    letter-spacing: -0.01em;
}

h1, .h1 { font-size: var(--h1-size); }
h2, .h2 { font-size: var(--h2-size); }
h3, .h3 { font-size: var(--h3-size); font-weight: var(--fw-semibold); }
h4, .h4 { font-size: var(--h4-size); font-weight: var(--fw-semibold); }

p {
    color: var(--color-text-secondary);
    line-height: var(--line-height-base);
}

/* Constrain reading measure for long-form paragraphs. */
.lead,
.measure {
    max-width: var(--measure);
}

.lead {
    font-size: 1.125rem;
    color: var(--color-text-secondary);
}

/* Text colour helpers (mapped to tokens — no raw hex in markup). */
.text-primary-blue { color: var(--color-primary) !important; }
.text-accent-green { color: var(--color-accent) !important; }
.text-navy { color: var(--color-navy) !important; }
.text-body-main { color: var(--color-text) !important; }
.text-muted-2 { color: var(--color-text-secondary) !important; }
.text-white-90 { color: rgba(255, 255, 255, 0.9) !important; }

.fw-medium { font-weight: var(--fw-medium) !important; }
.fw-semibold { font-weight: var(--fw-semibold) !important; }

/* Highlight a word inside a heading (e.g. "Commercial" in green). */
.text-highlight {
    color: var(--color-accent);
}

/* Eyebrow / kicker label above section titles. */
.eyebrow {
    display: inline-block;
    font-family: var(--font-body);
    font-weight: var(--fw-semibold);
    font-size: 0.8125rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--color-primary);
}

/* Links that behave like inline anchors within copy. */
.link-inline {
    color: var(--color-primary);
    font-weight: var(--fw-semibold);
    transition: color var(--transition-base);
}

.link-inline:hover {
    color: var(--color-accent-dark);
}
