{"version":3,"file":"GuideStyle.DZjQYYim.mjs","names":[],"sources":["https:/framerusercontent.com/modules/KZVYSgfx0lIbFc2nwxo5/09XmOGT7APgnNm75TNvC/GuideStyle.js"],"sourcesContent":["// Guide style: typography for the guide detail pages (/help/:slug) in the\n// Home V2 look. The step content is CMS rich text (h6 step titles, p, img,\n// blockquote tips, ul) whose content and translations must stay untouched, so\n// instead of editing the text this invisible component injects scoped CSS for\n// the rich-text layer named \"Steps\". It also turns the category line right\n// above the layer named \"Title\" into the mono pill used across the site.\n// Tips (blockquotes) use the light bento-tile look: #FAFAF9, hairline border,\n// rounded corners, no coloured bar.\n//\n// Place it anywhere on the page (absolute, so it takes no space); it renders\n// nothing visible.\nimport{jsx as _jsx}from\"react/jsx-runtime\";import{addPropertyControls,ControlType}from\"framer\";const BOLD='\"Sk-Modernist Bold\", \"Sk-Modernist\", Inter, sans-serif';const SANS='\"Sk-Modernist\", \"Sk-Modernist Regular\", Inter, sans-serif';const MONO='\"Sk-Modernist Mono\", \"Sk-Modernist\", ui-monospace, SFMono-Regular, Menlo, monospace';/**\n * Guide Style\n *\n * @framerSupportedLayoutWidth fixed\n * @framerSupportedLayoutHeight fixed\n * @framerIntrinsicWidth 1\n * @framerIntrinsicHeight 1\n */export default function GuideStyle(props){const{target=\"Steps\",titleLayer=\"Title\",accent=\"#FFC11F\",tip=\"#FAFAF9\"}=props;const t=`[data-framer-name=\"${String(target).replace(/\"/g,\"\")}\"]`;const pill=`*:has(+ [data-framer-name=\"${String(titleLayer).replace(/\"/g,\"\")}\"])`;const css=`\n${pill} {\n  background:rgba(12,12,10,0.055) !important; border-radius:999px !important; padding:4px 12px !important;\n}\n${pill}, ${pill} * {\n  font-family:${MONO} !important; font-size:13px !important; line-height:18px !important; letter-spacing:0 !important; color:#111111 !important;\n}\n${t} { --npxg-ink:#111111; --npxg-body:#3C3C3C; --framer-paragraph-spacing:0px !important; }\n${t} > * { margin-top:0 !important; }\n${t} h1, ${t} h2, ${t} h3, ${t} h4, ${t} h5, ${t} h6 {\n  font-family:${BOLD} !important; font-weight:700 !important; font-size:24px !important; line-height:1.25 !important;\n  letter-spacing:-0.02em !important; color:var(--npxg-ink) !important;\n  margin:44px 0 12px !important; padding-top:36px !important; border-top:1px solid rgba(12,12,10,0.08) !important;\n}\n${t} > *:first-child, ${t} h6:first-of-type { margin-top:0 !important; padding-top:0 !important; border-top:0 !important; }\n${t} h6 strong, ${t} h5 strong, ${t} h4 strong { font-weight:700 !important; }\n${t} p, ${t} li {\n  font-family:${SANS} !important; font-size:17px !important; line-height:1.65 !important; letter-spacing:-0.005em !important;\n  color:var(--npxg-body) !important; margin:0 0 10px !important;\n}\n${t} p strong, ${t} li strong { color:var(--npxg-ink) !important; font-family:${BOLD} !important; font-weight:700 !important; }\n${t} ul, ${t} ol { padding-left:22px !important; margin:0 0 10px !important; }\n${t} img {\n  display:block; width:100% !important; height:auto !important; border-radius:16px !important;\n  border:1px solid rgba(12,12,10,0.08) !important; margin:18px 0 !important; box-sizing:border-box;\n}\n${t} img + img { margin-top:12px !important; }\n${t} blockquote {\n  position:relative; margin:18px 0 !important; padding:18px 22px !important;\n  border:1px solid rgba(12,12,10,0.06) !important; border-left:1px solid rgba(12,12,10,0.06) !important;\n  border-radius:20px !important; background:${tip} !important; box-shadow:none !important;\n}\n${t} blockquote::before, ${t} blockquote::after { content:none !important; display:none !important; }\n${t} blockquote > *::before, ${t} blockquote > *::after { content:none !important; display:none !important; }\n${t} blockquote p { font-size:15px !important; line-height:1.55 !important; color:#3C3C3C !important; margin:0 !important; padding:0 !important; border:0 !important; }\n${t} a { color:var(--npxg-ink) !important; text-decoration:underline !important; text-decoration-color:${accent} !important; text-underline-offset:3px; }\n@media (max-width: 809px) {\n  ${t} h1, ${t} h2, ${t} h3, ${t} h4, ${t} h5, ${t} h6 { font-size:20px !important; margin-top:32px !important; padding-top:28px !important; }\n  ${t} p, ${t} li { font-size:16px !important; }\n  ${t} img { border-radius:12px !important; margin:14px 0 !important; }\n  ${t} img + img { margin-top:10px !important; }\n  ${t} blockquote { margin:14px 0 !important; padding:14px 16px !important; border-radius:16px !important; }\n}\n`;return /*#__PURE__*/_jsx(\"style\",{children:css});}addPropertyControls(GuideStyle,{target:{type:ControlType.String,title:\"Steps layer\",defaultValue:\"Steps\",description:\"Name of the rich-text layer to style.\"},titleLayer:{type:ControlType.String,title:\"Title layer\",defaultValue:\"Title\",description:\"The text right above this layer becomes a mono pill.\"},accent:{type:ControlType.Color,title:\"Accent\",defaultValue:\"#FFC11F\"},tip:{type:ControlType.Color,title:\"Tip box\",defaultValue:\"#FAFAF9\"}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"GuideStyle\",\"slots\":[],\"annotations\":{\"framerIntrinsicWidth\":\"1\",\"framerSupportedLayoutHeight\":\"fixed\",\"framerSupportedLayoutWidth\":\"fixed\",\"framerContractVersion\":\"1\",\"framerIntrinsicHeight\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./GuideStyle.map"],"mappings":"4JAkBG,SAAwB,EAAW,EAAM,CAAC,GAAK,CAAC,SAAO,QAAQ,aAAW,QAAQ,SAAO,UAAU,MAAI,WAAW,EAAY,EAAE,sBAAsB,OAAO,CAAM,CAAC,CAAC,QAAQ,KAAK,EAAE,EAAE,IAAU,EAAK,8BAA8B,OAAO,CAAU,CAAC,CAAC,QAAQ,KAAK,EAAE,EAAE,KA2CxQ,OAAoB,EAAK,QAAQ,CAAC,SAAS;EA1C3C,EAAK;;;EAGL,EAAK,IAAI,EAAK;gBACA,EAAK;;EAEnB,EAAE;EACF,EAAE;EACF,EAAE,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE;gBACjC,EAAK;;;;EAInB,EAAE,oBAAoB,EAAE;EACxB,EAAE,cAAc,EAAE,cAAc,EAAE;EAClC,EAAE,MAAM,EAAE;gBACI,EAAK;;;EAGnB,EAAE,aAAa,EAAE,6DAA6D,EAAK;EACnF,EAAE,OAAO,EAAE;EACX,EAAE;;;;EAIF,EAAE;EACF,EAAE;;;8CAG0C,EAAI;;EAEhD,EAAE,uBAAuB,EAAE;EAC3B,EAAE,2BAA2B,EAAE;EAC/B,EAAE;EACF,EAAE,qGAAqG,EAAO;;IAE5G,EAAE,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE;IAC/C,EAAE,MAAM,EAAE;IACV,EAAE;IACF,EAAE;IACF,EAAE;;CAE0C,CAAC,CAAE,uBAlDT,IAAoD,EAAO,EAAK,yDAA+D,EAAK,4DAAkE,EAAK,sFAkDjM,EAAoB,EAAW,CAAC,OAAO,CAAC,KAAK,EAAY,OAAO,MAAM,cAAc,aAAa,QAAQ,YAAY,uCAAuC,EAAE,WAAW,CAAC,KAAK,EAAY,OAAO,MAAM,cAAc,aAAa,QAAQ,YAAY,sDAAsD,EAAE,OAAO,CAAC,KAAK,EAAY,MAAM,MAAM,SAAS,aAAa,SAAS,EAAE,IAAI,CAAC,KAAK,EAAY,MAAM,MAAM,UAAU,aAAa,SAAS,CAAC,CAAC"}