@layer settings {
  :root {
    --mp-color-green: #1c3531;
    --mp-color-gold: #af9038;
    --mp-color-line: #dcdde8;
    --mp-color-surface-light: #f2f2f2;
    --mp-color-surface-extra-light: #f5f5f7;
    --mp-color-neutral: #73787c;
    --mp-color-dark: #202020;
    --mp-color-extra-dark: #101010;
    --mp-color-white: #ffffff;
    --mp-color-black: #000000;
    --mp-font-display: "Cormorant Garamond", serif;
    --mp-font-body: "Inter", sans-serif;
    --mp-container: 1280px;
    --mp-reading-width: 760px;
    --mp-gutter-desktop: 32px;
    --mp-gutter-tablet: 28px;
    --mp-gutter-mobile: 18px;
    --mp-radius-control: 10px;
    --mp-radius-header: 20px;
    --mp-shadow-header: 0 4px 12px rgb(0 0 0 / 11%);
    --mp-focus-ring: 0 0 0 3px rgb(175 144 56 / 35%);
    --mp-transition: 180ms cubic-bezier(.2, .7, .2, 1);
    --mp-space-1: .5rem;
    --mp-space-2: 1rem;
    --mp-space-3: 1.5rem;
    --mp-space-4: 2rem;
    --mp-space-5: 3rem;
    --mp-space-6: 5rem;
  }
}
