:root {
    --navy-900: #1e3a5f;
    --navy-800: #254a74;
    --navy-700: #2d5a8a;
    --amber-500: #c8a45a;
    --amber-400: #d4b46a;
    --amber-600: #b08d3f;
    --stone-50: #fafaf9;
    --stone-100: #f5f5f4;
    --stone-200: #e7e5e4;
    --slate-500: #64748b;
    --slate-600: #475569;
    --slate-700: #334155;
    --slate-800: #1e293b;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
    scroll-padding-top: 80px;
}

body {
    font-family: 'Outfit', sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.font-playfair {
    font-family: 'Playfair Display', serif;
}

.font-outfit {
    font-family: 'Outfit', sans-serif;
}

/* Custom color utilities */
.text-navy-900 { color: var(--navy-900); }
.text-navy-700 { color: var(--navy-700); }
.text-amber-600 { color: var(--amber-600); }
.text-amber-500 { color: var(--amber-500); }
.text-amber-200 { color: #fde68a; }
.bg-navy-900 { background-color: var(--navy-900); }
.bg-navy-800 { background-color: var(--navy-800); }
.bg-amber-500 { background-color: var(--amber-500); }
.bg-amber-50 { background-color: #fdf8ec; }
.bg-stone-50 { background-color: var(--stone-50); }
.bg-stone-100 { background-color: var(--stone-100); }
.border-stone-100 { border-color: var(--stone-100); }
.border-stone-200 { border-color: var(--stone-200); }
.text-slate-500 { color: var(--slate-500); }
.text-slate-600 { color: var(--slate-600); }
.text-slate-700 { color: var(--slate-700); }
.text-slate-800 { color: var(--slate-800); }
</style>