Framer → Next.js

Follow the migrate skill for the method; this file holds what is specific to Framer.

Markers and config

<div id="main" data-framer-hydrate-v2>, classes framer-<hash>, attributes data-framer-name, data-framer-component-type, data-framer-appear-id, a <style data-framer-css-ssr…> block, assets and fonts on framerusercontent.com (images with ?scale-down-to= and srcset), generator meta "Framer". Config: "platform": "framer" (root #main; data-framer-name is a hint, not unique, so section pairing falls back to DOM paths).

CSS strategy: baseline first, then Tailwind

Framer's CSS is generated with hashed classes. For the baseline copy the SSR <style> blocks verbatim (in head order) and keep the class names. Phase 5b converts to Tailwind from computed values, section by section (hashed classes carry no intent, so the measured values are the source); keep Framer's breakpoint structure while converting. Fonts: Framer serves its own font files (and Google Fonts) — mirror them and keep the same @font-face.