/* ── RESET ── */
*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
    font-family: 'Outfit', sans-serif;
    background: var(--white);
    color: var(--text-primary);
    overflow-x: hidden;
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
}

/* ── HEADINGS ── */
h1, h2, h3, h4, h5, h6 {
    font-family: 'Space Grotesk', sans-serif;
    letter-spacing: -0.02em;
    line-height: 1.2;
    color: var(--text-primary);
}

/* ── SECTION TYPOGRAPHY ── */
.section-eyebrow {
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--cyan);
    margin-bottom: 12px;
}
.section-heading {
    font-family: 'Space Grotesk', sans-serif;
    font-size: clamp(1.8rem, 3.5vw, 2.5rem);
    font-weight: 800;
    line-height: 1.15;
    color: var(--text-primary);
    margin-bottom: 16px;
    letter-spacing: -0.02em;
}
.section-sub {
    font-size: 1rem;
    color: var(--text-secondary);
    max-width: 560px;
    line-height: 1.7;
}

/* ── LINKS ── */
a { color: var(--cyan); }
a:hover { color: var(--cyan-dark); }

/* ── LOGO ── */
.logo-text {
    font-family: 'Space Grotesk', sans-serif;
    font-size: 1.6rem;
    font-weight: 800;
    font-style: italic;
    text-decoration: none;
}
.logo-text .reno { color: var(--navy); }
.logo-text .calc { color: var(--cyan); }

/* ── ARTICLE / BLOG PROSE ── */
article h2 { font-size: clamp(1.4rem, 2.5vw, 1.9rem); margin: 2rem 0 0.75rem; }
article h3 { font-size: clamp(1.1rem, 2vw, 1.4rem); margin: 1.75rem 0 0.6rem; }
article p { font-size: 1rem; line-height: 1.8; color: var(--text-secondary); margin-bottom: 1.2rem; }
article ul, article ol { padding-left: 1.5rem; margin-bottom: 1.2rem; }
article li { font-size: 1rem; line-height: 1.75; color: var(--text-secondary); margin-bottom: 0.4rem; }
article blockquote {
    border-left: 4px solid var(--cyan);
    padding: 12px 20px;
    background: var(--cyan-light);
    border-radius: 0 8px 8px 0;
    margin: 1.5rem 0;
    font-style: italic;
    color: var(--text-secondary);
}
article strong { color: var(--text-primary); font-weight: 700; }
article a { color: var(--cyan); text-decoration: underline; }