[{"data":1,"prerenderedAt":641},["ShallowReactive",2],{"sanity-LevEgKvCUg3Ul3GKyhTsfZIfaGswLQ-qsmdjo9-lWe4":3,"sanity-uF5fmLPNAvOhY12F70U_eqBfDKr9fGslhhGIzfjTLuw":42,"shiki-block-v-0-0-0-0-7-0-1":639,"shiki-block-v-0-0-0-0-7-0-0":640},{"data":4},{"_createdAt":5,"_id":6,"_rev":7,"_type":6,"_updatedAt":8,"acceptAllLink":9,"acceptNecessaryLink":18,"bannerColorSource":23,"bannerDescription":24,"bannerTitle":25,"categories":26,"declineAllLink":27,"managePreferencesLink":31,"modalColorSource":23,"modalTitle":35,"preferencesIconColorSource":23,"provider":36,"savePreferencesLink":37,"thirdPartyEmbedCode":26,"title":41},"2026-08-29T18:46:18Z","cookieSettings","6nvKuEL9zc4dBn99tbDSIo","2026-09-15T23:28:13Z",{"_type":10,"style":11,"title":16,"type":17},"link",{"_type":12,"stylePreset":13},"link.style",{"_ref":14,"_type":15},"link-style-primary","reference","Accept all","button",{"_type":10,"style":19,"title":22,"type":17},{"_type":12,"stylePreset":20},{"_ref":21,"_type":15},"link-style-tertiary-outline","Accept necessary","inherit","We use cookies to enhance your browsing experience and analyse our traffic. Please choose your cookie preferences below.","We use cookies",null,{"_type":10,"style":28,"title":30,"type":17},{"_type":12,"stylePreset":29},{"_ref":21,"_type":15},"Decline all",{"_type":10,"style":32,"title":34,"type":17},{"_type":12,"stylePreset":33},{"_ref":21,"_type":15},"Manage preferences","Cookie Preferences","custom",{"_type":10,"style":38,"title":40,"type":17},{"_type":12,"stylePreset":39},{"_ref":14,"_type":15},"Save preferences","Cookie Settings",{"data":43,"sourceMap":-1},{"_createdAt":5,"_id":44,"_rev":7,"_type":45,"_updatedAt":8,"components":46,"footer":26,"isPublished":160,"navigation":26,"path":632,"routeOptions":633,"seo":26,"showFooter":160,"showNav":160,"slug":637,"title":638},"page-typography","page",[47,157,165,296,303,579,585],{"_key":48,"_type":49,"alignment":50,"content":51,"options":149,"width":156},"tg-rhythm","text-block","mx-auto",[52,63,72,81,89,98,106,115,123,132,141],{"_key":53,"_type":54,"children":55,"markDefs":61,"style":62},"tg-b002","block",[56],{"_key":57,"_type":58,"marks":59,"text":60},"tg-s001","span",[],"Typography & portable text",[],"h1",{"_key":64,"_type":54,"children":65,"markDefs":70,"style":71},"tg-b004",[66],{"_key":67,"_type":58,"marks":68,"text":69},"tg-s003",[],"Everything below is authored in the Studio's portable-text editor and rendered through this project's serializers. It doubles as a visual regression check: if heading spacing or the type scale drifts, it shows up here first.",[],"normal",{"_key":73,"_type":54,"children":74,"markDefs":79,"style":80},"tg-b006",[75],{"_key":76,"_type":58,"marks":77,"text":78},"tg-s005",[],"The heading scale",[],"h2",{"_key":82,"_type":54,"children":83,"markDefs":88,"style":71},"tg-b008",[84],{"_key":85,"_type":58,"marks":86,"text":87},"tg-s007",[],"Headings carry no vertical margin of their own — spacing is owned by the .Nuxion-flow wrapper the renderer emits, using adjacent-sibling rules. The gap above a heading is roughly three times the gap below it, so each heading reads as belonging to the text that follows rather than floating between two paragraphs.",[],{"_key":90,"_type":54,"children":91,"markDefs":96,"style":97},"tg-b010",[92],{"_key":93,"_type":58,"marks":94,"text":95},"tg-s009",[],"A third-level heading",[],"h3",{"_key":99,"_type":54,"children":100,"markDefs":105,"style":71},"tg-b012",[101],{"_key":102,"_type":58,"marks":103,"text":104},"tg-s011",[],"Because those margins are em-based, every level separates in proportion to its own size: an h2 breaks a page more strongly than an h3 without either being hand-tuned.",[],{"_key":107,"_type":54,"children":108,"markDefs":113,"style":114},"tg-b014",[109],{"_key":110,"_type":58,"marks":111,"text":112},"tg-s013",[],"A fourth-level heading",[],"h4",{"_key":116,"_type":54,"children":117,"markDefs":122,"style":71},"tg-b016",[118],{"_key":119,"_type":58,"marks":120,"text":121},"tg-s015",[],"The first block in any portable-text field never receives a top margin, which is what lets heroes and CTA banners render their title through this same system without being pushed down the page.",[],{"_key":124,"_type":54,"children":125,"markDefs":130,"style":131},"tg-b018",[126],{"_key":127,"_type":58,"marks":128,"text":129},"tg-s017",[],"Fifth level",[],"h5",{"_key":133,"_type":54,"children":134,"markDefs":139,"style":140},"tg-b020",[135],{"_key":136,"_type":58,"marks":137,"text":138},"tg-s019",[],"Sixth level",[],"h6",{"_key":142,"_type":54,"children":143,"markDefs":148,"style":71},"tg-b022",[144],{"_key":145,"_type":58,"marks":146,"text":147},"tg-s021",[],"Note that on a blog post the whole scale steps down: 48px display headings suit a marketing section title, but sit far too large inside 18px body copy.",[],{"_type":150,"colorSource":23,"container":151,"padding":152},"section.options","contained",{"_type":153,"bottom":154,"top":155},"padding.options",24,80,"max-w-3xl",{"_key":158,"_type":159,"divider":160,"dividerColor":161,"dividerStyle":162,"height":155,"options":163,"title":164},"tg-sp1","spacer",true,"accent","beam",{"_type":150,"colorSource":23,"container":151},"Divider · Beam",{"_key":166,"_type":49,"alignment":50,"content":167,"options":295,"width":156},"tg-decorators",[168,176,184,269,277,286],{"_key":169,"_type":54,"children":170,"markDefs":175,"style":80},"tg-b024",[171],{"_key":172,"_type":58,"marks":173,"text":174},"tg-s023",[],"Decorators",[],{"_key":177,"_type":54,"children":178,"markDefs":183,"style":71},"tg-b026",[179],{"_key":180,"_type":58,"marks":181,"text":182},"tg-s025",[],"Decorators are toggles applied to a text range — no configuration, no markDefs entry.",[],{"_key":185,"_type":54,"children":186,"markDefs":268,"style":71},"tg-b047",[187,192,196,201,204,208,211,216,219,224,227,232,235,239,242,247,251,256,260,264],{"_key":188,"_type":58,"marks":189,"text":191},"tg-s027",[190],"strong","Bold",{"_key":193,"_type":58,"marks":194,"text":195},"tg-s028",[],", ",{"_key":197,"_type":58,"marks":198,"text":200},"tg-s029",[199],"em","emphasis",{"_key":202,"_type":58,"marks":203,"text":195},"tg-s030",[],{"_key":205,"_type":58,"marks":206,"text":207},"tg-s031",[207],"underline",{"_key":209,"_type":58,"marks":210,"text":195},"tg-s032",[],{"_key":212,"_type":58,"marks":213,"text":215},"tg-s033",[214],"strike-through","strikethrough",{"_key":217,"_type":58,"marks":218,"text":195},"tg-s034",[],{"_key":220,"_type":58,"marks":221,"text":223},"tg-s035",[222],"code","inline code",{"_key":225,"_type":58,"marks":226,"text":195},"tg-s036",[],{"_key":228,"_type":58,"marks":229,"text":231},"tg-s037",[230],"font-mono","monospace",{"_key":233,"_type":58,"marks":234,"text":195},"tg-s038",[],{"_key":236,"_type":58,"marks":237,"text":238},"tg-s039",[238],"uppercase",{"_key":240,"_type":58,"marks":241,"text":195},"tg-s040",[],{"_key":243,"_type":58,"marks":244,"text":246},"tg-s041",[245],"light","light weight",{"_key":248,"_type":58,"marks":249,"text":250},"tg-s042",[]," and ",{"_key":252,"_type":58,"marks":253,"text":255},"tg-s043",[254],"extrabold","extra bold",{"_key":257,"_type":58,"marks":258,"text":259},"tg-s044",[],". They compose, so text can be ",{"_key":261,"_type":58,"marks":262,"text":263},"tg-s045",[190,230],"bold and monospaced",{"_key":265,"_type":58,"marks":266,"text":267},"tg-s046",[]," at once.",[],{"_key":270,"_type":54,"children":271,"markDefs":276,"style":97},"tg-b049",[272],{"_key":273,"_type":58,"marks":274,"text":275},"tg-s048",[],"Alignment",[],{"_key":278,"_type":54,"children":279,"markDefs":285,"style":71},"tg-b051",[280],{"_key":281,"_type":58,"marks":282,"text":284},"tg-s050",[283],"align-center","Alignment is also a decorator. This line is centred.",[],{"_key":287,"_type":54,"children":288,"markDefs":294,"style":71},"tg-b053",[289],{"_key":290,"_type":58,"marks":291,"text":293},"tg-s052",[292],"align-right","And this one is aligned right.",[],{"_type":150,"colorSource":23,"container":151},{"_key":297,"_type":159,"divider":160,"dividerColor":298,"dividerStyle":299,"height":300,"options":301,"title":302},"tg-sp2","subtle","grid",88,{"_type":150,"colorSource":23,"container":151},"Divider · Dot matrix",{"_key":304,"_type":49,"alignment":50,"content":305,"options":577,"width":156},"tg-annotations",[306,314,322,330,349,357,377,397,405,426,482,503,516,524,533,543,551,560,568],{"_key":307,"_type":54,"children":308,"markDefs":313,"style":80},"tg-b065",[309],{"_key":310,"_type":58,"marks":311,"text":312},"tg-s064",[],"Annotations",[],{"_key":315,"_type":54,"children":316,"markDefs":321,"style":71},"tg-b067",[317],{"_key":318,"_type":58,"marks":319,"text":320},"tg-s066",[],"Annotations attach data to a range, so each one stores an entry in the block's markDefs and the span references it by key.",[],{"_key":323,"_type":54,"children":324,"markDefs":329,"style":97},"tg-b069",[325],{"_key":326,"_type":58,"marks":327,"text":328},"tg-s068",[],"Heading style",[],{"_key":331,"_type":54,"children":332,"markDefs":346,"style":71},"tg-b073",[333,337,342],{"_key":334,"_type":58,"marks":335,"text":336},"tg-s070",[],"The heading annotation renders ",{"_key":338,"_type":58,"marks":339,"text":341},"tg-s071",[340],"tg-ann054","an inline heading",{"_key":343,"_type":58,"marks":344,"text":345},"tg-s072",[]," inside a paragraph — a span, not a real h-tag. It picks up the heading type scale but not the vertical rhythm, because vertical margins don't apply to inline elements.",[347],{"_key":340,"_type":348,"level":97},"heading",{"_key":350,"_type":54,"children":351,"markDefs":356,"style":97},"tg-b075",[352],{"_key":353,"_type":58,"marks":354,"text":355},"tg-s074",[],"Font size and line height",[],{"_key":358,"_type":54,"children":359,"markDefs":373,"style":71},"tg-b079",[360,364,369],{"_key":361,"_type":58,"marks":362,"text":363},"tg-s076",[],"Font size is set per range: ",{"_key":365,"_type":58,"marks":366,"text":368},"tg-s077",[367],"tg-ann055","this text is larger",{"_key":370,"_type":58,"marks":371,"text":372},"tg-s078",[]," than its neighbours.",[374],{"_key":367,"_type":375,"sizeClass":376},"fontSize","text-xl sm:text-2xl",{"_key":378,"_type":54,"children":379,"markDefs":393,"style":71},"tg-b083",[380,384,389],{"_key":381,"_type":58,"marks":382,"text":383},"tg-s080",[],"Line height is also an annotation, so it can only ever be ",{"_key":385,"_type":58,"marks":386,"text":388},"tg-s081",[387],"tg-ann056","inline",{"_key":390,"_type":58,"marks":391,"text":392},"tg-s082",[],". A line box takes the greater of the paragraph's own line height and any inline box on it, so values below the paragraph's setting have no visible effect — only the loosest option changes anything in body copy.",[394],{"_key":387,"_type":395,"heightClass":396},"lineHeight","leading-8",{"_key":398,"_type":54,"children":399,"markDefs":404,"style":97},"tg-b085",[400],{"_key":401,"_type":58,"marks":402,"text":403},"tg-s084",[],"Colour and links",[],{"_key":406,"_type":54,"children":407,"markDefs":421,"style":71},"tg-b089",[408,412,417],{"_key":409,"_type":58,"marks":410,"text":411},"tg-s086",[],"Highlight recolours text from the ",{"_key":413,"_type":58,"marks":414,"text":416},"tg-s087",[415],"tg-ann057","site colour palette",{"_key":418,"_type":58,"marks":419,"text":420},"tg-s088",[],", so it re-themes with the rest of the site.",[422],{"_key":415,"_type":423,"color":424},"highlight",{"_ref":425,"_type":15},"color-primary",{"_key":427,"_type":54,"children":428,"markDefs":467,"style":71},"tg-b099",[429,433,438,441,446,450,455,458,463],{"_key":430,"_type":58,"marks":431,"text":432},"tg-s090",[],"Links come in four flavours: ",{"_key":434,"_type":58,"marks":435,"text":437},"tg-s091",[436],"tg-ann058","external",{"_key":439,"_type":58,"marks":440,"text":195},"tg-s092",[],{"_key":442,"_type":58,"marks":443,"text":445},"tg-s093",[444],"tg-ann061","internal",{"_key":447,"_type":58,"marks":448,"text":449},"tg-s094",[]," (resolved from the referenced page's slug, so it survives a rename), ",{"_key":451,"_type":58,"marks":452,"text":454},"tg-s095",[453],"tg-ann059","email",{"_key":456,"_type":58,"marks":457,"text":250},"tg-s096",[],{"_key":459,"_type":58,"marks":460,"text":462},"tg-s097",[461],"tg-ann060","telephone",{"_key":464,"_type":58,"marks":465,"text":466},"tg-s098",[],".",[468,470,476,479],{"_key":436,"_type":10,"blank":160,"href":469},"https:\u002F\u002Fwww.sanity.io\u002Fdocs\u002Fblock-content",{"_key":444,"_type":471,"blank":472,"reference":473},"link.internal",false,{"_id":474,"_type":45,"url":475},"page-home","home",{"_key":453,"_type":477,"email":478},"link.email","mailto:hello@example.com",{"_key":461,"_type":480,"phone":481},"link.telephone","tel:+441234567890",{"_key":483,"_type":54,"children":484,"markDefs":498,"style":71},"tg-b103",[485,489,494],{"_key":486,"_type":58,"marks":487,"text":488},"tg-s100",[],"Gradient text derives its colours from the active theme ",{"_key":490,"_type":58,"marks":491,"text":493},"tg-s101",[492],"tg-ann062","when set to inherit",{"_key":495,"_type":58,"marks":496,"text":497},"tg-s102",[],", so it recolours with the rest of the page.",[499],{"_key":492,"_type":500,"colorSource":23,"direction":501,"gradientType":502},"gradientText","to-r","linear",{"_key":504,"_type":54,"children":505,"markDefs":511,"style":71},"tg-b105",[506],{"_key":507,"_type":58,"marks":508,"text":510},"tg-s104",[509],"tg-ann063","Width and alignment constrains a range to a maximum width and aligns it — it renders a block-level span, so it reads as its own narrow column inside the wider text.",[512],{"_key":509,"_type":513,"alignment":514,"preset":515},"widthControl","center","sm",{"_key":517,"_type":54,"children":518,"markDefs":523,"style":97},"tg-b107",[519],{"_key":520,"_type":58,"marks":521,"text":522},"tg-s106",[],"Quotes and lists",[],{"_key":525,"_type":54,"children":526,"markDefs":531,"style":532},"tg-b109",[527],{"_key":528,"_type":58,"marks":529,"text":530},"tg-s108",[],"Content is only as portable as the fields that describe it — a quote block still means 'quote' when the design changes.",[],"blockquote",{"_key":534,"_type":54,"children":535,"level":540,"listItem":541,"markDefs":542,"style":71},"tg-li111",[536],{"_key":537,"_type":58,"marks":538,"text":539},"tg-s110",[],"Bulleted list item",1,"bullet",[],{"_key":544,"_type":54,"children":545,"level":540,"listItem":541,"markDefs":550,"style":71},"tg-li113",[546],{"_key":547,"_type":58,"marks":548,"text":549},"tg-s112",[],"A second bullet, to show item spacing",[],{"_key":552,"_type":54,"children":553,"level":540,"listItem":558,"markDefs":559,"style":71},"tg-li115",[554],{"_key":555,"_type":58,"marks":556,"text":557},"tg-s114",[],"Numbered list item","number",[],{"_key":561,"_type":54,"children":562,"level":540,"listItem":558,"markDefs":567,"style":71},"tg-li117",[563],{"_key":564,"_type":58,"marks":565,"text":566},"tg-s116",[],"A second numbered item",[],{"_key":569,"_type":54,"children":570,"level":540,"listItem":575,"markDefs":576,"style":71},"tg-li119",[571],{"_key":572,"_type":58,"marks":573,"text":574},"tg-s118",[],"Lower-alpha list item","alpha",[],{"_type":150,"colorSource":23,"container":151,"padding":578},{"_type":153,"bottom":155,"top":154},{"_key":580,"_type":159,"divider":160,"dividerColor":298,"dividerStyle":581,"height":582,"options":583,"title":584},"tg-code-block","line",72,{"_type":150,"colorSource":23,"container":151},"Divider · Line",{"_key":586,"_type":49,"alignment":50,"content":587,"options":631,"width":156},"tg-code",[588,596,611,618,626],{"_key":589,"_type":54,"children":590,"markDefs":595,"style":80},"b0232",[591],{"_key":592,"_type":58,"marks":593,"text":594},"s0233",[],"Code blocks",[],{"_key":597,"_type":54,"children":598,"markDefs":610,"style":71},"b0237",[599,603,606],{"_key":600,"_type":58,"marks":601,"text":602},"s0234",[],"A fenced code block is its own type, so it can sit inside a rich-text field like this one or as a plain field on any schema that wants a snippet. Highlighting is resolved at build time and carries both colour schemes, so a block recolours with the site rather than staying dark on a light page. The inline ",{"_key":604,"_type":58,"marks":605,"text":222},"s0235",[222],{"_key":607,"_type":58,"marks":608,"text":609},"s0236",[]," decorator above is a different thing entirely.",[],{"_key":612,"_type":613,"colorSource":23,"markDefs":26,"snippet":614},"code0238","code.block",{"_type":222,"code":615,"filename":616,"language":617},"\u003Ctemplate>\n    \u003CPageSection :options=\"component?.options\">\n        \u003Ch2 v-if=\"component?.heading\">{{ component.heading }}\u003C\u002Fh2>\n    \u003C\u002FPageSection>\n\u003C\u002Ftemplate>\n\n\u003Cscript setup lang=\"ts\">\nimport type { FeatureGrid, ComponentProps } from '~~\u002Ftypes'\n\ninterface Props extends ComponentProps\u003CFeatureGrid> {}\ndefineProps\u003CProps>()\n\u003C\u002Fscript>","FeatureGrid.vue","vue",{"_key":619,"_type":54,"children":620,"markDefs":625,"style":71},"b0239",[621],{"_key":622,"_type":58,"marks":623,"text":624},"s0240",[],"Set a block to \"Use code colours\" instead of \"Inherit page theme\" when the snippet should keep the standard dark code styling whatever the page around it is doing.",[],{"_key":627,"_type":613,"colorSource":222,"markDefs":26,"snippet":628},"code0241",{"_type":222,"code":629,"language":630},"npm run dev:all        # Nuxt on 3000, Studio on 3333\nnpm run test:run       # unit + Nuxt tests\nnpm run generate       # static build","bash",{"_type":150,"colorSource":23,"container":151},"\u002Ftypography",{"_type":634,"includeInSitemap":472,"slug":635},"page.routing.options",{"_type":636,"current":637},"slug","typography","Typography & Portable Text","\u003Cpre class=\"shiki shiki-themes github-light github-dark nuxion-code__pre\" style=\"--shiki-light:#24292e;--shiki-dark:#e1e4e8;--shiki-light-bg:#fff;--shiki-dark-bg:#24292e\" tabindex=\"0\">\u003Ccode>\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#6F42C1;--shiki-dark:#B392F0\">npm\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#032F62;--shiki-dark:#9ECBFF\"> run\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#032F62;--shiki-dark:#9ECBFF\"> dev:all\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#6A737D;--shiki-dark:#6A737D\">        # Nuxt on 3000, Studio on 3333\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#6F42C1;--shiki-dark:#B392F0\">npm\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#032F62;--shiki-dark:#9ECBFF\"> run\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#032F62;--shiki-dark:#9ECBFF\"> test:run\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#6A737D;--shiki-dark:#6A737D\">       # unit + Nuxt tests\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#6F42C1;--shiki-dark:#B392F0\">npm\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#032F62;--shiki-dark:#9ECBFF\"> run\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#032F62;--shiki-dark:#9ECBFF\"> generate\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#6A737D;--shiki-dark:#6A737D\">       # static build\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fcode>\u003C\u002Fpre>","\u003Cpre class=\"shiki shiki-themes github-light github-dark nuxion-code__pre\" style=\"--shiki-light:#24292e;--shiki-dark:#e1e4e8;--shiki-light-bg:#fff;--shiki-dark-bg:#24292e\" tabindex=\"0\">\u003Ccode>\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\"><\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#22863A;--shiki-dark:#85E89D\">template\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">>\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">    <\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#22863A;--shiki-dark:#85E89D\">PageSection\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\"> :\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#6F42C1;--shiki-dark:#B392F0\">options\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">=\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#032F62;--shiki-dark:#9ECBFF\">\"\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">component?.options\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#032F62;--shiki-dark:#9ECBFF\">\"\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">>\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">        <\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#22863A;--shiki-dark:#85E89D\">h2\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#6F42C1;--shiki-dark:#B392F0\"> v-if\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">=\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#032F62;--shiki-dark:#9ECBFF\">\"component?.heading\"\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">>{{ component.heading }}<\u002F\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#22863A;--shiki-dark:#85E89D\">h2\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">>\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">    <\u002F\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#22863A;--shiki-dark:#85E89D\">PageSection\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">>\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\"><\u002F\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#22863A;--shiki-dark:#85E89D\">template\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">>\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\"><\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#22863A;--shiki-dark:#85E89D\">script\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#6F42C1;--shiki-dark:#B392F0\"> setup\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#6F42C1;--shiki-dark:#B392F0\"> lang\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">=\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#032F62;--shiki-dark:#9ECBFF\">\"ts\"\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">>\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#D73A49;--shiki-dark:#F97583\">import\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#D73A49;--shiki-dark:#F97583\"> type\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\"> { FeatureGrid, ComponentProps } \u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#D73A49;--shiki-dark:#F97583\">from\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#032F62;--shiki-dark:#9ECBFF\"> '~~\u002Ftypes'\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#D73A49;--shiki-dark:#F97583\">interface\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#6F42C1;--shiki-dark:#B392F0\"> Props\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#D73A49;--shiki-dark:#F97583\"> extends\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#6F42C1;--shiki-dark:#B392F0\"> ComponentProps\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\"><\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#6F42C1;--shiki-dark:#B392F0\">FeatureGrid\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">> {}\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#6F42C1;--shiki-dark:#B392F0\">defineProps\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\"><\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#6F42C1;--shiki-dark:#B392F0\">Props\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">>()\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\"><\u002F\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#22863A;--shiki-dark:#85E89D\">script\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">>\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fcode>\u003C\u002Fpre>",1790674588299]