/* Fonts */
@font-face {
  font-family: Bentham;
  src: url("/assets/Bentham-Regular-16b7e8b1.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Century Gothic";
  src: url("/assets/CenturyGothic-d033ec32.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Century Gothic";
  src: url("/assets/GOTHICB-88ccf033.TTF") format("truetype");
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Century Gothic";
  src: url("/assets/GOTHICI-b329e328.TTF") format("truetype");
  font-weight: normal;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "Century Gothic";
  src: url("/assets/GOTHICBI-cb069a3f.TTF") format("truetype");
  font-weight: bold;
  font-style: italic;
  font-display: swap;
}

/* Theme variables - light default */
:root {
  --color-bg: #FCF7F7;
  --color-header: #19344B;
  --color-text: #19344B;
  --color-title: #709B72;
  --color-accent-green: #6A9870;
  --color-accent-red: #C5556A;
  --color-accent-purple: #CB7DB1;
  --color-accent-blue: #A0BCCB;
  --color-gold: #D4A843;
  --color-link: #19344B;
}

/* System dark mode preference */
@media (prefers-color-scheme: dark) {
  :root {
    --color-bg: #182C3F;
    --color-header: #FCF7F7;
    --color-text: #FCF7F7;
    --color-title: #709B72;
    --color-link: #D4A843;
  }
}

/* Manual overrides */
[data-theme="light"] {
  --color-bg: #FCF7F7;
  --color-header: #19344B;
  --color-text: #19344B;
  --color-title: #709B72;
  --color-link: #19344B;
}

[data-theme="dark"] {
  --color-bg: #182C3F;
  --color-header: #FCF7F7;
  --color-text: #FCF7F7;
  --color-title: #709B72;
  --color-link: #D4A843;
}

/* Reset & base */
*, *::before, *::after {
  box-sizing: border-box;
}

html, body {
  height: 100%;
  font-family: "Century Gothic", Futura, sans-serif;
  background-color: var(--color-bg);
  color: var(--color-text);
  transition: background-color 0.4s ease, color 0.4s ease;
}

a {
  color: var(--color-link);
  transition: color 0.4s ease;
}