@arc-ui/community-components 3.3.0 → 3.4.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)}.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)}.ActionTile-module_action-tile__JPwGb{align-items:center;background:var(--sem-color-bg-secondary-light-default);border:var(--sem-border-width-xxs) solid var(--sem-color-border-secondary-light-minimal);border-radius:var(--sem-border-radius-xl);box-sizing:border-box;cursor:pointer;display:flex;flex-direction:row;gap:var(--sem-space-padding-70);height:164px;isolation:isolate;justify-content:center;overflow:visible;padding:var(--sem-space-padding-110);position:relative;text-decoration:none;transition:border-color .2s ease,box-shadow .2s ease;width:230px}.ActionTile-module_action-tile-content__ZkgHc{align-items:flex-start;align-self:stretch;display:flex;flex:1;flex-direction:column;gap:var(--sem-space-padding-60)}.ActionTile-module_action-tile-icon__PY1EN{align-items:center;color:var(--sem-color-fg-secondary-light-default);display:flex;height:48px;justify-content:flex-start;transition:color .2s ease;width:48px}.ActionTile-module_action-tile-heading__Uxdu9{word-wrap:break-word;align-self:stretch;color:var(--sem-color-fg-secondary-light-default);flex-grow:1;font-family:var(--sem-font-family-heading);font-size:var(--sem-font-size-125);font-weight:var(--sem-font-weight-semi);letter-spacing:0;line-height:var(--sem-line-height-base-scale-m);margin:0;transition:color .2s ease;width:100%}.ActionTile-module_action-tile--active__-aWze{background:var(--sem-color-bg-primary-light-subtle-alt);border-color:var(--sem-color-fg-primary-light-minimal);box-shadow:none}.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:var(--sem-color-fg-primary-light-minimal)}.ActionTile-module_action-tile-tick__vhsJE{align-items:center;background:var(--sem-color-fg-primary-light-minimal);border-radius:var(--sem-border-radius-l);color:var(--sem-color-fg-secondary-light-alt);display:flex;flex-shrink:0;height:28px;justify-content:center;position:absolute;right:-4px;top:-4px;width:28px;z-index:1}.ActionTile-module_action-tile__JPwGb:hover{border-color:var(--button-v2-colors-light-text-hover);box-shadow:0 0 0 1px var(--button-v2-colors-light-text-hover)}.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:var(--button-v2-colors-light-text-hover)}.ActionTile-module_action-tile--active__-aWze:hover{background:var(--sem-color-bg-primary-light-subtle-alt);border-color:var(--sem-color-fg-primary-light-minimal);box-shadow:0 0 0 1px var(--sem-color-fg-primary-light-minimal)}.ActionTile-module_action-tile--active__-aWze:hover .ActionTile-module_action-tile-heading__Uxdu9,.ActionTile-module_action-tile--active__-aWze:hover .ActionTile-module_action-tile-icon__PY1EN{color:var(--sem-color-fg-primary-light-minimal)}.LinkTile-module_link-tile__xVUP3{align-items:center;align-self:stretch;background:var(--sem-color-bg-secondary-light-default);border:var(--sem-border-width-xxs) solid var(--sem-color-border-secondary-light-minimal);border-radius:var(--sem-border-radius-xl);box-sizing:border-box;cursor:pointer;display:flex;flex:none;flex-direction:column;height:96px;justify-content:center;overflow:visible;padding:var(--sem-space-padding-110) var(--sem-space-padding-70) var(--sem-space-padding-110) var(--sem-space-padding-110);position:relative;text-decoration:none;transition:border-color .2s ease;width:306px}.LinkTile-module_link-tile-content__H-QN8{align-items:center;align-self:stretch;display:flex;flex:none;flex-direction:row;gap:var(--sem-space-padding-40);height:48px;justify-content:center;width:100%}.LinkTile-module_link-tile-icon__kTMfH{color:var(--sem-color-fg-primary-light-default);display:flex;flex:none;flex-shrink:0;height:32px;order:1;transition:color .2s ease;width:32px}.LinkTile-module_link-tile-text__0K6zf{color:var(--sem-color-fg-primary-light-default);flex:1;font-family:var(--sem-font-family-heading);font-size:var(--sem-font-size-100);font-weight:var(--sem-font-weight-semi);letter-spacing:0;line-height:var(--sem-line-height-base-scale-xs);order:0;transition:color .2s ease}.LinkTile-module_link-tile-icon__kTMfH svg,.LinkTile-module_link-tile__xVUP3 .LinkTile-module_link-tile-content__H-QN8 svg{color:inherit;transition:color .2s ease}.LinkTile-module_link-tile__xVUP3[\:not-has\(svg\)]{padding:var(--sem-space-padding-110)}.LinkTile-module_link-tile__xVUP3:not(:has(svg)){padding:var(--sem-space-padding-110)}.LinkTile-module_link-tile__xVUP3:active{border-radius:var(--sem-border-radius-xl)}@media (min-width:1024px){.LinkTile-module_link-tile__xVUP3{padding:var(--sem-space-padding-110) var(--sem-space-padding-70) var(--sem-space-padding-110) var(--sem-space-padding-110)}}.LinkTile-module_link-tile__xVUP3:hover{border-color:transparent;box-shadow:inset 0 0 0 2px var(--button-v2-colors-light-text-hover)}.LinkTile-module_link-tile__xVUP3:hover .LinkTile-module_link-tile-icon__kTMfH,.LinkTile-module_link-tile__xVUP3:hover .LinkTile-module_link-tile-text__0K6zf{color:var(--button-v2-colors-light-text-hover)}.InlineLinkGroup-module_quick-help__cMTpB{align-items:center;display:flex;flex-direction:column;width:100%}.InlineLinkGroup-module_quick-help__cMTpB li,.InlineLinkGroup-module_quick-help__cMTpB ul{list-style:none;margin:0;padding:0}.InlineLinkGroup-module_quick-help-label__VLKen{align-items:center;display:flex;flex-direction:row;padding-bottom:var(--sem-space-padding-110);width:100%}.InlineLinkGroup-module_quick-help-container__IStTk{align-items:center;display:flex;flex-direction:row;flex-wrap:wrap;gap:var(--sem-space-padding-70);width:100%}.InlineLinkGroup-module_quick-help-item__QTIMl{align-items:center;display:flex;flex:0 0 auto;gap:var(--arc-spacing-4);width:auto}.InlineLinkGroup-module_quick-help-item__QTIMl svg{display:none;height:24px;width:24px}.InlineLinkGroup-module_quick-help-separator__qJE0q{align-items:center;display:flex}.InlineLinkGroup-module_quick-help-separator-line__VbCVI{background:var(--sem-color-border-secondary-light-minimal);height:14px;width:1px}@media not (min-width:636px){.InlineLinkGroup-module_quick-help-container__IStTk{align-items:flex-start;flex-direction:column;gap:var(--sem-space-padding-70)}.InlineLinkGroup-module_quick-help-item__QTIMl svg{display:block}.InlineLinkGroup-module_quick-help-separator__qJE0q{display:none}}.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)}}
+.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)}.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)}.ActionTile-module_action-tile__JPwGb{align-items:center;background:var(--sem-color-bg-secondary-light-default);border:var(--sem-border-width-xxs) solid var(--sem-color-border-secondary-light-minimal);border-radius:var(--sem-border-radius-xl);box-sizing:border-box;cursor:pointer;display:flex;flex-direction:row;gap:var(--sem-space-padding-70);height:164px;isolation:isolate;justify-content:center;overflow:visible;padding:var(--sem-space-padding-110);position:relative;text-decoration:none;transition:border-color .2s ease,box-shadow .2s ease;width:230px}.ActionTile-module_action-tile-content__ZkgHc{align-items:flex-start;align-self:stretch;display:flex;flex:1;flex-direction:column;gap:var(--sem-space-padding-60)}.ActionTile-module_action-tile-icon__PY1EN{align-items:center;color:var(--sem-color-fg-secondary-light-default);display:flex;height:48px;justify-content:flex-start;transition:color .2s ease;width:48px}.ActionTile-module_action-tile-heading__Uxdu9{word-wrap:break-word;align-self:stretch;color:var(--sem-color-fg-secondary-light-default);flex-grow:1;font-family:var(--sem-font-family-heading);font-size:var(--sem-font-size-125);font-weight:var(--sem-font-weight-semi);letter-spacing:0;line-height:var(--sem-line-height-base-scale-m);margin:0;transition:color .2s ease;width:100%}.ActionTile-module_action-tile--active__-aWze{background:var(--sem-color-bg-primary-light-subtle-alt);border-color:var(--sem-color-fg-primary-light-minimal);box-shadow:none}.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:var(--sem-color-fg-primary-light-minimal)}.ActionTile-module_action-tile-tick__vhsJE{align-items:center;background:var(--sem-color-fg-primary-light-minimal);border-radius:var(--sem-border-radius-l);color:var(--sem-color-fg-secondary-light-alt);display:flex;flex-shrink:0;height:28px;justify-content:center;position:absolute;right:-4px;top:-4px;width:28px;z-index:1}.ActionTile-module_action-tile__JPwGb:hover{border-color:var(--button-v2-colors-light-text-hover);box-shadow:0 0 0 1px var(--button-v2-colors-light-text-hover)}.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:var(--button-v2-colors-light-text-hover)}.ActionTile-module_action-tile--active__-aWze:hover{background:var(--sem-color-bg-primary-light-subtle-alt);border-color:var(--sem-color-fg-primary-light-minimal);box-shadow:0 0 0 1px var(--sem-color-fg-primary-light-minimal)}.ActionTile-module_action-tile--active__-aWze:hover .ActionTile-module_action-tile-heading__Uxdu9,.ActionTile-module_action-tile--active__-aWze:hover .ActionTile-module_action-tile-icon__PY1EN{color:var(--sem-color-fg-primary-light-minimal)}.LinkTile-module_link-tile__xVUP3{align-items:center;align-self:stretch;background:var(--sem-color-bg-secondary-light-default);border:var(--sem-border-width-xxs) solid var(--sem-color-border-secondary-light-minimal);border-radius:var(--sem-border-radius-xl);box-sizing:border-box;cursor:pointer;display:flex;flex:none;flex-direction:column;height:96px;justify-content:center;overflow:visible;padding:var(--sem-space-padding-110) var(--sem-space-padding-70) var(--sem-space-padding-110) var(--sem-space-padding-110);position:relative;text-decoration:none;transition:border-color .2s ease;width:306px}.LinkTile-module_link-tile-content__H-QN8{align-items:center;align-self:stretch;display:flex;flex:none;flex-direction:row;gap:var(--sem-space-padding-40);height:48px;justify-content:center;width:100%}.LinkTile-module_link-tile-icon__kTMfH{color:var(--sem-color-fg-primary-light-default);display:flex;flex:none;flex-shrink:0;height:32px;order:1;transition:color .2s ease;width:32px}.LinkTile-module_link-tile-text__0K6zf{color:var(--sem-color-fg-primary-light-default);flex:1;font-family:var(--sem-font-family-heading);font-size:var(--sem-font-size-100);font-weight:var(--sem-font-weight-semi);letter-spacing:0;line-height:var(--sem-line-height-base-scale-xs);order:0;transition:color .2s ease}.LinkTile-module_link-tile-icon__kTMfH svg,.LinkTile-module_link-tile__xVUP3 .LinkTile-module_link-tile-content__H-QN8 svg{color:inherit;transition:color .2s ease}.LinkTile-module_link-tile__xVUP3[\:not-has\(svg\)]{padding:var(--sem-space-padding-110)}.LinkTile-module_link-tile__xVUP3:not(:has(svg)){padding:var(--sem-space-padding-110)}.LinkTile-module_link-tile__xVUP3:active{border-radius:var(--sem-border-radius-xl)}@media (min-width:1024px){.LinkTile-module_link-tile__xVUP3{padding:var(--sem-space-padding-110) var(--sem-space-padding-70) var(--sem-space-padding-110) var(--sem-space-padding-110)}}.LinkTile-module_link-tile__xVUP3:hover{border-color:transparent;box-shadow:inset 0 0 0 2px var(--button-v2-colors-light-text-hover)}.LinkTile-module_link-tile__xVUP3:hover .LinkTile-module_link-tile-icon__kTMfH,.LinkTile-module_link-tile__xVUP3:hover .LinkTile-module_link-tile-text__0K6zf{color:var(--button-v2-colors-light-text-hover)}.InlineLinkGroup-module_quick-help__cMTpB{align-items:center;display:flex;flex-direction:column;width:100%}.InlineLinkGroup-module_quick-help__cMTpB li,.InlineLinkGroup-module_quick-help__cMTpB ul{list-style:none;margin:0;padding:0}.InlineLinkGroup-module_quick-help-label__VLKen{align-items:center;display:flex;flex-direction:row;padding-bottom:var(--sem-space-padding-110);width:100%}.InlineLinkGroup-module_quick-help-container__IStTk{align-items:center;display:flex;flex-direction:row;flex-wrap:wrap;gap:var(--sem-space-padding-70);width:100%}.InlineLinkGroup-module_quick-help-item__QTIMl{align-items:center;display:flex;flex:0 0 auto;gap:var(--arc-spacing-4);width:auto}.InlineLinkGroup-module_quick-help-item__QTIMl svg{display:none;height:24px;width:24px}.InlineLinkGroup-module_quick-help-separator__qJE0q{align-items:center;display:flex}.InlineLinkGroup-module_quick-help-separator-line__VbCVI{background:var(--sem-color-border-secondary-light-minimal);height:14px;width:1px}@media not (min-width:636px){.InlineLinkGroup-module_quick-help-container__IStTk{align-items:flex-start;flex-direction:column;gap:var(--sem-space-padding-70)}.InlineLinkGroup-module_quick-help-item__QTIMl svg{display:block}.InlineLinkGroup-module_quick-help-separator__qJE0q{display:none}}.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)}}.VideoCardPlayIcon-module_playIconContainer__ZqZP3{background:var(--sem-color-bg-primary-dark-default);border-radius:var(--sem-border-radius-s);position:relative;transition:background-color .4s ease;z-index:1}.VideoCardPlayIcon-module_playIconContainer--s__ETbOZ{height:44px;position:absolute;right:var(--sem-space-gap-110);top:var(--sem-space-gap-110);width:44px}.VideoCardPlayIcon-module_playIconContainer--l__OGccg{height:64px;width:64px}.VideoCardPlayIcon-module_playIcon__kzito{color:var(--sem-color-fg-secondary-light-default);height:100%;transition:color .4s ease;width:100%}.react-player__preview:hover .VideoCardPlayIcon-module_playIconContainer__ZqZP3{background:var(--sem-color-bg-primary-light-subtle)}.react-player__preview:focus .VideoCardPlayIcon-module_playIconContainer__ZqZP3{background:var(--sem-color-bg-primary-light-default)}.react-player__preview:focus .VideoCardPlayIcon-module_playIcon__kzito,.react-player__preview:hover .VideoCardPlayIcon-module_playIcon__kzito{color:var(--sem-color-fg-primary-dark-default)}.VideoCardPlayer-module_container__G-Uta{border:var(--sem-border-width-xs) solid var(--sem-color-border-secondary-light-subtle);border-radius:var(--sem-border-radius-s);outline:var(--sem-border-width-l) solid transparent;overflow:hidden;transition:outline-color .4s ease,box-shadow .4s ease}.VideoCardPlayer-module_container__G-Uta iframe{border:none;height:100%;width:100%}.VideoCardPlayer-module_container__G-Uta .react-player__preview{position:relative}.VideoCardPlayer-module_player__BgueT{height:100%;width:100%}.VideoCardPlayer-module_playerWrapper__UcH1q{position:relative;width:100%}.VideoCardPlayer-module_playerWrapper--landscape__shKv-{aspect-ratio:16/9}.VideoCardPlayer-module_playerWrapper--portrait__7bKAr{aspect-ratio:9/16}.VideoCardPlayer-module_container__G-Uta[\:has\(\:global\(\.react-player__preview\)\:focus\)]{outline-color:var(--sem-color-border-primary-light-default)}.VideoCardPlayer-module_container__G-Uta:has(.react-player__preview:focus){outline-color:var(--sem-color-border-primary-light-default)}.VideoCardPlayer-module_container__G-Uta[\:has\(\:global\(\.react-player__preview\)\:focus\)],.VideoCardPlayer-module_container__G-Uta[\:has\(\:global\(\.react-player__preview\)\:hover\)]{box-shadow:var(--elevation-05)}.VideoCardPlayer-module_container__G-Uta:has(.react-player__preview:focus),.VideoCardPlayer-module_container__G-Uta:has(.react-player__preview:hover){box-shadow:var(--elevation-05)}@media (--arc-custom-media-min-width-l-px ){.VideoCardPlayer-module_container__G-Uta{border:none}}.VideoCardThumbnail-module_thumbnail__Yamk0{align-items:flex-end;background-size:cover;bottom:0;cursor:pointer;display:flex;left:0;overflow:hidden;position:absolute;right:0;top:0}.VideoCardThumbnail-module_thumbnail__Yamk0:before{bottom:0;content:"";display:block;left:0;position:absolute;right:0;top:0}.VideoCardThumbnail-module_thumbnail--landscape__FmnLk:before{background:linear-gradient(180deg,rgba(42,42,42,0) 0,rgba(42,42,42,.62) 51.92%,var(--sem-color-bg-secondary-light-alt) 100%)}.VideoCardThumbnail-module_thumbnail--portrait__FZS93:before{background:linear-gradient(0deg,var(--sem-color-bg-secondary-light-alt) .01%,rgba(42,42,42,.9) 16.31%,rgba(42,42,42,.81) 26.66%,rgba(42,42,42,0) 100%)}.VideoCardThumbnail-module_thumbnailContent__cHham{padding:var(--sem-space-padding-130);position:relative}.VideoCardThumbnail-module_thumbnail--portrait__FZS93 .VideoCardThumbnail-module_thumbnailContent__cHham{padding:var(--sem-space-padding-110)}@media (min-width:1280px){.VideoCardThumbnail-module_thumbnailContent__cHham{padding:var(--sem-space-padding-160)}}.VideoHeroCardContent-module_mainText--lightBackground__nGl6W{color:var(--sem-color-fg-secondary-dark-alt)}.VideoHeroCardContent-module_statContainer--lightBackground__7hXAf{color:var(--sem-color-fg-secondary-light-default)}.VideoHeroCardContent-module_mainText--darkBackground__Pfizt,.VideoHeroCardContent-module_statContainer--darkBackground__X3-r2{color:var(--sem-color-fg-primary-dark-default)}.VideoHeroCardContent-module_statContainer__q21g9{align-items:flex-start;display:flex;flex-wrap:wrap;gap:var(--sem-space-gap-40)}.VideoHeroCardContent-module_stat__iIcoq{align-items:center;display:flex;gap:var(--sem-space-gap-5);white-space:nowrap}.VideoHeroCardContent-module_stat__iIcoq:not(:last-of-type){padding-right:var(--sem-space-padding-110)}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@arc-ui/community-components",
-  "version": "3.3.0",
+  "version": "3.4.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.5.0",
-    "@arc-ui/themes": "13.5.0",
+    "@arc-ui/components": "13.7.0",
+    "@arc-ui/themes": "13.7.0",
     "react": "^19.2.3",
     "react-dom": "^19.2.3"
   },
@@ -44,15 +44,18 @@
       "optional": true
     }
   },
+  "dependencies": {
+    "react-player": "^3.4.0"
+  },
   "devDependencies": {
-    "@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",
+    "@arc-ui/components": "13.7.0",
+    "@arc-ui/gradients": "13.7.0",
+    "@arc-ui/icons": "13.7.0",
+    "@arc-ui/themes": "13.7.0",
+    "@arc-ui/tokens-arc": "13.7.0",
+    "@arc-ui/tokens-bt-business": "13.7.0",
+    "@arc-ui/tokens-bt-enterprise": "13.7.0",
+    "@arc-ui/tokens-ee": "13.7.0",
     "@rollup/plugin-commonjs": "^28.0.1",
     "@rollup/plugin-node-resolve": "^15.3.0",
     "@rollup/plugin-typescript": "^12.1.1",
@@ -73,11 +76,11 @@
     "stylelint": "^16.10.0",
     "tslib": "^2.8.1",
     "typescript": "^5.6.3",
+    "@arc-ui/community-css-config": "^0.1.1",
     "@arc-ui/community-build-utils": "^0.1.0",
     "@arc-ui/community-eslint-config": "^0.1.1",
-    "@arc-ui/community-css-config": "^0.1.1",
-    "@arc-ui/community-typescript-config": "^0.1.0",
-    "@arc-ui/community-utils": "^0.2.0"
+    "@arc-ui/community-utils": "^0.2.0",
+    "@arc-ui/community-typescript-config": "^0.1.0"
   },
   "browserslist": [
     "defaults",

package/rollup.config.js

@@ -51,7 +51,7 @@ export default [
       }),
       postcss(postcssConfig),
     ],
-    external: ["react", "react-dom"],
+    external: ["react", "react-dom", "react-player"],
   },
   // Bundle dts files
   {

package/src/components/CopyLead/components/MediaContent/MediaContent.tsx

@@ -1,13 +1,14 @@
-import React, { ReactNode } from "react";
+import React from "react";
 
 import {
   Heading as ArcHeading,
   type HeadingLevel,
 } from "@arc-ui/components/Heading";
 
-import { Text } from "@arc-ui/components/Text";
 import { VerticalSpace } from "@arc-ui/components/VerticalSpace";
 
+import { MultiLineText } from "../../../../internal/MultiLineText";
+
 import styles from "../../CopyLead.module.css";
 
 export const MediaContent: React.FC<MediaContentProps> = ({
@@ -15,7 +16,7 @@ export const MediaContent: React.FC<MediaContentProps> = ({
   id,
   headingLevel,
   isHeadingWordWrap,
-  children,
+  content,
 }) => (
   <div className={styles.mediaContainer}>
     <ArcHeading
@@ -27,10 +28,10 @@ export const MediaContent: React.FC<MediaContentProps> = ({
       {heading}
     </ArcHeading>
 
-    {children && (
+    {content && (
       <div className={styles.content}>
         <VerticalSpace size="24" />
-        <Text size="l">{children}</Text>
+        <MultiLineText text={content} size="l" />
       </div>
     )}
   </div>
@@ -41,5 +42,5 @@ interface MediaContentProps {
   id?: string;
   headingLevel?: HeadingLevel;
   isHeadingWordWrap?: boolean;
-  children?: string | ReactNode;
+  content?: string;
 }

package/src/components/CopyLead/templates/Content/Content.tsx

@@ -1,4 +1,4 @@
-import React, { ReactNode } from "react";
+import React from "react";
 
 import { ArcSizeBreakpointsL, ArcSizeBreakpointsM } from "@arc-ui/tokens-arc";
 
@@ -7,6 +7,8 @@ import {
   useMediaQuery,
 } from "@arc-ui/components/use-media-query";
 
+import { MultiLineText } from "../../../../internal/MultiLineText";
+
 import {
   SectionHeading,
   type SectionHeadingProps,
@@ -47,7 +49,7 @@ export const ContentTemplate: React.FC<ContentTemplateProps> = ({
           heading={heading}
           headingLevel={headingLevel}
           isHeadingWordWrap={isHeadingWordWrap}
-          content={content}
+          content={<MultiLineText size="l" text={content} />}
         />
 
         {button && isMinWidthArcBreakpointM && <Button {...button} />}
@@ -66,7 +68,7 @@ export const ContentTemplate: React.FC<ContentTemplateProps> = ({
 };
 
 interface ContentTemplateProps extends SectionHeadingProps {
-  content: string | ReactNode;
+  content: string;
   listItems: CopyLeadListItem[];
   button?: CopyLeadButton;
   headingLevel: HeadingLevel;

package/src/components/CopyLead/templates/Media/Media.tsx

@@ -1,4 +1,4 @@
-import React, { Suspense, useEffect, useState, ReactNode } from "react";
+import React, { Suspense, useEffect, useState } from "react";
 
 import { ArcSizeBreakpointsL, ArcSizeBreakpointsXl } from "@arc-ui/tokens-arc";
 
@@ -66,9 +66,8 @@ export const MediaTemplate: React.FC<MediaTemplateProps> = ({
               headingLevel={headingLevel}
               id={id}
               isHeadingWordWrap={isHeadingWordWrap}
-            >
-              {content}
-            </MediaContent>
+              content={content}
+            />
           </ColumnsCol>
         </Columns>
       )}
@@ -79,7 +78,7 @@ export const MediaTemplate: React.FC<MediaTemplateProps> = ({
       >
         <Column>
           {isMinWidthArcBreakpointXl && (
-            <MediaContent heading={heading}>{content}</MediaContent>
+            <MediaContent heading={heading} content={content} />
           )}
 
           <IconList
@@ -109,7 +108,7 @@ interface MediaTemplateProps {
   id?: string;
   isHeadingWordWrap?: boolean;
   listItems: CopyLeadListItem[];
-  content?: string | ReactNode;
+  content?: string;
   isReverseOrder?: boolean;
   button?: CopyLeadButton;
   image?: CopyLeadImage;

package/src/components/PromoListingThumbnailSignpost/PromoListingThumbnailSignpost.tsx

@@ -22,6 +22,7 @@ export const PromoListingThumbnailSignpost: React.FC<
   content,
   headingLevel,
   thumbnailList,
+  isHeadingWordWrap,
   ...props
 }) => {
   return (
@@ -35,6 +36,7 @@ export const PromoListingThumbnailSignpost: React.FC<
         heading={heading}
         headingLevel={headingLevel}
         content={content}
+        isHeadingWordWrap={isHeadingWordWrap}
       />
       <ul className={styles.list}>
         {thumbnailList.map((thumbnail, index) => (

package/src/components/VideoHeroCard/VideoHeroCard.tsx

@@ -0,0 +1,63 @@
+import React from "react";
+
+import { Visible } from "@arc-ui/components/Visible";
+import { Spacing } from "@arc-ui/components/Spacing";
+
+import {
+  VideoCardPlayer,
+  VideoCardPlayerProps,
+  VideoCardThumbnail,
+} from "../../internal/VideoCardPlayer";
+
+import {
+  VideoHeroCardContent,
+  VideoHeroCardContentProps,
+} from "./components/VideoHeroCardContent";
+
+export const VideoHeroCard = ({
+  content,
+  thumbnailImg,
+  player,
+  ...props
+}: VideoHeroCardProps) => {
+  return (
+    <VideoCardPlayer
+      thumbnail={
+        <VideoCardThumbnail
+          src={thumbnailImg}
+          orientation="landscape"
+          contentVisibility={{ l: true, xl: true, xxl: true }}
+        >
+          <VideoHeroCardContent {...content} background="dark" />
+        </VideoCardThumbnail>
+      }
+      orientation="landscape"
+      playIconSize="l"
+      player={player}
+      {...props}
+    >
+      {content && (
+        <Visible xs s m>
+          <Spacing all={{ xs: "16", s: "32" }}>
+            <VideoHeroCardContent {...content} background="light" />
+          </Spacing>
+        </Visible>
+      )}
+    </VideoCardPlayer>
+  );
+};
+
+export interface VideoHeroCardProps {
+  /**
+   * Content for the video card.
+   */
+  content: Omit<VideoHeroCardContentProps, "background">;
+  /**
+   * Thumbnail for the video hero card.
+   */
+  thumbnailImg: string;
+  /**
+   * Configuration for the video player.
+   */
+  player: VideoCardPlayerProps["player"];
+}

package/src/components/VideoHeroCard/components/VideoHeroCardContent/VideoHeroCardContent.module.css

@@ -0,0 +1,32 @@
+@import url("@arc-ui/tokens-arc/dist/custom-media.css");
+
+.mainText--lightBackground {
+  color: var(--sem-color-fg-secondary-dark-alt);
+}
+
+.statContainer--lightBackground {
+  color: var(--sem-color-fg-secondary-light-default);
+}
+
+.statContainer--darkBackground,
+.mainText--darkBackground {
+  color: var(--sem-color-fg-primary-dark-default);
+}
+
+.statContainer {
+  align-items: flex-start;
+  display: flex;
+  flex-wrap: wrap;
+  gap: var(--sem-space-gap-40);
+}
+
+.stat {
+  align-items: center;
+  display: flex;
+  gap: var(--sem-space-gap-5);
+  white-space: nowrap;
+}
+
+.stat:not(:last-of-type) {
+  padding-right: var(--sem-space-padding-110);
+}

package/src/components/VideoHeroCard/components/VideoHeroCardContent/VideoHeroCardContent.tsx

@@ -0,0 +1,97 @@
+import React, { ReactNode, useId } from "react";
+
+import { BtIconCalendar } from "@arc-ui/icons/BtIconCalendar";
+import { BtIconClock } from "@arc-ui/icons/BtIconClock";
+import { BtIconChatMessage } from "@arc-ui/icons/BtIconChatMessage";
+
+import { Heading } from "@arc-ui/components/Heading";
+import { Icon } from "@arc-ui/components/Icon";
+import { Text } from "@arc-ui/components/Text";
+import { VerticalSpace } from "@arc-ui/components/VerticalSpace";
+
+import styles from "./VideoHeroCardContent.module.css";
+import classNames from "classnames";
+
+export const VideoHeroCardContent = ({
+  title,
+  label,
+  description,
+  videoDate,
+  duration,
+  background,
+  subtitleAvailabilityText,
+}: VideoHeroCardContentProps) => {
+  const id = useId();
+
+  const metaItems: MetaItem[] = [
+    { icon: BtIconCalendar, text: videoDate },
+    { icon: BtIconClock, text: duration },
+    {
+      icon: BtIconChatMessage,
+      text: subtitleAvailabilityText,
+    },
+  ];
+
+  const hasMeta = metaItems.some((meta) => Boolean(meta.text));
+
+  return (
+    <div className={styles[`${background}Background`]}>
+      <div
+        className={classNames(
+          styles.mainText,
+          styles[`mainText--${background}Background`],
+        )}
+      >
+        <Heading fontStyle="overline">{label}</Heading>
+
+        <VerticalSpace size="8" sizeM="4" />
+
+        <Heading level="3" isWordWrap={false} size="xl">
+          {title}
+        </Heading>
+
+        <VerticalSpace size="16" />
+
+        <Text>{description}</Text>
+      </div>
+
+      {hasMeta && (
+        <>
+          <VerticalSpace size="32" sizeS="16" />
+
+          <div
+            className={classNames(
+              styles.statContainer,
+              styles[`statContainer--${background}Background`],
+            )}
+          >
+            {metaItems.map(
+              (meta, i) =>
+                meta.text && (
+                  <div key={`${id}-stat-${i}`} className={styles.stat}>
+                    <Icon icon={meta.icon} size={20} />
+                    <Text size="xs">{meta.text}</Text>
+                  </div>
+                ),
+            )}
+          </div>
+        </>
+      )}
+    </div>
+  );
+};
+
+type MetaItem = {
+  text?: string;
+  icon: string;
+};
+
+export interface VideoHeroCardContentProps {
+  title: string;
+  label: string;
+  description: string | ReactNode;
+  background: "dark" | "light";
+  videoDate?: string;
+  duration?: string;
+  subtitleAvailabilityText?: string;
+}

package/src/components/VideoHeroCard/components/VideoHeroCardContent/index.ts

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

package/src/components/VideoHeroCard/index.ts

@@ -0,0 +1 @@
+export { VideoHeroCard, type VideoHeroCardProps } from "./VideoHeroCard";

package/src/components/VideoPortraitCard/VideoPortraitCard.tsx

@@ -0,0 +1,54 @@
+import React from "react";
+
+import { Heading } from "@arc-ui/components/Heading";
+import { Surface } from "@arc-ui/components/Surface";
+import { VerticalSpace } from "@arc-ui/components/VerticalSpace";
+
+import {
+  VideoCardPlayer,
+  VideoCardPlayerProps,
+  VideoCardThumbnail,
+} from "../../internal/VideoCardPlayer";
+
+export const VideoPortraitCard = ({
+  thumbnail,
+  player,
+  ...props
+}: VideoPortraitCardProps) => {
+  return (
+    <VideoCardPlayer
+      thumbnail={
+        thumbnail && (
+          <VideoCardThumbnail orientation="portrait" src={thumbnail.img}>
+            <Surface isTransparent background="dark-black">
+              <Heading fontStyle="overline">{thumbnail.label}</Heading>
+              <VerticalSpace size="8" />
+              <Heading level="3" isWordWrap={false} size="xs">
+                {thumbnail.title}
+              </Heading>
+            </Surface>
+          </VideoCardThumbnail>
+        )
+      }
+      orientation="portrait"
+      player={player}
+      playIconSize="s"
+      {...props}
+    />
+  );
+};
+
+export interface VideoPortraitCardProps {
+  /**
+   * Thumbnail content, video will autoplay if omitted.
+   */
+  thumbnail?: {
+    title: string;
+    label: string;
+    img: string;
+  };
+  /**
+   * Configuration for the video player.
+   */
+  player: VideoCardPlayerProps["player"];
+}

package/src/components/VideoPortraitCard/index.ts

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

package/src/components/index.ts

@@ -19,3 +19,5 @@ export * from "./LinkTile";
 export * from "./InlineLinkGroup";
 export * from "./ThumbnailSignpost";
 export * from "./PromoListingThumbnailSignpost";
+export * from "./VideoHeroCard";
+export * from "./VideoPortraitCard";

package/src/internal/MultiLineText/MultiLineText.tsx

@@ -0,0 +1,25 @@
+import React from "react";
+
+import { Text, TextProps } from "@arc-ui/components/Text";
+import { VerticalSpace } from "@arc-ui/components/VerticalSpace";
+
+export const MultiLineText = ({ text, ...textProps }: MultiLineTextProps) => {
+  if (!text) return null;
+
+  const paragraphs = text.split(/\\n|\n/).filter((p) => p.trim());
+
+  return (
+    <>
+      {paragraphs.map((paragraph, index) => (
+        <span key={`informationcard-text-${index}`}>
+          {index > 0 && <VerticalSpace size="8" />}
+          <Text {...textProps}>{paragraph}</Text>
+        </span>
+      ))}
+    </>
+  );
+};
+
+interface MultiLineTextProps extends Partial<TextProps> {
+  text?: string;
+}

package/src/internal/MultiLineText/index.ts

@@ -0,0 +1 @@
+export { MultiLineText } from "./MultiLineText";