@arc-ui/community-components 3.1.0 → 3.2.0

package/lib/styles.css

@@ -1 +1 @@
-.AccordionHeading-module_accordion-header__8s12f{padding-bottom:40px;width:auto}.AccordionHeading-module_accordion-header--hasImage__wbDjW{display:flex;flex-direction:column;gap:16px}@media (min-width:636px){.AccordionHeading-module_accordion-header--padded__me1JY{min-width:588px;width:auto}.AccordionHeading-module_accordion-header--hasImage__wbDjW{align-items:center;flex-direction:row;gap:32px}}@media (min-width:768px){.AccordionHeading-module_accordion-header--padded__me1JY{min-width:720px;padding:0 186px 40px 0}}@media (min-width:1024px){.AccordionHeading-module_accordion-header--padded__me1JY{min-width:960px;padding:0 246px 40px 0}}@media (min-width:1280px){.AccordionHeading-module_accordion-header--padded__me1JY{min-width:1216px;padding:0 312px 40px 0}}.AccordionHeading-module_accordion-header--headingSizeM__amLfy{padding-bottom:24px;width:auto}.AccordionDisclosureList-module_AccordionDisclosureListItem__p8LIT.AccordionDisclosureList-module_AccordionDisclosureListItem__p8LIT:not(:first-child)>*>summary{border-top:0;line-height:29px}.Accordion-module_Accordion__LsXTU li,.Accordion-module_Accordion__LsXTU ul{list-style:none;margin:0;padding:0}.Author-module_authorContent__TBY7b{padding-left:var(--sem-space-padding-70)}.Author-module_largeAvatar__Vco03{margin-bottom:var(--sem-space-gap-5)}.CopyLead-module_buttonContainer__3OaRG{margin:var(--sem-space-padding-150) auto 0;width:100%}.CopyLead-module_col__0Da5H{flex:1 1 auto;width:100%}.CopyLead-module_container__I91ym{align-items:flex-start;display:flex;gap:var(--sem-space-padding-150)}.CopyLead-module_container--content__e8LxG{flex-direction:column}.CopyLead-module_container--media__QcMWi{flex-direction:column-reverse}.CopyLead-module_container--align-center__Fh1Sd{align-items:center}.CopyLead-module_container--align-top__UIXOZ{align-items:flex-start}.CopyLead-module_list__arnJd{list-style:none;margin:0;max-width:480px;padding:0}.CopyLead-module_listItem__NscHE{display:flex}.CopyLead-module_listItem__NscHE:nth-of-type(n+2){margin-top:var(--sem-space-padding-150)}.CopyLead-module_listItemCentered__Kwdab{align-items:center}.CopyLead-module_listItemIconContainer__dgnhJ{flex:0 0 auto}.CopyLead-module_listItemTextContainer__Dl9lw{flex:1 1 auto;padding:0 0 0 var(--sem-space-padding-80)}.CopyLead-module_imgWrapper__HYP3w{border-radius:var(--sem-border-radius-s);overflow:hidden}.CopyLead-module_mediaContainer__PxTnm{margin-bottom:var(--sem-space-padding-150)}.CopyLead-module_content__Bja1D{max-width:715px}@media (min-width:636px){.CopyLead-module_buttonContainer__3OaRG{width:-moz-max-content;width:max-content}}@media (min-width:768px){.CopyLead-module_container__I91ym{gap:var(--sem-space-padding-110)}.CopyLead-module_container--content__e8LxG,.CopyLead-module_container--media__QcMWi{flex-direction:row}.CopyLead-module_container--reverse__Gq9u8{flex-direction:row-reverse}.CopyLead-module_buttonContainer__3OaRG{margin:var(--sem-space-padding-150) 0 0}.CopyLead-module_col__0Da5H{width:50%}.CopyLead-module_list__arnJd{max-width:100%}.CopyLead-module_listItemTextContainer__Dl9lw{padding:0 var(--sem-space-padding-80)}}@media (min-width:1024px){.CopyLead-module_listItemTextContainer__Dl9lw{padding:0 var(--sem-space-padding-110)}}@media (min-width:1280px){.CopyLead-module_container__I91ym{gap:var(--sem-space-padding-130)}.CopyLead-module_listItemTextContainer__Dl9lw{padding:0 var(--sem-space-padding-130)}}.SectionHeading-module_section-header__iB07I{padding-bottom:40px;width:auto}.SectionHeading-module_section-header--hasImage__Ka3T7{display:flex;flex-direction:column;gap:16px}@media (min-width:636px){.SectionHeading-module_section-header--padded__0FXP2{min-width:588px;width:auto}.SectionHeading-module_section-header--hasImage__Ka3T7{align-items:center;flex-direction:row;gap:32px}}@media (min-width:768px){.SectionHeading-module_section-header--padded__0FXP2{min-width:720px;padding:0 186px 40px 0}}@media (min-width:1024px){.SectionHeading-module_section-header--padded__0FXP2{min-width:960px;padding:0 246px 40px 0}}@media (min-width:1280px){.SectionHeading-module_section-header--padded__0FXP2{min-width:1216px;padding:0 312px 40px 0}}@media (min-width:768px){.DownloadList-module_headingContainer__PNio8{max-width:75%}}html{scroll-behavior:smooth}.FAQs-module_FAQs__FtQr4 li,.FAQs-module_FAQs__FtQr4 ul{list-style:none;margin:0;padding:0}.FAQs-module_linkListSection__RdQkU{display:flex;flex-direction:column;margin-bottom:40px}.FAQs-module_linkListTitle__RVni3{margin-bottom:8px}.FAQs-module_linkList__dPyXj{display:flex;flex-wrap:wrap;row-gap:8px}.FAQs-module_linkListSection__RdQkU .FAQs-module_linkListItem__S83CL:after{color:#d9d9d9;content:"|";padding:0 8px}.FAQs-module_linkListSection__RdQkU .FAQs-module_linkListItem__S83CL:last-child:after{content:""}@media (--arc-custom-media-min-width-s-px ){.FAQs-module_linkList--padded__8Paxc{min-width:588px;width:auto}}@media (--arc-custom-media-min-width-m-px ){.FAQs-module_linkList--padded__8Paxc{min-width:720px;padding-right:186px}}@media (--arc-custom-media-min-width-l-px ){.FAQs-module_linkList--padded__8Paxc{min-width:960px;padding-right:246px}}@media (--arc-custom-media-min-width-xl-px ){.FAQs-module_linkList--padded__8Paxc{min-width:1216px;padding-right:312px}}.FeaturePost-module_labelDate__NXOgY{padding-top:var(--sem-space-padding-20);text-transform:uppercase}.FeaturePost-module_authorContent__FEuRO{padding-left:var(--sem-space-padding-70)}.FeaturePost-module_googlePlayButtonWrapper__GI-ag{padding:var(--sem-space-padding-70) 0 0}.FeaturePost-module_imgWrapper__r6omd{border-radius:var(--sem-border-radius-s);overflow:hidden}@media (min-width:636px){.FeaturePost-module_googlePlayButtonWrapper__GI-ag{padding:0 0 0 var(--sem-space-padding-70)}}@media (min-width:768px){.FeaturePost-module_featurePost__9jY21{display:flex;gap:24px}.FeaturePost-module_featurePostReversed__WQRXm{flex-direction:row-reverse}.FeaturePost-module_contentContainer__kdus7{padding:0 var(--sem-space-padding-110) 0 0}.FeaturePost-module_col__eW8gY{flex:0 1 auto;width:50%}.FeaturePost-module_labelDate__NXOgY{padding-left:var(--sem-space-padding-70)}}@media (min-width:1280px){.FeaturePost-module_featurePost__9jY21{gap:32px}.FeaturePost-module_contentContainer__kdus7{padding:0 var(--sem-space-padding-130) 0 0}}.Highlights-module_highlights__Hf7Zq{grid-gap:48px 24px;display:grid;gap:48px 24px;grid-template-columns:1fr}.Highlights-module_highlightItem__-N6le{max-width:480px;width:auto}@media (min-width:636px){.Highlights-module_highlights__Hf7Zq{grid-template-columns:1fr 1fr}.Highlights-module_highlightItem__-N6le{min-width:282px;padding-right:0}}@media (min-width:768px){.Highlights-module_highlights2Column__6qIuI{grid-template-columns:1fr 1fr}.Highlights-module_highlights2Column__6qIuI .Highlights-module_highlightItem__-N6le{max-width:-moz-max-content;max-width:max-content;min-width:348px;padding-right:62px}.Highlights-module_highlights3Column__qsCMP{grid-template-columns:1fr 1fr 1fr}.Highlights-module_highlights3Column__qsCMP .Highlights-module_highlightItem__-N6le{min-width:224px}}@media (min-width:1024px){.Highlights-module_highlights2Column__6qIuI{grid-template-columns:1fr 1fr}.Highlights-module_highlights2Column__6qIuI .Highlights-module_highlightItem__-N6le{min-width:468px;padding-right:82px}.Highlights-module_highlights3Column__qsCMP{grid-template-columns:1fr 1fr 1fr}.Highlights-module_highlights3Column__qsCMP .Highlights-module_highlightItem__-N6le{min-width:304px}}@media (min-width:1280px){.Highlights-module_highlights__Hf7Zq{gap:48px 32px}.Highlights-module_highlights2Column__6qIuI{grid-template-columns:1fr 1fr}.Highlights-module_highlights2Column__6qIuI .Highlights-module_highlightItem__-N6le{min-width:592px;padding-right:104px}.Highlights-module_highlights3Column__qsCMP{grid-template-columns:1fr 1fr 1fr}.Highlights-module_highlights3Column__qsCMP .Highlights-module_highlightItem__-N6le{min-width:384px}}.PromoListing-module_PromoListing__6ensv{max-width:1280px}.PromoListing-module_carouselSlide__AMTPF{height:100%;padding:6px}.PromoListing-module_cardGrid__llf73{grid-gap:16px;display:grid;gap:16px;grid-auto-rows:1fr;grid-template-columns:repeat(1,1fr);list-style:none;margin:0;padding:0}.PromoListing-module_cardWrapper__I4iwh,.PromoListing-module_cardWrapper__I4iwh>*{height:100%}.PromoListing-module_cardWrapperCarousel__t-2qM{height:100%;margin-right:16px;width:288px}.PromoListing-module_cardWrapperCarousel__t-2qM>*{height:100%}@media (min-width:636px){.PromoListing-module_cardWrapperCarousel__t-2qM{margin-right:24px}.PromoListing-module_cardGrid__llf73{gap:24px}.PromoListing-module_cardGrid__llf73.PromoListing-module_columns-2__GRFxb,.PromoListing-module_cardGrid__llf73.PromoListing-module_columns-3__y6jWS{grid-template-columns:repeat(2,1fr)}}@media (min-width:768px){.PromoListing-module_cardWrapperCarousel__t-2qM{width:348px}}@media (min-width:1024px){.PromoListing-module_cardGrid__llf73.PromoListing-module_columns-3__y6jWS{grid-template-columns:repeat(3,1fr)}.PromoListing-module_cardGrid__llf73.PromoListing-module_columns-2__GRFxb{grid-template-columns:repeat(2,1fr)}}@media (min-width:1280px){.PromoListing-module_cardGrid__llf73{gap:32px}}.Quote-module_blockQuote__STj-z{font-size:36px;font-style:normal;font-weight:500;margin:0}.Quote-module_quoteContent__kWc51{line-height:44px;margin:0;padding-bottom:32px;padding-top:32px}.Quote-module_quoteDefault__tU5db{fill:#5514b4;color:#5514b4}.Quote-module_quoteSecondary__3Rk3f{fill:#434343;color:#434343}.Quote-module_quoteIcon__HK1TV{height:76.471px;width:100px}svg{padding:0}@media (min-width:768px){.Quote-module_blockQuote__STj-z{font-size:40px}.Quote-module_quoteContent__kWc51{line-height:48px}}@media (min-width:1024px){.Quote-module_quoteIcon__HK1TV{height:95.588px;width:125px}}@media (min-width:1280px){.Quote-module_blockQuote__STj-z{font-size:56px}.Quote-module_quoteContent__kWc51{line-height:64px}}.Summary-module_ruleContainer__ydWlG{flex:0 1 auto;padding:24px}.Summary-module_ruleContainer__ydWlG .arc-Rule{margin:0}@media (min-width:768px){.Summary-module_row__SKV--{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) auto minmax(0,1fr)}}@media (min-width:1024px){.Summary-module_ruleContainer__ydWlG{padding:12px 48px}.Summary-module_row__SKV--{padding:0 24px}}.Statistics-module_list__BI-eQ{list-style:none;margin:0;padding:0}.Statistics-module_mutedText__MR1JM,.arc a.Statistics-module_mutedText__MR1JM{color:var(--sem-color-text-primary-light-subtle)}.Statistics-module_statWrapper__83OnM{margin-bottom:-12px}@media (min-width:636px){.Statistics-module_statWrapper__83OnM{margin-bottom:0}}.BannerWithTabs-module_contentSwitcherWrapper__xvz39{display:none}.BannerWithTabs-module_contentSwitcherDropdownWrapper__eT5zq{display:block}@media (min-width:636px){.BannerWithTabs-module_contentSwitcherWrapper__xvz39{display:block}.BannerWithTabs-module_contentSwitcherDropdownWrapper__eT5zq{display:none}}.BannerWithTabs-module_bannerWithTabsHeadingCentered__upqEO{text-align:center}@media (min-width:636px){.BannerWithTabs-module_bannerWithTabsHeadingCentered__upqEO{padding-left:62px;padding-right:62px}}@media (min-width:768px){.BannerWithTabs-module_bannerWithTabsHeadingCentered__upqEO{padding-left:86px;padding-right:86px}}@media (min-width:1024px){.BannerWithTabs-module_bannerWithTabsHeadingCentered__upqEO{padding-left:104px;padding-right:104px}}.ArticleSidebar-module_tagGroup__rIPQc{display:flex;flex-wrap:wrap;gap:16px}.ArticleSidebar-module_textContent__3nCfG{padding-right:16px}.ArticleSidebar-module_additionalContentContainer__91L4n{display:flex;flex-direction:column;gap:16px}.ArticleSidebar-module_shareButtonContainer__iAfHL{display:flex;gap:8px}.arc a.ArticleSidebar-module_shareButton__rb-1E{background:var(--sem-color-bg-secondary-light-default);border:1px solid var(--sem-color-border-secondary-light-subtle);border-radius:50%;color:var(--sem-color-fg-secondary-light-default);cursor:pointer;display:block;padding:12px;transition:color .4s ease,border-color .4s ease}.arc a.ArticleSidebar-module_shareButton__rb-1E:hover{border-color:var(--sem-color-bg-primary-light-strong);color:var(--sem-color-bg-primary-light-strong)}.ProductNavigation-module_product-navigation-grid__RzFq8{grid-gap:24px;display:grid;grid-auto-rows:1fr;grid-template-columns:repeat(1,1fr);list-style:none;margin:0;max-width:1216px;padding:0}@media (min-width:636px){.ProductNavigation-module_product-navigation-grid__RzFq8{grid-template-columns:repeat(2,1fr)}}@media (min-width:1024px){.ProductNavigation-module_product-navigation-grid__RzFq8{grid-template-columns:repeat(3,1fr)}}@media (min-width:1280px){.ProductNavigation-module_product-navigation-grid__RzFq8{grid-gap:32px}}.ProductNavigation-module_productNavigation-skipLink__fy8ZJ{margin-top:56px;position:absolute;scale:0;width:calc(100% - 32px)}@media (min-width:768px){.ProductNavigation-module_productNavigation-skipLink__fy8ZJ{margin-left:12px;margin-top:0;position:static;scale:0;width:auto}}.ProductNavigation-module_productNavigation-skipLink__fy8ZJ[focus-within]{scale:1}.ProductNavigation-module_productNavigation-skipLink__fy8ZJ:focus-within{scale:1}.ContentInfoWidget-module_container__yaS-8{align-items:center;display:flex;flex-direction:row;max-width:250px;overflow-x:hidden;white-space:nowrap}.ContentInfoWidget-module_text__O1BdZ{padding-left:8px}.ContentInfoWidget-module_icon__LEww1{color:var(--sem-color-fg-secondary-light-subtle)}.HeroLink-module_heroLink__WUqWB{align-items:center;background:transparent;border:2px solid #e5e5e5;border-radius:32px;color:#5514b4;cursor:pointer;display:inline-flex;font-size:14px;font-weight:500;gap:4px;height:-moz-fit-content;height:fit-content;justify-content:center;line-height:1;padding:16px 16px 16px 24px;text-decoration:none;transition:all .2s ease;width:-moz-fit-content;width:fit-content}.HeroLink-module_heroLink__WUqWB:hover{border-color:#3f187f;color:#3f187f}.HeroLink-module_heroLink-inner__RE5i8{align-items:center;display:flex;gap:4px}.HeroLink-module_heroLink-label__93HPY{white-space:nowrap}.HeroLink-module_heroLink-icon__l7o4U{align-items:center;display:flex;justify-content:center}.HeroLink-module_heroLink--emptyLabel__XY2sa{padding:16px}.ActionTile-module_action-tile__JPwGb{align-items:center;background:transparent;border:1px solid #c8c8c8;border-radius:16px;cursor:pointer;display:flex;flex-direction:horizontal;gap:16px;height:164px;justify-content:space-between;padding:24px;position:relative;text-decoration:none;transition:all .2s ease;width:230px}.ActionTile-module_action-tile-content__ZkgHc{align-items:flex-start;display:flex;flex:1;flex-direction:column;gap:12px}.ActionTile-module_action-tile-icon__PY1EN{align-items:center;color:#2a2a2a;display:flex;height:48px;justify-content:flex-start;transition:color .2s ease;width:48px}.ActionTile-module_action-tile-heading__Uxdu9{word-wrap:break-word;color:#2a2a2a;font-family:BT Curve,sans-serif;font-size:20px;font-weight:500;letter-spacing:0;line-height:28px;margin:0 0 0 -12px;transition:color .2s ease;width:100%}.ActionTile-module_action-tile--active__-aWze{background:#efe5f7;border-color:#2a1c4a}.ActionTile-module_action-tile--active__-aWze .ActionTile-module_action-tile-heading__Uxdu9,.ActionTile-module_action-tile--active__-aWze .ActionTile-module_action-tile-icon__PY1EN{color:#2a1c4a}.ActionTile-module_action-tile--active__-aWze:hover{background:#efe5f7;border-color:#2a1c4a}.ActionTile-module_action-tile__JPwGb:hover{border-color:#3f187f}.ActionTile-module_action-tile__JPwGb:hover .ActionTile-module_action-tile-heading__Uxdu9,.ActionTile-module_action-tile__JPwGb:hover .ActionTile-module_action-tile-icon__PY1EN{color:#3f187f}.ActionTile-module_action-tile-tick__vhsJE{align-items:center;background:#2a1c4a;border-radius:24px;color:#fff;display:flex;flex-shrink:0;height:28px;justify-content:center;position:absolute;right:-8px;top:-8px;width:28px}.LinkTile-module_link-tile__xVUP3{background:#fff;border:1px solid #c8c8c8;border-radius:32px;cursor:pointer;display:flex;flex-direction:column;padding:24px;text-decoration:none;transition:border-color .2s ease,border-radius .2s ease;width:306px}.LinkTile-module_link-tile-content__H-QN8{align-items:center;display:flex;gap:8px;justify-content:space-between}.LinkTile-module_link-tile-text__0K6zf{color:#5514b4;flex:1;font-family:BT Curve,sans-serif;font-size:16px;font-weight:500;letter-spacing:0;line-height:24px;transition:color .2s ease}.LinkTile-module_link-tile__xVUP3 .LinkTile-module_link-tile-content__H-QN8 svg{color:#5514b4;flex-shrink:0;transition:color .2s ease}.LinkTile-module_link-tile__xVUP3:hover{border-color:#5514b4}.LinkTile-module_link-tile__xVUP3:active{border-radius:32px}.LinkTile-module_link-tile__xVUP3:hover .LinkTile-module_link-tile-content__H-QN8 svg,.LinkTile-module_link-tile__xVUP3:hover .LinkTile-module_link-tile-text__0K6zf{color:#3f187f}@media (max-width:1023px){.LinkTile-module_link-tile__xVUP3{padding:24px 16px 24px 24px}}
+.AccordionHeading-module_accordion-header__8s12f{padding-bottom:40px;width:auto}.AccordionHeading-module_accordion-header--hasImage__wbDjW{display:flex;flex-direction:column;gap:16px}@media (min-width:636px){.AccordionHeading-module_accordion-header--padded__me1JY{min-width:588px;width:auto}.AccordionHeading-module_accordion-header--hasImage__wbDjW{align-items:center;flex-direction:row;gap:32px}}@media (min-width:768px){.AccordionHeading-module_accordion-header--padded__me1JY{min-width:720px;padding:0 186px 40px 0}}@media (min-width:1024px){.AccordionHeading-module_accordion-header--padded__me1JY{min-width:960px;padding:0 246px 40px 0}}@media (min-width:1280px){.AccordionHeading-module_accordion-header--padded__me1JY{min-width:1216px;padding:0 312px 40px 0}}.AccordionHeading-module_accordion-header--headingSizeM__amLfy{padding-bottom:24px;width:auto}.AccordionDisclosureList-module_AccordionDisclosureListItem__p8LIT.AccordionDisclosureList-module_AccordionDisclosureListItem__p8LIT:not(:first-child)>*>summary{border-top:0;line-height:29px}.Accordion-module_Accordion__LsXTU li,.Accordion-module_Accordion__LsXTU ul{list-style:none;margin:0;padding:0}.Author-module_authorContent__TBY7b{padding-left:var(--sem-space-padding-70)}.Author-module_largeAvatar__Vco03{margin-bottom:var(--sem-space-gap-5)}.CopyLead-module_buttonContainer__3OaRG{margin:var(--sem-space-padding-150) auto 0;width:100%}.CopyLead-module_col__0Da5H{flex:1 1 auto;width:100%}.CopyLead-module_container__I91ym{align-items:flex-start;display:flex;gap:var(--sem-space-padding-150)}.CopyLead-module_container--content__e8LxG{flex-direction:column}.CopyLead-module_container--media__QcMWi{flex-direction:column-reverse}.CopyLead-module_container--align-center__Fh1Sd{align-items:center}.CopyLead-module_container--align-top__UIXOZ{align-items:flex-start}.CopyLead-module_list__arnJd{list-style:none;margin:0;max-width:480px;padding:0}.CopyLead-module_listItem__NscHE{display:flex}.CopyLead-module_listItem__NscHE:nth-of-type(n+2){margin-top:var(--sem-space-padding-150)}.CopyLead-module_listItemCentered__Kwdab{align-items:center}.CopyLead-module_listItemIconContainer__dgnhJ{flex:0 0 auto}.CopyLead-module_listItemTextContainer__Dl9lw{flex:1 1 auto;padding:0 0 0 var(--sem-space-padding-80)}.CopyLead-module_imgWrapper__HYP3w{border-radius:var(--sem-border-radius-s);overflow:hidden}.CopyLead-module_mediaContainer__PxTnm{margin-bottom:var(--sem-space-padding-150)}.CopyLead-module_content__Bja1D{max-width:715px}@media (min-width:636px){.CopyLead-module_buttonContainer__3OaRG{width:-moz-max-content;width:max-content}}@media (min-width:768px){.CopyLead-module_container__I91ym{gap:var(--sem-space-padding-110)}.CopyLead-module_container--content__e8LxG,.CopyLead-module_container--media__QcMWi{flex-direction:row}.CopyLead-module_container--reverse__Gq9u8{flex-direction:row-reverse}.CopyLead-module_buttonContainer__3OaRG{margin:var(--sem-space-padding-150) 0 0}.CopyLead-module_col__0Da5H{width:50%}.CopyLead-module_list__arnJd{max-width:100%}.CopyLead-module_listItemTextContainer__Dl9lw{padding:0 var(--sem-space-padding-80)}}@media (min-width:1024px){.CopyLead-module_listItemTextContainer__Dl9lw{padding:0 var(--sem-space-padding-110)}}@media (min-width:1280px){.CopyLead-module_container__I91ym{gap:var(--sem-space-padding-130)}.CopyLead-module_listItemTextContainer__Dl9lw{padding:0 var(--sem-space-padding-130)}}.SectionHeading-module_section-header__iB07I{padding-bottom:40px;width:auto}.SectionHeading-module_section-header--hasImage__Ka3T7{display:flex;flex-direction:column;gap:16px}@media (min-width:636px){.SectionHeading-module_section-header--padded__0FXP2{min-width:588px;width:auto}.SectionHeading-module_section-header--hasImage__Ka3T7{align-items:center;flex-direction:row;gap:32px}}@media (min-width:768px){.SectionHeading-module_section-header--padded__0FXP2{min-width:720px;padding:0 186px 40px 0}}@media (min-width:1024px){.SectionHeading-module_section-header--padded__0FXP2{min-width:960px;padding:0 246px 40px 0}}@media (min-width:1280px){.SectionHeading-module_section-header--padded__0FXP2{min-width:1216px;padding:0 312px 40px 0}}@media (min-width:768px){.DownloadList-module_headingContainer__PNio8{max-width:75%}}html{scroll-behavior:smooth}.FAQs-module_FAQs__FtQr4 li,.FAQs-module_FAQs__FtQr4 ul{list-style:none;margin:0;padding:0}.FAQs-module_linkListSection__RdQkU{display:flex;flex-direction:column;margin-bottom:40px}.FAQs-module_linkListTitle__RVni3{margin-bottom:8px}.FAQs-module_linkList__dPyXj{display:flex;flex-wrap:wrap;row-gap:8px}.FAQs-module_linkListSection__RdQkU .FAQs-module_linkListItem__S83CL:after{color:#d9d9d9;content:"|";padding:0 8px}.FAQs-module_linkListSection__RdQkU .FAQs-module_linkListItem__S83CL:last-child:after{content:""}@media (--arc-custom-media-min-width-s-px ){.FAQs-module_linkList--padded__8Paxc{min-width:588px;width:auto}}@media (--arc-custom-media-min-width-m-px ){.FAQs-module_linkList--padded__8Paxc{min-width:720px;padding-right:186px}}@media (--arc-custom-media-min-width-l-px ){.FAQs-module_linkList--padded__8Paxc{min-width:960px;padding-right:246px}}@media (--arc-custom-media-min-width-xl-px ){.FAQs-module_linkList--padded__8Paxc{min-width:1216px;padding-right:312px}}.FeaturePost-module_labelDate__NXOgY{padding-top:var(--sem-space-padding-20);text-transform:uppercase}.FeaturePost-module_authorContent__FEuRO{padding-left:var(--sem-space-padding-70)}.FeaturePost-module_googlePlayButtonWrapper__GI-ag{padding:var(--sem-space-padding-70) 0 0}.FeaturePost-module_imgWrapper__r6omd{border-radius:var(--sem-border-radius-s);overflow:hidden}@media (min-width:636px){.FeaturePost-module_googlePlayButtonWrapper__GI-ag{padding:0 0 0 var(--sem-space-padding-70)}}@media (min-width:768px){.FeaturePost-module_featurePost__9jY21{display:flex;gap:24px}.FeaturePost-module_featurePostReversed__WQRXm{flex-direction:row-reverse}.FeaturePost-module_contentContainer__kdus7{padding:0 var(--sem-space-padding-110) 0 0}.FeaturePost-module_col__eW8gY{flex:0 1 auto;width:50%}.FeaturePost-module_labelDate__NXOgY{padding-left:var(--sem-space-padding-70)}}@media (min-width:1280px){.FeaturePost-module_featurePost__9jY21{gap:32px}.FeaturePost-module_contentContainer__kdus7{padding:0 var(--sem-space-padding-130) 0 0}}.Highlights-module_highlights__Hf7Zq{grid-gap:48px 24px;display:grid;gap:48px 24px;grid-template-columns:1fr}.Highlights-module_highlightItem__-N6le{max-width:480px;width:auto}@media (min-width:636px){.Highlights-module_highlights__Hf7Zq{grid-template-columns:1fr 1fr}.Highlights-module_highlightItem__-N6le{min-width:282px;padding-right:0}}@media (min-width:768px){.Highlights-module_highlights2Column__6qIuI{grid-template-columns:1fr 1fr}.Highlights-module_highlights2Column__6qIuI .Highlights-module_highlightItem__-N6le{max-width:-moz-max-content;max-width:max-content;min-width:348px;padding-right:62px}.Highlights-module_highlights3Column__qsCMP{grid-template-columns:1fr 1fr 1fr}.Highlights-module_highlights3Column__qsCMP .Highlights-module_highlightItem__-N6le{min-width:224px}}@media (min-width:1024px){.Highlights-module_highlights2Column__6qIuI{grid-template-columns:1fr 1fr}.Highlights-module_highlights2Column__6qIuI .Highlights-module_highlightItem__-N6le{min-width:468px;padding-right:82px}.Highlights-module_highlights3Column__qsCMP{grid-template-columns:1fr 1fr 1fr}.Highlights-module_highlights3Column__qsCMP .Highlights-module_highlightItem__-N6le{min-width:304px}}@media (min-width:1280px){.Highlights-module_highlights__Hf7Zq{gap:48px 32px}.Highlights-module_highlights2Column__6qIuI{grid-template-columns:1fr 1fr}.Highlights-module_highlights2Column__6qIuI .Highlights-module_highlightItem__-N6le{min-width:592px;padding-right:104px}.Highlights-module_highlights3Column__qsCMP{grid-template-columns:1fr 1fr 1fr}.Highlights-module_highlights3Column__qsCMP .Highlights-module_highlightItem__-N6le{min-width:384px}}.PromoListing-module_PromoListing__6ensv{max-width:1280px}.PromoListing-module_carouselSlide__AMTPF{height:100%;padding:6px}.PromoListing-module_cardGrid__llf73{grid-gap:16px;display:grid;gap:16px;grid-auto-rows:1fr;grid-template-columns:repeat(1,1fr);list-style:none;margin:0;padding:0}.PromoListing-module_cardWrapper__I4iwh,.PromoListing-module_cardWrapper__I4iwh>*{height:100%}.PromoListing-module_cardWrapperCarousel__t-2qM{height:100%;margin-right:16px;width:288px}.PromoListing-module_cardWrapperCarousel__t-2qM>*{height:100%}@media (min-width:636px){.PromoListing-module_cardWrapperCarousel__t-2qM{margin-right:24px}.PromoListing-module_cardGrid__llf73{gap:24px}.PromoListing-module_cardGrid__llf73.PromoListing-module_columns-2__GRFxb,.PromoListing-module_cardGrid__llf73.PromoListing-module_columns-3__y6jWS{grid-template-columns:repeat(2,1fr)}}@media (min-width:768px){.PromoListing-module_cardWrapperCarousel__t-2qM{width:348px}}@media (min-width:1024px){.PromoListing-module_cardGrid__llf73.PromoListing-module_columns-3__y6jWS{grid-template-columns:repeat(3,1fr)}.PromoListing-module_cardGrid__llf73.PromoListing-module_columns-2__GRFxb{grid-template-columns:repeat(2,1fr)}}@media (min-width:1280px){.PromoListing-module_cardGrid__llf73{gap:32px}}.Quote-module_blockQuote__STj-z{font-size:36px;font-style:normal;font-weight:500;margin:0}.Quote-module_quoteContent__kWc51{line-height:44px;margin:0;padding-bottom:32px;padding-top:32px}.Quote-module_quoteDefault__tU5db{fill:#5514b4;color:#5514b4}.Quote-module_quoteSecondary__3Rk3f{fill:#434343;color:#434343}.Quote-module_quoteIcon__HK1TV{height:76.471px;width:100px}svg{padding:0}@media (min-width:768px){.Quote-module_blockQuote__STj-z{font-size:40px}.Quote-module_quoteContent__kWc51{line-height:48px}}@media (min-width:1024px){.Quote-module_quoteIcon__HK1TV{height:95.588px;width:125px}}@media (min-width:1280px){.Quote-module_blockQuote__STj-z{font-size:56px}.Quote-module_quoteContent__kWc51{line-height:64px}}.Summary-module_ruleContainer__ydWlG{flex:0 1 auto;padding:24px}.Summary-module_ruleContainer__ydWlG .arc-Rule{margin:0}@media (min-width:768px){.Summary-module_row__SKV--{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) auto minmax(0,1fr)}}@media (min-width:1024px){.Summary-module_ruleContainer__ydWlG{padding:12px 48px}.Summary-module_row__SKV--{padding:0 24px}}.Statistics-module_list__BI-eQ{list-style:none;margin:0;padding:0}.Statistics-module_mutedText__MR1JM,.arc a.Statistics-module_mutedText__MR1JM{color:var(--sem-color-text-primary-light-subtle)}.Statistics-module_statWrapper__83OnM{margin-bottom:-12px}@media (min-width:636px){.Statistics-module_statWrapper__83OnM{margin-bottom:0}}.BannerWithTabs-module_contentSwitcherWrapper__xvz39{display:none}.BannerWithTabs-module_contentSwitcherDropdownWrapper__eT5zq{display:block}@media (min-width:636px){.BannerWithTabs-module_contentSwitcherWrapper__xvz39{display:block}.BannerWithTabs-module_contentSwitcherDropdownWrapper__eT5zq{display:none}}.BannerWithTabs-module_bannerWithTabsHeadingCentered__upqEO{text-align:center}@media (min-width:636px){.BannerWithTabs-module_bannerWithTabsHeadingCentered__upqEO{padding-left:62px;padding-right:62px}}@media (min-width:768px){.BannerWithTabs-module_bannerWithTabsHeadingCentered__upqEO{padding-left:86px;padding-right:86px}}@media (min-width:1024px){.BannerWithTabs-module_bannerWithTabsHeadingCentered__upqEO{padding-left:104px;padding-right:104px}}.ArticleSidebar-module_tagGroup__rIPQc{display:flex;flex-wrap:wrap;gap:16px}.ArticleSidebar-module_textContent__3nCfG{padding-right:16px}.ArticleSidebar-module_additionalContentContainer__91L4n{display:flex;flex-direction:column;gap:16px}.ArticleSidebar-module_shareButtonContainer__iAfHL{display:flex;gap:8px}.arc a.ArticleSidebar-module_shareButton__rb-1E{background:var(--sem-color-bg-secondary-light-default);border:1px solid var(--sem-color-border-secondary-light-subtle);border-radius:50%;color:var(--sem-color-fg-secondary-light-default);cursor:pointer;display:block;padding:12px;transition:color .4s ease,border-color .4s ease}.arc a.ArticleSidebar-module_shareButton__rb-1E:hover{border-color:var(--sem-color-bg-primary-light-strong);color:var(--sem-color-bg-primary-light-strong)}.ProductNavigation-module_product-navigation-grid__RzFq8{grid-gap:24px;display:grid;grid-auto-rows:1fr;grid-template-columns:repeat(1,1fr);list-style:none;margin:0;max-width:1216px;padding:0}@media (min-width:636px){.ProductNavigation-module_product-navigation-grid__RzFq8{grid-template-columns:repeat(2,1fr)}}@media (min-width:1024px){.ProductNavigation-module_product-navigation-grid__RzFq8{grid-template-columns:repeat(3,1fr)}}@media (min-width:1280px){.ProductNavigation-module_product-navigation-grid__RzFq8{grid-gap:32px}}.ProductNavigation-module_productNavigation-skipLink__fy8ZJ{margin-top:56px;position:absolute;scale:0;width:calc(100% - 32px)}@media (min-width:768px){.ProductNavigation-module_productNavigation-skipLink__fy8ZJ{margin-left:12px;margin-top:0;position:static;scale:0;width:auto}}.ProductNavigation-module_productNavigation-skipLink__fy8ZJ[focus-within]{scale:1}.ProductNavigation-module_productNavigation-skipLink__fy8ZJ:focus-within{scale:1}.ContentInfoWidget-module_container__yaS-8{align-items:center;display:flex;flex-direction:row;max-width:250px;overflow-x:hidden;white-space:nowrap}.ContentInfoWidget-module_text__O1BdZ{padding-left:8px}.ContentInfoWidget-module_icon__LEww1{color:var(--sem-color-fg-secondary-light-subtle)}.HeroLink-module_heroLink__WUqWB{align-items:center;background:transparent;border:2px solid #e5e5e5;border-radius:32px;color:#5514b4;cursor:pointer;display:inline-flex;font-size:14px;font-weight:500;gap:4px;height:-moz-fit-content;height:fit-content;justify-content:center;line-height:1;padding:16px 16px 16px 24px;text-decoration:none;transition:all .2s ease;width:-moz-fit-content;width:fit-content}.HeroLink-module_heroLink__WUqWB:hover{border-color:#3f187f;color:#3f187f}.HeroLink-module_heroLink-inner__RE5i8{align-items:center;display:flex;gap:4px}.HeroLink-module_heroLink-label__93HPY{white-space:nowrap}.HeroLink-module_heroLink-icon__l7o4U{align-items:center;display:flex;justify-content:center}.HeroLink-module_heroLink--emptyLabel__XY2sa{padding:16px}.ActionTile-module_action-tile__JPwGb{align-items:center;background:transparent;border:1px solid #c8c8c8;border-radius:16px;cursor:pointer;display:flex;flex-direction:horizontal;gap:16px;height:164px;justify-content:space-between;padding:24px;position:relative;text-decoration:none;transition:all .2s ease;width:230px}.ActionTile-module_action-tile-content__ZkgHc{align-items:flex-start;display:flex;flex:1;flex-direction:column;gap:12px}.ActionTile-module_action-tile-icon__PY1EN{align-items:center;color:#2a2a2a;display:flex;height:48px;justify-content:flex-start;transition:color .2s ease;width:48px}.ActionTile-module_action-tile-heading__Uxdu9{word-wrap:break-word;color:#2a2a2a;font-family:BT Curve,sans-serif;font-size:20px;font-weight:500;letter-spacing:0;line-height:28px;margin:0 0 0 -12px;transition:color .2s ease;width:100%}.ActionTile-module_action-tile--active__-aWze{background:#efe5f7;border-color:#2a1c4a}.ActionTile-module_action-tile--active__-aWze .ActionTile-module_action-tile-heading__Uxdu9,.ActionTile-module_action-tile--active__-aWze .ActionTile-module_action-tile-icon__PY1EN{color:#2a1c4a}.ActionTile-module_action-tile--active__-aWze:hover{background:#efe5f7;border-color:#2a1c4a}.ActionTile-module_action-tile__JPwGb:hover{border-color:#3f187f}.ActionTile-module_action-tile__JPwGb:hover .ActionTile-module_action-tile-heading__Uxdu9,.ActionTile-module_action-tile__JPwGb:hover .ActionTile-module_action-tile-icon__PY1EN{color:#3f187f}.ActionTile-module_action-tile-tick__vhsJE{align-items:center;background:#2a1c4a;border-radius:24px;color:#fff;display:flex;flex-shrink:0;height:28px;justify-content:center;position:absolute;right:-8px;top:-8px;width:28px}.LinkTile-module_link-tile__xVUP3{background:#fff;border:1px solid #c8c8c8;border-radius:32px;cursor:pointer;display:flex;flex-direction:column;padding:24px;text-decoration:none;transition:border-color .2s ease,border-radius .2s ease;width:306px}.LinkTile-module_link-tile-content__H-QN8{align-items:center;display:flex;gap:8px;justify-content:space-between}.LinkTile-module_link-tile-text__0K6zf{color:#5514b4;flex:1;font-family:BT Curve,sans-serif;font-size:16px;font-weight:500;letter-spacing:0;line-height:24px;transition:color .2s ease}.LinkTile-module_link-tile__xVUP3 .LinkTile-module_link-tile-content__H-QN8 svg{color:#5514b4;flex-shrink:0;transition:color .2s ease}.LinkTile-module_link-tile__xVUP3:hover{border-color:#5514b4}.LinkTile-module_link-tile__xVUP3:active{border-radius:32px}.LinkTile-module_link-tile__xVUP3:hover .LinkTile-module_link-tile-content__H-QN8 svg,.LinkTile-module_link-tile__xVUP3:hover .LinkTile-module_link-tile-text__0K6zf{color:#3f187f}@media (max-width:1023px){.LinkTile-module_link-tile__xVUP3{padding:24px 16px 24px 24px}}.ThumbnailSignpost-module_thumbnailSignpost__Yf26b button{all:unset;cursor:pointer}.ThumbnailSignpost-module_thumbnailSignpost__Yf26b{display:inline-flex;flex-direction:row;gap:var(--arc-size-grid-gutter-s);max-width:720px}.ThumbnailSignpost-module_isLink__FucdG:focus{border-radius:calc(var(--thumbnail-signpost-border-radius-s) + 2px);cursor:pointer;outline:var(--focus-border-weight-s) solid var(--focus-colors-light-border-subtle);outline-offset:2px}.ThumbnailSignpost-module_isLink__FucdG:hover{cursor:pointer}.ThumbnailSignpost-module_content__XG9oj{font:var(--sem-type-body-reg-s);width:100%}.ThumbnailSignpost-module_heading__mTrpJ{display:block;font:var(--sem-type-mobile-semi-xxs);font-family:var(--sem-font-family-heading);font-size:1em;font-weight:var(--sem-font-weight-semi-bold);margin:0}.ThumbnailSignpost-module_isLink__FucdG:focus .ThumbnailSignpost-module_heading__mTrpJ,.ThumbnailSignpost-module_isLink__FucdG:hover .ThumbnailSignpost-module_heading__mTrpJ{color:var(--button-v2-colors-light-text-hover);text-decoration:underline}.ThumbnailSignpost-module_image__syGZj{width:calc((100% + var(--arc-size-grid-gutter-s))/12*6 - var(--arc-size-grid-gutter-s))}.ThumbnailSignpost-module_image__syGZj img{border-radius:var(--thumbnail-signpost-border-radius-s);width:100%}@media (min-width:636px){.ThumbnailSignpost-module_image__syGZj{width:calc((100% + var(--arc-size-grid-gutter-s))/12*6 - var(--arc-size-grid-gutter-m))}.ThumbnailSignpost-module_thumbnailSignpost__Yf26b{gap:var(--arc-size-grid-gutter-m)}.ThumbnailSignpost-module_heading__mTrpJ{font:var(--sem-type-mobile-semi-xs)}}@media (min-width:1280px){.ThumbnailSignpost-module_thumbnailSignpost__Yf26b{gap:var(--arc-size-grid-gutter-l)}}.ThumbnailSignpost-module_thumbnailButton__Nn-NR{align-items:center;color:var(--button-v2-colors-light-text-default);display:flex;font:var(--sem-type-interface-button-s);gap:var(--button-v2-gap-xs);height:var(--button-v2-size-s)}.ThumbnailSignpost-module_buttonIcon__ydmza{background:var(--icon-color-brand-alt-light);display:block;height:100%;line-height:0;-webkit-mask-position:center;mask-position:center;-webkit-mask-size:contain;mask-size:contain;width:100%}.ThumbnailSignpost-module_isLink__FucdG:focus .ThumbnailSignpost-module_buttonIcon__ydmza,.ThumbnailSignpost-module_isLink__FucdG:hover .ThumbnailSignpost-module_buttonIcon__ydmza{background:var(--button-v2-colors-light-text-hover)}.ThumbnailSignpost-module_isLink__FucdG:focus .ThumbnailSignpost-module_thumbnailButton__Nn-NR,.ThumbnailSignpost-module_isLink__FucdG:hover .ThumbnailSignpost-module_thumbnailButton__Nn-NR{background:none;color:var(--button-v2-colors-light-text-hover);-webkit-text-decoration:var(--sem-underline);text-decoration:var(--sem-underline)}.PromoListingThumbnailSignpost-module_PromoListingThumbnailSignpost__0HTPV{max-width:1280px}.PromoListingThumbnailSignpost-module_PromoListingThumbnailSignpost__0HTPV li,.PromoListingThumbnailSignpost-module_PromoListingThumbnailSignpost__0HTPV ul{margin:0;padding:0;text-decoration:none}.PromoListingThumbnailSignpost-module_list__E9l0E{grid-column-gap:var(--arc-size-grid-gutter-s);grid-row-gap:24px;-moz-column-gap:var(--arc-size-grid-gutter-s);column-gap:var(--arc-size-grid-gutter-s);display:grid;grid-template-columns:repeat(12,1fr);list-style:none;margin:0;padding:0;row-gap:24px}.PromoListingThumbnailSignpost-module_list__E9l0E li{grid-column:span 12}@media (min-width:636px){.PromoListingThumbnailSignpost-module_list__E9l0E{row-gap:32px}}@media (min-width:768px){.PromoListingThumbnailSignpost-module_list__E9l0E{-moz-column-gap:var(--arc-size-grid-gutter-m);column-gap:var(--arc-size-grid-gutter-m)}.PromoListingThumbnailSignpost-module_list__E9l0E li{grid-column:span 6}}@media (min-width:1024px){.PromoListingThumbnailSignpost-module_list__E9l0E{row-gap:40px}}@media (min-width:1280px){.PromoListingThumbnailSignpost-module_list__E9l0E{-moz-column-gap:var(--arc-size-grid-gutter-l);column-gap:var(--arc-size-grid-gutter-l)}}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@arc-ui/community-components",
-  "version": "3.1.0",
+  "version": "3.2.0",
   "type": "module",
   "homepage": "https://ui.digital-ent-int.bt.com",
   "author": "BT Business Digital UI Team <ui-digital-ent-int@bt.com>",
@@ -34,8 +34,8 @@
     "access": "public"
   },
   "peerDependencies": {
-    "@arc-ui/components": "13.4.0",
-    "@arc-ui/themes": "13.4.0",
+    "@arc-ui/components": "13.5.0",
+    "@arc-ui/themes": "13.5.0",
     "react": "^19.2.3",
     "react-dom": "^19.2.3"
   },
@@ -45,14 +45,14 @@
     }
   },
   "devDependencies": {
-    "@arc-ui/components": "13.4.0",
-    "@arc-ui/gradients": "13.4.0",
-    "@arc-ui/icons": "13.4.0",
-    "@arc-ui/themes": "13.4.0",
-    "@arc-ui/tokens-arc": "13.4.0",
-    "@arc-ui/tokens-bt-business": "13.4.0",
-    "@arc-ui/tokens-bt-enterprise": "13.4.0",
-    "@arc-ui/tokens-ee": "13.4.0",
+    "@arc-ui/components": "13.5.0",
+    "@arc-ui/gradients": "13.5.0",
+    "@arc-ui/icons": "13.5.0",
+    "@arc-ui/themes": "13.5.0",
+    "@arc-ui/tokens-arc": "13.5.0",
+    "@arc-ui/tokens-bt-business": "13.5.0",
+    "@arc-ui/tokens-bt-enterprise": "13.5.0",
+    "@arc-ui/tokens-ee": "13.5.0",
     "@rollup/plugin-commonjs": "^28.0.1",
     "@rollup/plugin-node-resolve": "^15.3.0",
     "@rollup/plugin-typescript": "^12.1.1",
@@ -74,10 +74,10 @@
     "tslib": "^2.8.1",
     "typescript": "^5.6.3",
     "@arc-ui/community-build-utils": "^0.1.0",
-    "@arc-ui/community-utils": "^0.2.0",
     "@arc-ui/community-css-config": "^0.1.1",
-    "@arc-ui/community-typescript-config": "^0.1.0",
-    "@arc-ui/community-eslint-config": "^0.1.1"
+    "@arc-ui/community-eslint-config": "^0.1.1",
+    "@arc-ui/community-utils": "^0.2.0",
+    "@arc-ui/community-typescript-config": "^0.1.0"
   },
   "browserslist": [
     "defaults",

package/src/components/Accordion/components/AccordionDisclosureList/AccordionDisclosureList.tsx

@@ -24,7 +24,7 @@ export const AccordionDisclosureList: React.FC<
           id,
           ...props
         }) => (
-          <li key={id} className={styles.AccordionDisclosureListItem}>
+          <li key={id} className={styles.AccordionDisclosureListItem} id={id}>
             <Disclosure
               summary={summary}
               isOpen={isOpen}

package/src/components/FAQs/FAQs.tsx

@@ -12,6 +12,18 @@ import { Tabs, TabsList, TabsContent, TabsItem } from "@arc-ui/components/Tabs";
 
 import styles from "./FAQs.module.css";
 
+const scrollToSectionFocusFirstElement = (item: ExtendedAccordionProps) => {
+  if (!item.id) return;
+
+  document.getElementById(item.id)?.scrollIntoView({ behavior: "smooth" });
+
+  // preventScroll avoids interfering with the scroll animation.
+  document
+    .getElementById(item.disclosureList?.[0]?.id)
+    ?.querySelector("summary")
+    ?.focus({ preventScroll: true });
+};
+
 export const FAQs: React.FC<FAQsProps> = ({
   heading,
   isHeadingWordWrap,
@@ -53,12 +65,7 @@ export const FAQs: React.FC<FAQsProps> = ({
                 href={`#${item.id}`}
                 onClick={(e) => {
                   e.preventDefault();
-                  if (item.id) {
-                    const element = document.getElementById(item.id);
-                    if (element) {
-                      element.scrollIntoView({ behavior: "smooth" });
-                    }
-                  }
+                  scrollToSectionFocusFirstElement(item);
                 }}
               >
                 {item.altLinkTitle ?? item.heading}

package/src/components/FeaturePost/FeaturePost.tsx

@@ -103,7 +103,11 @@ export const FeaturePost: React.FC<FeaturePostProps> = ({
 
           <VerticalSpace size="40" />
 
-          <Text size="l">{content}</Text>
+          {typeof content === "string" ? (
+            <Text size="l">{content}</Text>
+          ) : (
+            content
+          )}
 
           {footer?.type === "cta" && (
             <>
@@ -190,7 +194,7 @@ export interface FeaturePostProps {
   /**
    * Text content for `FeaturePost`.
    */
-  content: string | ReactNode;
+  content: ReactNode;
 
   /**
    * Reverse the columns so the image / video appears on the left. Doesn't affect mobile layouts, and is only applied if there is a video or an image.

package/src/components/FeaturePost/components/Image/Image.tsx

@@ -1,16 +1,40 @@
 import React from "react";
 
 import { Image as ArcImage } from "@arc-ui/components/Image";
+import { Text } from "@arc-ui/components/Text";
+import { Heading } from "@arc-ui/components/Heading";
+import { VerticalSpace } from "@arc-ui/components/VerticalSpace";
 
 import { FeaturePostImage } from "../../types";
 
 import styles from "../../FeaturePost.module.css";
 
-export const Image: React.FC<FeaturePostImage> = ({ sources, ...props }) => (
-  <div className={styles.imgWrapper}>
-    <ArcImage fadeOnLoad {...props}>
-      {sources &&
-        sources.map((source) => <source key={source.srcSet} {...source} />)}
-    </ArcImage>
-  </div>
+export const Image: React.FC<FeaturePostImage> = ({
+  sources,
+  title,
+  description,
+  ...props
+}) => (
+  <>
+    <div className={styles.imgWrapper}>
+      <ArcImage fadeOnLoad {...props}>
+        {sources &&
+          sources.map((source) => <source key={source.srcSet} {...source} />)}
+      </ArcImage>
+    </div>
+    {title && (
+      <>
+        <VerticalSpace size="24" />
+        <Heading level="3" size="s">
+          {title}
+        </Heading>
+        {description && (
+          <>
+            <VerticalSpace size="16" />
+            <Text size="m">{description}</Text>
+          </>
+        )}
+      </>
+    )}
+  </>
 );

package/src/components/FeaturePost/types/feature-post-image.ts

@@ -16,4 +16,6 @@ export interface FeaturePostImage
     | "fadeOnLoad"
   > {
   sources?: Pick<ImageSourceProps, "media" | "sizes" | "srcSet">[];
+  title?: string;
+  description?: string;
 }

package/src/components/PromoListingThumbnailSignpost/PromoListingThumbnailSignpost.module.css

@@ -0,0 +1,54 @@
+@import url("@arc-ui/tokens-arc/dist/custom-media.css");
+
+.PromoListingThumbnailSignpost {
+  max-width: 1280px;
+}
+
+.PromoListingThumbnailSignpost ul,
+.PromoListingThumbnailSignpost li {
+  text-decoration: none;
+  padding: 0;
+  margin: 0;
+}
+
+.list {
+  display: grid;
+  grid-template-columns: repeat(12, 1fr);
+  column-gap: var(--arc-size-grid-gutter-s);
+  row-gap: 24px;
+  list-style: none;
+  margin: 0;
+  padding: 0;
+}
+
+.list li {
+  grid-column: span 12;
+}
+
+@media (--arc-custom-media-min-width-s-px) {
+  .list {
+    row-gap: 32px;
+  }
+}
+
+@media (--arc-custom-media-min-width-m-px) {
+  .list {
+    column-gap: var(--arc-size-grid-gutter-m);
+  }
+
+  .list li {
+    grid-column: span 6;
+  }
+}
+
+@media (--arc-custom-media-min-width-l-px) {
+  .list {
+    row-gap: 40px;
+  }
+}
+
+@media (--arc-custom-media-min-width-xl-px) {
+  .list {
+    column-gap: var(--arc-size-grid-gutter-l);
+  }
+}

package/src/components/PromoListingThumbnailSignpost/PromoListingThumbnailSignpost.tsx

@@ -0,0 +1,53 @@
+import React from "react";
+
+import { SectionHeading, type SectionHeadingProps } from "../SectionHeading";
+
+import { filterAttrs } from "@arc-ui/community-utils/filter-attrs";
+
+import styles from "./PromoListingThumbnailSignpost.module.css";
+
+import {
+  ThumbnailSignpost,
+  type ThumbnailSignpostProps,
+} from "../ThumbnailSignpost";
+
+/**
+ * Use `PromoListingThumbnailSignpost` to give supporting information about a page or proposition in the form of the ThumbnailSignposts components.
+ */
+export const PromoListingThumbnailSignpost: React.FC<
+  PromoListingThumbnailSignpostProps
+> = ({
+  isPadded = true,
+  heading,
+  content,
+  headingLevel,
+  thumbnailList,
+  ...props
+}) => {
+  return (
+    <div
+      className={styles.PromoListingThumbnailSignpost}
+      {...filterAttrs(props)}
+    >
+      <SectionHeading
+        isPadded={isPadded}
+        data-testid="PromoListingThumbnailSignpost-header"
+        heading={heading}
+        headingLevel={headingLevel}
+        content={content}
+      />
+      <ul className={styles.list}>
+        {thumbnailList.map((thumbnail, index) => (
+          <li key={index}>
+            <ThumbnailSignpost {...thumbnail} />
+          </li>
+        ))}
+      </ul>
+    </div>
+  );
+};
+
+export interface PromoListingThumbnailSignpostProps
+  extends SectionHeadingProps {
+  thumbnailList: ThumbnailSignpostProps[];
+}

package/src/components/PromoListingThumbnailSignpost/index.ts

@@ -0,0 +1,4 @@
+export {
+  PromoListingThumbnailSignpost,
+  type PromoListingThumbnailSignpostProps,
+} from "./PromoListingThumbnailSignpost";

package/src/components/ThumbnailSignpost/ThumbnailSignpost.module.css

@@ -0,0 +1,112 @@
+@import url("@arc-ui/tokens-arc/dist/custom-media.css");
+
+.thumbnailSignpost button {
+  all: unset;
+  cursor: pointer;
+}
+
+.thumbnailSignpost {
+  display: inline-flex;
+  flex-direction: row;
+  gap: var(--arc-size-grid-gutter-s);
+  max-width: 720px;
+}
+
+.isLink:focus {
+  cursor: pointer;
+  outline: var(--focus-border-weight-s) solid
+    var(--focus-colors-light-border-subtle);
+  outline-offset: 2px;
+  border-radius: calc(var(--thumbnail-signpost-border-radius-s) + 2px);
+}
+
+.isLink:hover {
+  cursor: pointer;
+}
+
+.content {
+  width: 100%;
+  font: var(--sem-type-body-reg-s);
+}
+
+.heading {
+  display: block;
+  font: var(--sem-type-mobile-semi-xxs);
+  font-family: var(--sem-font-family-heading);
+  font-size: 1em;
+  font-weight: var(--sem-font-weight-semi-bold);
+  margin: 0;
+}
+
+.isLink:hover .heading,
+.isLink:focus .heading {
+  color: var(--button-v2-colors-light-text-hover);
+  text-decoration: underline;
+}
+
+.image {
+  width: calc(
+    (((100% + var(--arc-size-grid-gutter-s)) / 12) * 6) -
+      var(--arc-size-grid-gutter-s)
+  );
+}
+
+/* stylelint-disable-next-line plugin/selector-bem-pattern */
+.image img {
+  border-radius: var(--thumbnail-signpost-border-radius-s);
+  width: 100%;
+}
+
+@media (--arc-custom-media-min-width-s-px) {
+  .image {
+    width: calc(
+      (((100% + var(--arc-size-grid-gutter-s)) / 12) * 6) -
+        var(--arc-size-grid-gutter-m)
+    );
+  }
+
+  .thumbnailSignpost {
+    gap: var(--arc-size-grid-gutter-m);
+  }
+
+  .heading {
+    font: var(--sem-type-mobile-semi-xs);
+  }
+}
+
+@media (--arc-custom-media-min-width-xl-px) {
+  .thumbnailSignpost {
+    gap: var(--arc-size-grid-gutter-l);
+  }
+}
+
+.thumbnailButton {
+  display: flex;
+  align-items: center;
+  gap: var(--button-v2-gap-xs);
+  color: var(--button-v2-colors-light-text-default);
+  font: var(--sem-type-interface-button-s);
+  height: var(--button-v2-size-s);
+}
+
+.buttonIcon {
+  background: var(--icon-color-brand-alt-light);
+  display: block;
+  height: 100%;
+  line-height: 0;
+  mask-position: center;
+  mask-size: contain;
+  width: 100%;
+}
+
+.isLink:focus .buttonIcon,
+.isLink:hover .buttonIcon {
+  background: var(--button-v2-colors-light-text-hover);
+}
+
+.isLink:hover .thumbnailButton,
+.isLink:focus .thumbnailButton {
+  background: none;
+  color: var(--button-v2-colors-light-text-hover);
+  text-decoration: var(--sem-underline);
+}

package/src/components/ThumbnailSignpost/ThumbnailSignpost.tsx

@@ -0,0 +1,100 @@
+import React from "react";
+
+import classNames from "classnames";
+import styles from "./ThumbnailSignpost.module.css";
+
+import { filterAttrs } from "@arc-ui/community-utils/filter-attrs";
+
+import { BtIconArrowRightFill } from "@arc-ui/icons/BtIconArrowRightFill";
+
+import { Image, type ImageProps } from "@arc-ui/components/Image";
+import { VerticalSpace } from "@arc-ui/components/VerticalSpace";
+import { Heading } from "@arc-ui/components/Heading";
+
+/** Use `ThumbnailSignpost` to highlight key information or navigation points with an accompanying thumbnail image or icon. */
+export const ThumbnailSignpost = ({
+  text,
+  title,
+  img,
+  onClick,
+  buttonLabel,
+  ...props
+}: ThumbnailSignpostProps) => {
+  return (
+    <div
+      className={classNames(styles.thumbnailSignpost, {
+        [styles.isLink]: onClick,
+      })}
+      onClick={onClick}
+      aria-label={title}
+      tabIndex={onClick ? 0 : -1}
+      {...(onClick && { role: "button" })}
+      {...filterAttrs(props)}
+    >
+      {img && (
+        <div className={styles.image}>
+          <Image {...img} />
+        </div>
+      )}
+      <div className={styles.content}>
+        <span className={styles.heading}>{title}</span>
+        <VerticalSpace size="8" />
+        {text}
+        {buttonLabel && onClick && (
+          <>
+            <VerticalSpace size="8" />
+            <div className={styles.thumbnailButton}>
+              <span
+                className={styles.buttonIcon}
+                role="img"
+                style={{
+                  height: 24,
+                  width: 24,
+                  maskImage: `url("${BtIconArrowRightFill}")`,
+                  WebkitMaskImage: `url("${BtIconArrowRightFill}")`,
+                }}
+              />
+              <Heading size="xxs">{buttonLabel}</Heading>
+            </div>
+          </>
+        )}
+      </div>
+    </div>
+  );
+};
+
+export interface ThumbnailSignpostProps {
+  /**
+   * Title for the ThumbnailSignpost.
+   */
+  title: string;
+
+  /**
+   * Text content for the ThumbnailSignpost.
+   */
+  text: string;
+
+  /**
+   * Label for the button in the ThumbnailSignpost.
+   */
+  buttonLabel?: string;
+
+  /**
+   * Image properties for the ThumbnailSignpost.
+   */
+  img?: Pick<
+    ImageProps,
+    | "src"
+    | "alt"
+    | "loading"
+    | "sizes"
+    | "srcSet"
+    | "anchor"
+    | "fadeOnLoad"
+    | "fetchPriority"
+  >;
+  /**
+   * Optional click handler for the ThumbnailSignpost.
+   */
+  onClick?: () => void;
+}

package/src/components/ThumbnailSignpost/index.ts

@@ -0,0 +1,4 @@
+export {
+  ThumbnailSignpost,
+  type ThumbnailSignpostProps,
+} from "./ThumbnailSignpost";

package/src/components/index.ts

@@ -17,3 +17,5 @@ export * from "./ContentInfoWidget";
 export * from "./HeroLink";
 export * from "./ActionTile";
 export * from "./LinkTile";
+export * from "./ThumbnailSignpost";
+export * from "./PromoListingThumbnailSignpost";

package/versions.json

@@ -1 +1 @@
-["v3.1.0","v3.0.1","v3.0.0","v2.0.0","v1.1.0","v1.0.2","v1.0.1","v1.0.0","v0.1.0"]
+["v3.2.0","v3.1.0","v3.0.1","v3.0.0","v2.0.0","v1.1.0","v1.0.2","v1.0.1","v1.0.0","v0.1.0"]