/* ========================== */
/* GOOGLE FONTS USAGE */
.pacifico-regular { font-family: "Pacifico", cursive; font-weight: 400; font-style: normal; }
.sacramento-regular { font-family: "Sacramento", cursive; font-weight: 400; font-style: normal; }
.young-serif-regular { font-family: "Young Serif", serif; font-weight: 400; font-style: normal; }
.monoton-regular { font-family: "Monoton", sans-serif; font-weight: 400; font-style: normal; }

/* ========================== */
/* THEME COLORS */
:root {
    --paper: #b973e1;   /* light purple-ish background */
    --ink: #1e4e33;     /* dark purple for text */
    --moss: #2ab850;    /* deep green accents */
    --clay: #8B5CF6;    /* bright purple highlights */
    --mist: #2cf18b;    /* soft green background / highlights */
}

/* ========================== */
/* BODY & GENERAL */
body {
    background-color: var(--paper);
    color: var(--ink);
    font-family: 'Young Serif', serif; /* default serif font */
    overflow-x: hidden;
    scroll-behavior: smooth;
}

/* HEADINGS / SERIF / CURSIVE */
.serif { font-family: 'Young Serif', serif; }
.cursive { font-family: 'Pacifico', cursive; }
.monoton { font-family: 'Monoton', sans-serif; font-weight: 400; }

/* ========================== */
/* STORYTELLING ANIMATIONS */
.reveal { opacity: 0; transform: translateY(50px); transition: all 1.2s cubic-bezier(0.22, 1, 0.36, 1); }
.reveal.active { opacity: 1; transform: translateY(0); }

/* ========================== */
/* HERO SECTION */
.hero-section {
    background: linear-gradient(rgba(98, 0, 234, 0.3), rgba(6, 95, 70, 0.3)), url('https://images.unsplash.com/photo-1506126613408-eca07ce68773?auto=format&fit=crop&q=2000');
    background-attachment: fixed;
    background-position: center;
    background-size: cover;
    height: 110vh;
}

/* ========================== */
/* BUTTONS & INTERACTIONS */
.btn-luxe {
    padding: 1.2rem 2.5rem;
    border: 1px solid var(--clay);
    font-size: 0.65rem;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    font-weight: 700;
    position: relative;
    transition: all 0.5s ease;
    background: transparent;
    cursor: pointer;
    color: var(--clay);
}
.btn-luxe:hover { 
    background: var(--clay); 
    color: white; 
    transform: translateY(-2px); 
}
.btn-luxe::after {
    content: ''; position: absolute; bottom: -5px; right: -5px;
    width: 100%; height: 100%; border: 1px solid rgba(139,92,246,0.3);
    z-index: -1; transition: 0.3s;
}
.btn-luxe:hover::after { bottom: 0; right: 0; }

/* ========================== */
/* NAVIGATION */
.nav-scrolled { 
    background: rgba(245, 243, 255, 0.98); 
    padding: 1rem 0; 
    box-shadow: 0 10px 30px rgba(0,0,0,0.03); 
}
.nav-link { 
    color: var(--clay); 
    font-family: 'Pacifico', cursive; 
    font-weight: 400; 
    transition: all 0.3s ease;
}
.nav-link:hover { color: var(--moss); }

/* ========================== */
/* FULL PAGE OVERLAYS */
.sub-page {
    position: fixed; inset: 0; background: var(--paper); z-index: 10000;
    transform: translateY(100%); transition: transform 0.8s cubic-bezier(0.85, 0, 0.15, 1);
    overflow-y: auto; padding-top: 80px;
}
.sub-page.active { transform: translateY(0); }

/* ========================== */
/* CUSTOM SCROLLBAR */
::-webkit-scrollbar { width: 4px; }
::-webkit-scrollbar-thumb { background: var(--moss); border-radius: 10px; }

/* ========================== */
/* IMAGE ZOOM */
.image-zoom { overflow: hidden; }
.image-zoom img { transition: transform 1.5s cubic-bezier(0.2, 1, 0.3, 1); }
.image-zoom:hover img { transform: scale(1.08); }

/* ========================== */
/* SEARCH RESULTS */
.search-results {
    max-height: 400px; overflow-y: auto;
    background: var(--paper); position: absolute; top: 100%; right: 0;
    width: 350px; border: 1px solid rgba(139,92,246,0.3); z-index: 100;
}