body {
    font-family: var(--font-sans);
    font-size: var(--fs-base);
    font-weight: var(--fw-regular);
    line-height: var(--lh-base);
    color: var(--color-ink-green);
    background-color: var(--color-surface);
}

/* ── Headings ── */
h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--font-serif);
    font-weight: var(--fw-bold);
    line-height: var(--lh-tight);
    color: var(--color-ink-green);
}

h1 {
    font-size: var(--fs-4xl);
}

h2 {
    font-size: var(--fs-3xl);
}

h3 {
    font-size: var(--fs-2xl);
}

h4 {
    font-size: var(--fs-xl);
}

h5 {
    font-size: var(--fs-lg);
}

h6 {
    font-size: var(--fs-md);
}

@media (max-width: 768px) {
    h1 {
        font-size: var(--fs-3xl);
    }

    h2 {
        font-size: var(--fs-2xl);
    }

    h3 {
        font-size: var(--fs-xl);
    }
}

@media (max-width: 480px) {
    h1 {
        font-size: var(--fs-2xl);
    }

    h2 {
        font-size: var(--fs-xl);
    }
}

/* ── Texto ── */
p {
    line-height: var(--lh-base);
    max-width: 68ch;
}

p+p {
    margin-top: var(--sp-2);
}

a {
    color: var(--color-olive-main);
    transition: color var(--t-fast);
}

a:hover {
    color: var(--color-olive-deep);
}

strong {
    font-weight: var(--fw-bold);
}

em {
    font-style: italic;
}

/* ── Section label (eyebrow text) ── */
.section-label {
    display: inline-block;
    font-family: var(--font-sans);
    font-size: var(--fs-xs);
    font-weight: var(--fw-bold);
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--color-olive-main);
    margin-bottom: var(--sp-2);
}

/* ── Scroll animations ── */
.fade-up {
    opacity: 0;
    transform: translateY(28px);
    transition: opacity var(--t-slow), transform var(--t-slow);
}

.fade-up.visible,
.js-enabled .fade-up.visible {
    opacity: 1;
    transform: translateY(0);
}

/* ── Focus states (accessibility) ── */
:focus-visible {
    outline: 3px solid var(--color-gold);
    outline-offset: 3px;
    border-radius: 4px;
}

/* ── Selection ── */
::selection {
    background: var(--color-gold);
    color: var(--color-ink-green);
}

/* ── Horizontal rule ── */
hr {
    border: none;
    border-top: 1px solid rgba(23, 31, 20, 0.1);
    margin: var(--sp-6) 0;
}

/* ── Images ── */
.img-cover {
    width: 100%;
    height: 100%;
    object-fit: cover;
}