:root {
  --fgj-navy: #081B2E;
  --fgj-navy-deep: #0F2B46;
  --fgj-navy-soft: #173B5C;
  --fgj-gold: #C8A260;
  --fgj-gold-soft: #D8C09B;
  --fgj-gold-pale: #F6F0E5;
  --fgj-ivory: #F7F3EC;
  --fgj-canvas: #F6F7F8;
  --fgj-white: #FFFFFF;
  --fgj-graphite: #1F2733;
  --fgj-slate: #5D6978;
  --fgj-gray: #98A3B3;
  --fgj-gray-soft: #EEF1F4;
  --fgj-green: #247A5A;
  --fgj-green-soft: #E8F4EF;
  --fgj-red: #A84040;
  --fgj-red-soft: #F8EBEB;
  --fgj-amber: #9C6C18;
  --fgj-amber-soft: #FBF3E2;
  --fgj-border: #E2E6EA;
  --fgj-border-strong: #CDD4DB;

  --fgj-font-body: "Inter", sans-serif;
  --fgj-font-title: "Playfair Display", serif;
  --fgj-radius-sm: 8px;
  --fgj-radius-md: 12px;
  --fgj-radius-lg: 18px;
  --fgj-shadow-sm: 0 1px 2px rgba(8, 27, 46, 0.04);
  --fgj-shadow-md: 0 12px 30px rgba(8, 27, 46, 0.08);
  --fgj-transition: 160ms ease;
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  font-family: var(--fgj-font-body);
  color: var(--fgj-graphite);
  background: var(--fgj-canvas);
  font-size: 14px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

a {
  color: inherit;
}

button,
input,
select,
textarea {
  font: inherit;
}

button,
a {
  -webkit-tap-highlight-color: transparent;
}

:focus-visible {
  outline: 3px solid rgba(200, 162, 96, 0.35);
  outline-offset: 2px;
}