Now I have a full picture of the codebase. Let me set up the task list and start building this comprehensive educational website.

Let me start by setting up the theme and generating the hero image in parallel.

Now let me set up the theme, layout, and start building components. I'll update globals.css with a French Revolution-inspired theme - navy, cream, and burgundy.

Good, the globals.css looks correct. Now let me add a serif font and update the layout for the educational site.

Now let me update the layout with the proper fonts and metadata:

Now let me build the navigation and hero components, then the main page:

Now let me build the Significance and Key Events sections:

Now let me assemble everything in the main page:

Your educational Bastille Day website is now complete. It features a navy-and-cream color palette with burgundy accents evoking French revolutionary themes, structured into all four required academic sections: Significance (with a "Why It Matters" box and monarchy vs. democracy comparison), Key Events (an interactive expandable timeline with before/during/after phases), Historical Figures (tabbed character profile cards with portraits, key facts, and legacy analysis), and Context (a three-column social/political/economic breakdown with before-and-after comparisons). The site also includes an 8-question interactive quiz with score feedback, answer review, and a printable certificate -- all with a sticky navigation header, responsive mobile menu, and smooth scroll-to-section navigation.