:root {
        --primary: hsl(76, 70%, 32%);
        --text: #1a1a1a;
        --bg: #ffffff;
        --muted: #f4f4f4;
        --border: #e0e0e0;
        --radius: 12px;
    }
    body {
        font-family: serif;
        line-height: 1.6;
        color: var(--text);
        margin: 0;
        background: var(--bg);
    }
    header { border-bottom: 1px solid var(--border); padding: 1rem; }
    nav a { margin: 0 10px; text-decoration: none; color: var(--text); }
    .container { max-width: 1000px; margin: 0 auto; padding: 2rem; }
    .grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 2rem; }
    .card { 
        border: none;
        box-shadow: none;
        padding: 1rem;
        border-radius: var(--radius);
    }
    footer { background: var(--muted); padding: 2rem; margin-top: 4rem; text-align: center; }
    .hero { background: var(--primary); color: white; padding: 4rem 2rem; text-align: center; margin-bottom: 2rem; }
    img.svg-placeholder { background: #eee; display: block; width: 100%; height: 200px; margin-bottom: 1rem; }