/* ───── CSS Variables ───── */
:root {
    --green-dark:   #2d3a1e;
    --green-mid:    #4a5e2f;
    --green-light:  #7a9448;
    --cream:        #f5f0e8;
    --cream-dark:   #ede5d5;
    --red:          #c0392b;
    --red-hover:    #a93226;
    --text-dark:    #1a1a1a;
    --text-mid:     #444;
    --text-light:   #888;
    --white:        #ffffff;
    --shadow:       0 2px 16px rgba(0,0,0,0.09);
    --radius:       6px;
}

/* ───── Reset ───── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
    font-family: 'Mulish', sans-serif;
    background: var(--cream);
    color: var(--text-dark);
    min-height: 100vh;
}
a { text-decoration: none; color: inherit; }
img { display: block; max-width: 100%; }
ul { list-style: none; }

/* ───── Layout ───── */
.main-wrapper {
    max-width: 1400px;
    margin: 0 auto;
}

.section-heading {
    font-family: 'Unbounded', sans-serif;
    font-size: 20px;
    font-weight: 700;
    color: var(--text-dark);
    margin-bottom: 4px;
}

.sub-section {
    margin-bottom: 40px;
}

.main-wrapper {
    max-width: 1400px;
    margin: 0 auto;
    padding: 24px;
    display: block; /* вместо grid */
}