import React from 'react';

export default function App() {
    return (
        <div className="min-h-screen flex flex-col justify-center items-center p-6" style={{ backgroundColor: '#F9F7F1', fontFamily: 'system-ui, -apple-system, sans-serif' }}>
            <main className="max-w-2xl w-full mx-auto text-center flex flex-col items-center justify-center min-h-[80vh] relative z-10">
                {/* Logo Container */}
                <div className="mb-12 md:mb-16 relative">
                    <img 
                        src="./img/logo.jpg" 
                        alt="Libros del Vencejo Logo" 
                        className="w-auto h-24 md:h-32 mx-auto mix-blend-multiply"
                    />
                </div>

                {/* Main Headlines */}
                <div className="space-y-6 mb-12">
                    <h1 className="text-4xl md:text-5xl lg:text-6xl font-bold tracking-tight leading-tight" style={{ fontFamily: 'Georgia, serif', color: '#0A1F35' }}>
                        El vuelo está a punto de comenzar.
                    </h1>
                    <p className="text-lg md:text-xl max-w-md mx-auto font-light leading-relaxed" style={{ color: 'rgba(10, 31, 53, 0.8)' }}>
                        Estamos preparando nuestra nueva casa editorial. <br className="hidden md:block"/> Historias que elevan.
                    </p>
                </div>

                {/* Footer Simple */}
                <footer className="mt-24 text-sm" style={{ color: 'rgba(10, 31, 53, 0.5)' }}>
                    <p>© {new Date().getFullYear()} Libros del Vencejo. Todos los derechos reservados.</p>
                </footer>
            </main>
        </div>
    );
}