Email Capture Popup Preview
Preview all states of the popup in both desktop and mobile viewports. Use the controls below to toggle between form, loading, success, and error states.
Unlock the Mysteries
Join the Time Travellers' Club for exclusive activities, early access and member-only discounts.
We respect your privacy. Read our Privacy Policy. Unsubscribe any time.
Unlock the Mysteries
Join the Time Travellers' Club for exclusive activities, early access and member-only discounts.
We respect your privacy. Read our Privacy Policy. Unsubscribe any time.
Trigger Logic & Behaviour
Timer Trigger
Fires after 5 seconds on page load, provided the user hasn't recently dismissed the popup (7-day cooldown).
Exit-Intent Trigger
Desktop only — detects when the mouse leaves the viewport toward the browser chrome (top edge).
Scroll-Depth Trigger
Mobile fallback — fires when the user scrolls past 55% of the page height.
Dismissal Cooldown
Closing the popup (X button or backdrop click) stores a timestamp in localStorage under mit:email-popup-dismissed-at. The popup won't reappear for 7 days.
Form Validation
Zod schema validates email (required, valid format) and optional first/last names (max 60 chars). Segment selection is optional. Validation mode is onTouched.
Styling & Animation Reference
Header Gradient
bg-gradient-to-br from-primary via-primary to-secondaryUses the brand orange (#FF9C00) and navy (#0B2B51) CSS variables.
Dialog Animation
data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 duration-300Radix UI Dialog with fade + zoom entrance. Backdrop is bg-black/50 with fade transition.
Radio Card Hover
hover:border-primary/60 has-[:checked]:border-primary has-[:checked]:bg-primary/5 transition-colorsUses the has() selector to style the parent when a child radio is checked.
Backdrop Blur Icon
bg-white/15 backdrop-blur rounded-fullSubtle glassmorphism effect on the Sparkles icon container.