/* Custom Color Palette & Base Styles */
    :root {
        --color-charcoal-dark: #2C3E50;
        --color-charcoal-light: #5D6D7E;
        --color-coral: #C05640;
        --color-stone-50: #F5F5F4;
        --color-white: #FFFFFF;
    }

    body {
        background-color: var(--color-stone-50);
        color: var(--color-charcoal-dark);
    }

    /* Typography */
    h1, h2, h3, h4, .font-serif {
        font-family: 'Playfair Display', serif;
    }

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

    /* Custom Utilities */
    .text-charcoal-dark {
        color: var(--color-charcoal-dark);
    }
    
    .text-charcoal-light {
        color: var(--color-charcoal-light);
    }

    .bg-charcoal-dark {
        background-color: var(--color-charcoal-dark);
    }

    .text-coral {
        color: var(--color-coral);
    }

    .bg-coral {
        background-color: var(--color-coral);
    }

    .border-coral {
        border-color: var(--color-coral);
    }

    /* Animations */
    @keyframes fadeInUp {
        from {
            opacity: 0;
            transform: translate3d(0, 20px, 0);
        }
        to {
            opacity: 1;
            transform: translate3d(0, 0, 0);
        }
    }

    .animate-fade-in-up {
        animation: fadeInUp 0.8s ease-out forwards;
    }

    /* Scroll Reveal (Progressive Enhancement) */
    .reveal {
        opacity: 0;
        transform: translateY(30px);
        transition: all 0.8s ease-out;
    }

    .reveal.active {
        opacity: 1;
        transform: translateY(0);
    }

    /* Mobile Menu Transitions */
    #mobile-menu.open {
        opacity: 1;
        pointer-events: all;
    }

    /* Smooth Scrolling */
    html {
        scroll-behavior: smooth;
    }