:root {
    --eco-verde: #92D050;
    --eco-verde-profundo: #4C6B21;
    --eco-verde-claro: #EEF6E2;
    --eco-verde-noite: #131A09;
    --eco-tinta: #1C1B18;
    --eco-texto: #4A4842;
    --eco-cinza: #63666B;
    --eco-linha: #E9E7E0;
    --eco-fundo: #F7F6F2;
    --branco: #FFFFFF;
}

body {
    background-color: var(--eco-fundo);
    color: var(--eco-texto);
    font-family: 'Open Sans', sans-serif;
}

h1, h2, h3, h4, h5, h6, .eco-title {
    font-family: 'Montserrat', sans-serif;
    color: var(--eco-tinta);
    letter-spacing: -0.02em;
}

h1 {
    font-size: 60px;
    line-height: 1.08;
    font-weight: 800;
}

@media (max-width: 768px) {
    h1 {
        font-size: 44px;
    }
}

h2 {
    font-size: 28px;
    font-weight: 700;
}

.eco-card {
    background-color: var(--branco);
    border: 1px solid var(--eco-linha);
    border-radius: 16px;
    padding: 32px;
    transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}

.eco-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 40px -22px rgba(35, 51, 15, 0.35);
    border-color: var(--eco-verde);
}

.eco-btn-primary {
    background-color: var(--eco-verde);
    color: var(--eco-verde-noite);
    font-family: 'Open Sans', sans-serif;
    font-size: 14px;
    font-weight: 600;
    padding: 14px 28px;
    border-radius: 999px;
    border: none;
    cursor: pointer;
    text-decoration: none;
    display: inline-block;
    transition: opacity 0.3s ease;
}

.eco-btn-primary:hover {
    opacity: 0.9;
}

.eco-btn-outline {
    background-color: transparent;
    color: var(--eco-verde-profundo);
    font-family: 'Open Sans', sans-serif;
    font-size: 14px;
    font-weight: 600;
    padding: 14px 28px;
    border-radius: 999px;
    border: 1px solid var(--eco-verde-profundo);
    cursor: pointer;
    text-decoration: none;
    display: inline-block;
    transition: background-color 0.3s ease, border-color 0.3s ease;
}

.eco-btn-outline:hover {
    background-color: var(--eco-verde);
    border-color: var(--eco-verde);
    color: var(--eco-verde-noite);
}

.eco-chip {
    background-color: var(--eco-verde-claro);
    color: var(--eco-verde-profundo);
    font-family: 'Open Sans', sans-serif;
    font-size: 13px;
    font-weight: 600;
    padding: 4px 12px;
    border-radius: 999px;
    display: inline-block;
}

.eco-eyebrow {
    font-family: 'Montserrat', sans-serif;
    font-size: 14px;
    font-weight: 700;
    color: var(--eco-verde-profundo);
    text-transform: uppercase;
    letter-spacing: 0.16em;
    display: block;
    margin-bottom: 8px;
}