:root {
  --color-navy-dark: #232B3E;
  --color-red-accent: #DD594A;
  --color-purple-dark: #621A40;
  
  --color-blue-deep: #23396A;
  --color-teal-soft: #339999;
  --color-beige-light: #D5C5AD;
  --color-salmon-warm: #E2987D;
  --color-brown-muted: #A98C6C;
}
@font-face {
    font-family: "Old Goudy";
    src: url("../../../fonts/OldGoudy.otf");
}
:root {
    --font: "Old Goudy";
    --span-cta-font: "Old Goudy 2";
    --accent-color-og: #fbbf24;
    --accent-color: #DD594A;
    --accent-color-light: #E2987D;
    --accent-color-dark: #232B3E;

    --pill-background: #232B3E;
    --pill-color: #ffffff;
    
    --accent-color-bg: linear-gradient(to right, var(--color-bg), var(--accent-color) 40%, var(--accent-color-light) 50%, var(--accent-color) 60%, var(--color-bg));
    --accent-bg-image: linear-gradient(0deg, var(--color-bg) 40%, var(--accent-color));
    --accent-bg-image-corner: linear-gradient(-45deg, var(--color-bg) 40%, var(--accent-color) 90%, var(--accent-color-light) 100%);
    --gradient-buttons: linear-gradient(45deg, var(--accent-color-dark) 0%, var(--accent-color) 50%, var(--accent-color) 100%);

    --border: 1px solid var(--border-color);
    --border-color: #232B3E;
    
    --color-bg: #D5C5AD;
    --color-bg-dark: #232B3E;
    --color-link-hover: #232B3E;
    --color-backdrop: #c1c1c1b8;

    --font-color: #621A40;
    --font-color-dark: #232323;
    --font-color-light: #DD594A;
    --font-color-buttons: #ffffff;
}