:root {
    --color-bg: #ffffff;
    --color-bg2: #f9f9f9;
    /* --color-primary: #8b5a2b; */
    --color-primary: #1f2e54;
    --color-secondary: #4a4e57;
    --color-accent: #ff9500;
    --color-text: #212934;
    --color-text-secondary: #1f2e54;
    --color-header: #fef7b7;
    --color-footer: #e2e2e2;

    --font-base: "Helvetica Neue", Arial, sans-serif;
    --font-heading: "Helvetica Neue", Arial, sans-serif;

    --awb-color1: #ffffff;
    --awb-color1-h: 0;
    --awb-color1-s: 0%;
    --awb-color1-l: 100%;
    --awb-color1-a: 100%;
    --awb-color2: #f9f9f9;
    --awb-color2-h: 0;
    --awb-color2-s: 0%;
    --awb-color2-l: 98%;
    --awb-color2-a: 100%;
    --awb-color3: #e2e2e2;
    --awb-color3-h: 0;
    --awb-color3-s: 0%;
    --awb-color3-l: 89%;
    --awb-color3-a: 100%;
    --awb-color4: #1f2e54;
    --awb-color4-h: 223;
    --awb-color4-s: 46%;
    --awb-color4-l: 23%;
    --awb-color4-a: 100%;
    --awb-color5: #ff9500;
    --awb-color5-h: 35;
    --awb-color5-s: 100%;
    --awb-color5-l: 50%;
    --awb-color5-a: 100%;
    --awb-color6: #4a4e57;
    --awb-color6-h: 222;
    --awb-color6-s: 8%;
    --awb-color6-l: 32%;
    --awb-color6-a: 100%;
    --awb-color7: #212934;
    --awb-color7-h: 215;
    --awb-color7-s: 22%;
    --awb-color7-l: 17%;
    --awb-color7-a: 100%;
    --awb-color8: #000000;
    --awb-color8-h: 0;
    --awb-color8-s: 0%;
    --awb-color8-l: 0%;
    --awb-color8-a: 100%;

    --container-width: 1200px;
    --spacing: 1rem;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    font-size: 14px;
}

body {
    margin: 0;
    padding: 0;
    font-family: var(--font-base);
    color: var(--color-text);
    background: var(--color-bg);
    line-height: 1.5;
}

img {
    max-width: 100%;
    height: auto;
    display: block;
}

a {
    color: var(--color-primary);
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}

h1, h2, h3, h4 {
    font-family: var(--font-heading);
    margin: 0 0 0.75rem;
    color: var(--color-text-secondary);
}

.highlight {
    color: var(--color-accent);
}
