{"version":3,"file":"LitguideMobileMotion.ZRTBPC1k.mjs","names":[],"sources":["https:/framerusercontent.com/modules/RE3TEjEQVYF5mk9k2Dwh/sqm4nvuc5ddaXJfFedOH/LitguideMobileMotion.js"],"sourcesContent":["import{jsx as _jsx}from\"react/jsx-runtime\";import{useEffect}from\"react\";/**\n * Motion layer for the native mobile pages.\n *\n * The mobile pages are built from canvas frames, not from the page code\n * components, so none of the desktop keyframes (lgLadIn, lgBdSeg, lgPvIn …)\n * reach them — the code component is not rendered at all below 810px.\n * Framer's own appear effects publish as inert here: an off-screen row\n * serialises with appearEffect set but ships to the browser at opacity 1.\n *\n * So the mobile modules animate the same way the desktop cards do: plain CSS\n * keyframes on mount, hooked to the `data-framer-name` Framer already emits\n * for every named layer. Name a layer \"lgm-rung-2\" on the canvas and it picks\n * up the rung animation with the second delay. Nothing to wire per page.\n */const CSS=`\n@keyframes lgmIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}\n@keyframes lgmPop{from{opacity:0;transform:scale(.94)}to{opacity:1;transform:none}}\n@keyframes lgmGrow{from{transform:scaleX(0)}to{transform:scaleX(1)}}\n@keyframes lgmRail{from{transform:scaleY(0)}to{transform:scaleY(1)}}\n\n/* every named motion layer starts hidden so the reveal is visible even when\n   the module sits above the fold, which on a phone it almost always does */\n[data-framer-name^=\"lgm-\"]{animation:lgmIn .58s cubic-bezier(.16,.84,.44,1) both;}\n\n/* ladder rungs (/students) and pathway stops (/about) climb in order */\n[data-framer-name=\"lgm-rung-1\"]{animation-delay:.10s}\n[data-framer-name=\"lgm-rung-2\"]{animation:lgmPop .62s cubic-bezier(.34,1.4,.64,1) .24s both}\n[data-framer-name=\"lgm-rung-3\"]{animation-delay:.40s}\n[data-framer-name=\"lgm-rung-4\"]{animation-delay:.54s}\n\n[data-framer-name=\"lgm-stop-1\"]{animation-delay:.10s}\n[data-framer-name=\"lgm-stop-2\"]{animation-delay:.19s}\n[data-framer-name=\"lgm-stop-3\"]{animation-delay:.28s}\n[data-framer-name=\"lgm-stop-4\"]{animation:lgmPop .62s cubic-bezier(.34,1.4,.64,1) .37s both}\n[data-framer-name=\"lgm-stop-5\"]{animation-delay:.46s}\n[data-framer-name=\"lgm-stop-6\"]{animation-delay:.55s}\n/* the rail draws downward behind the dots, so it has to beat stop 1 */\n[data-framer-name=\"lgm-rail\"]{transform-origin:top center;animation:lgmRail .72s cubic-bezier(.22,.61,.36,1) .04s both}\n\n/* cohort split (/schools): the number lands, then the bar wipes, then rows */\n[data-framer-name=\"lgm-num\"]{animation:lgmPop .6s cubic-bezier(.34,1.35,.64,1) .06s both}\n[data-framer-name^=\"lgm-bar-\"]{transform-origin:left center;animation:lgmGrow .8s cubic-bezier(.16,.84,.44,1) both}\n[data-framer-name=\"lgm-bar-1\"]{animation-delay:.22s}\n[data-framer-name=\"lgm-bar-2\"]{animation-delay:.36s}\n[data-framer-name=\"lgm-bar-3\"]{animation-delay:.50s}\n[data-framer-name=\"lgm-row-1\"]{animation-delay:.34s}\n[data-framer-name=\"lgm-row-2\"]{animation-delay:.46s}\n[data-framer-name=\"lgm-row-3\"]{animation-delay:.58s}\n\n/* portal rings (/solutions) nest inward, matching the desktop lgPvIn cascade */\n[data-framer-name=\"lgm-ring-1\"]{animation-delay:.06s}\n[data-framer-name=\"lgm-ring-2\"]{animation-delay:.24s}\n[data-framer-name=\"lgm-ring-3\"]{animation-delay:.42s}\n[data-framer-name=\"lgm-ring-4\"]{animation:lgmPop .6s cubic-bezier(.34,1.35,.64,1) .60s both}\n\n[data-framer-name=\"lgm-plan-1\"]{animation-delay:.08s}\n[data-framer-name=\"lgm-plan-2\"]{animation:lgmPop .62s cubic-bezier(.34,1.35,.64,1) .22s both}\n[data-framer-name=\"lgm-plan-3\"]{animation-delay:.36s}\n\n[data-framer-name=\"lgm-foot\"]{animation-delay:.74s}\n\n/* current page in the burger menu. Set by the effect below rather than by a\n   per-page variant, so the Mobile Nav component stays a single shared instance. */\n[data-lgm-current=\"1\"]{background-color:#EAF7F2 !important;box-shadow:inset 3px 0 0 #34B994 !important;}\n[data-lgm-current=\"1\"] p{color:#07333A !important;}\n\n/* ── the four content pages (/rubrics, /tutorials, /privacy, /terms) ──\n   These render the page code component rather than a native mobile frame, so\n   their header is the desktop one shrunk down: a \"Book a demo\" pill competing\n   with the burger, and a menu that is a bare list of links. Bring both in line\n   with the Mobile Nav used everywhere else. */\n@media (max-width:809px){\n  [data-nav-cta]{display:none !important;}\n  [data-nav] img[alt=\"Litguide\"]{height:39px !important;}\n  /* with the CTA and the link list hidden, the row is logo + burger; push the\n     burger to the edge so it sits where the Mobile Nav puts it */\n  [data-nav]{justify-content:space-between !important;}\n  [data-nav] .lg-burger{margin-left:auto !important;}\n\n  /* the essay header is logo + burger with no rule under it */\n  [role=\"navigation\"]:has(> [data-nav]){border-bottom:0 !important;}\n\n  /* the same row as the Mobile Nav component: tinted icon tile, title, one\n     line of context, chevron. Each destination keeps its own shade. */\n  a.lg-mrow{\n    display:grid !important;\n    grid-template-columns:38px minmax(0,1fr) 17px !important;\n    align-items:center !important;\n    gap:13px !important;\n    border-bottom:0 !important;\n    border-radius:14px !important;\n    padding:13px 12px !important;\n    text-align:left !important;\n  }\n  .lg-mrow-ic{\n    width:38px;height:38px;border-radius:11px;\n    display:flex;align-items:center;justify-content:center;\n  }\n  .lg-mrow-ic svg{width:19px;height:19px;display:block;}\n  .lg-mrow-tx{display:flex;flex-direction:column;gap:2px;min-width:0;}\n  .lg-mrow-t{\n    font-family:'Noto Sans',sans-serif;font-weight:700;font-size:16px;\n    letter-spacing:-0.2px;color:#0E202D;line-height:1.3;\n  }\n  .lg-mrow-s{font-family:Roboto,sans-serif;font-weight:400 !important;font-size:13px;line-height:1.35;color:#5F7B75;}\n  .lg-mrow-ch{width:17px;height:17px;display:block;}\n\n  a.lg-mrow[data-lgm-current=\"1\"]{\n    background-color:#EAF7F2 !important;\n    box-shadow:inset 3px 0 0 #34B994 !important;\n  }\n  a.lg-mrow[data-lgm-current=\"1\"] .lg-mrow-t{color:#07333A !important;}\n\n  /* The accessibility pill and the HelpScout beacon were stacked on top of each\n     other. The page CSS already tries to push the beacon right, but HelpScout\n     sets a left offset, and on a fixed element left wins over right — so it\n     never moved. Clearing left is the actual fix; then the pill keeps the left\n     corner and the beacon takes the right. */\n  .BeaconFabButtonFrame.BeaconFabButtonFrame{left:auto !important;right:14px !important;bottom:12px !important;}\n  .lg-a11y-fab.lg-a11y-fab{left:14px !important;bottom:14px !important;}\n}\n\n@media (prefers-reduced-motion:reduce){\n  [data-framer-name^=\"lgm-\"]{animation:none !important;opacity:1 !important;transform:none !important;}\n}\n`;/**\n * Litguide Mobile Motion\n *\n * Invisible. Drop one instance into a mobile page frame and every layer named\n * `lgm-*` on that page animates in.\n *\n * @framerIntrinsicWidth 1\n * @framerIntrinsicHeight 1\n * @framerDisableUnlink\n * @framerSupportedLayoutWidth fixed\n * @framerSupportedLayoutHeight fixed\n */export default function LitguideMobileMotion(props){useEffect(()=>{if(typeof document===\"undefined\")return;const here=(location.pathname||\"/\").replace(/\\/+$/,\"\")||\"/\";const mark=()=>{const links=document.querySelectorAll(\"a[data-framer-name], a.lg-mlink\");links.forEach(el=>{const a=el;let path=\"\";try{path=new URL(a.href,location.href).pathname;}catch(e){return;}path=path.replace(/\\/+$/,\"\")||\"/\";// student.litguide.ca and framer.com both resolve to \"/\", so the\n// origin has to match too or they light up on the home page\nlet sameOrigin=true;try{sameOrigin=new URL(a.href,location.href).origin===location.origin;}catch(e){}// the logo also points at \"/\", so only labelled rows are marked\nconst isRow=a.classList.contains(\"lg-mlink\")||!!a.querySelector(\"p\");if(isRow&&sameOrigin&&path===here)a.setAttribute(\"data-lgm-current\",\"1\");else a.removeAttribute(\"data-lgm-current\");});};mark();// the panel only mounts when the burger opens, so re-mark on changes\nconst mo=new MutationObserver(mark);mo.observe(document.body,{childList:true,subtree:true});return()=>mo.disconnect();},[]);return /*#__PURE__*/_jsx(\"span\",{style:{...props.style,display:\"block\",width:1,height:1,overflow:\"hidden\"},children:/*#__PURE__*/_jsx(\"style\",{dangerouslySetInnerHTML:{__html:CSS}})});}\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"LitguideMobileMotion\",\"slots\":[],\"annotations\":{\"framerSupportedLayoutHeight\":\"fixed\",\"framerIntrinsicWidth\":\"1\",\"framerContractVersion\":\"1\",\"framerIntrinsicHeight\":\"1\",\"framerDisableUnlink\":\"* @framerSupportedLayoutWidth fixed\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./LitguideMobileMotion.map"],"mappings":"kHAuIG,SAAwB,EAAqB,EAAM,CAIsE,OAJrE,MAAc,CAAC,GAAG,OAAO,SAAW,IAAY,OAAO,IAAM,GAAM,SAAS,UAAU,IAAA,CAAK,QAAQ,OAAO,EAAE,GAAG,IAAU,MAAS,CAA0E,SAApD,iBAAiB,iCAAuC,CAAC,CAAC,QAAQ,GAAI,CAAC,IAAM,EAAE,EAAO,EAAK,GAAG,GAAG,CAAC,EAAK,IAAI,IAAI,EAAE,KAAK,SAAS,IAAI,CAAC,CAAC,QAAS,MAAS,CAAC,MAAO,CAAC,EAAK,EAAK,QAAQ,OAAO,EAAE,GAAG,IAE7Y,IAAI,EAAW,GAAK,GAAG,CAAC,EAAW,IAAI,IAAI,EAAE,KAAK,SAAS,IAAI,CAAC,CAAC,SAAS,SAAS,MAAO,MAAS,CAAC,EACxF,EAAE,UAAU,SAAS,UAAU,GAAK,EAAE,cAAc,GAAG,IAAY,GAAY,IAAO,EAAK,EAAE,aAAa,mBAAmB,GAAG,EAAO,EAAE,gBAAgB,kBAAkB,CAAE,CAAC,CAAE,EAAE,EAAK,EACnM,IAAM,EAAG,IAAI,iBAAiB,CAAI,EAA0D,OAAxD,EAAG,QAAQ,SAAS,KAAK,CAAC,UAAU,GAAK,QAAQ,EAAI,CAAC,MAAY,EAAG,WAAW,CAAE,EAAE,CAAC,CAAC,EAAsB,EAAK,OAAO,CAAC,MAAM,CAAC,GAAG,EAAM,MAAM,QAAQ,QAAQ,MAAM,EAAE,OAAO,EAAE,SAAS,QAAQ,EAAE,SAAsB,EAAK,QAAQ,CAAC,wBAAwB,CAAC,OAAO,CAAG,CAAC,CAAC,CAAC,CAAC,CAAE,mBA3I1Q,IAA6B,EAa9D,EAAI"}