@oiz/stzh-components 4.5.0 → 4.6.0-beta1

package/dist/components/stzh-pagebottom.js

@@ -1,11 +1,11 @@
 import { p as proxyCustomElement, H, h, d as Host } from './p-8f01554b.js';
-import { d as defineCustomElement$8 } from './p-17efbc57.js';
-import { d as defineCustomElement$7 } from './p-e42121d1.js';
-import { d as defineCustomElement$6 } from './p-5a8587ab.js';
-import { d as defineCustomElement$5 } from './p-c418c5d3.js';
-import { d as defineCustomElement$4 } from './p-52037fe2.js';
-import { d as defineCustomElement$3 } from './p-9a31aa56.js';
-import { d as defineCustomElement$2 } from './p-1449a24c.js';
+import { d as defineCustomElement$8 } from './p-dd1c0c0c.js';
+import { d as defineCustomElement$7 } from './p-4a78990f.js';
+import { d as defineCustomElement$6 } from './p-7c4e756c.js';
+import { d as defineCustomElement$5 } from './p-15ee297d.js';
+import { d as defineCustomElement$4 } from './p-5b94ed4e.js';
+import { d as defineCustomElement$3 } from './p-63c4d8c4.js';
+import { d as defineCustomElement$2 } from './p-613937f1.js';
 
 const stzhPagebottomCss = ".sc-stzh-pagebottom-h{font-family:var(--stzh-font-family-medium);font-weight:var(--stzh-font-weight-medium);font-style:var(--stzh-font-style-medium);color:var(--stzh-base-color);box-sizing:border-box;display:block}[hidden].sc-stzh-pagebottom-h,[stzh-hidden].sc-stzh-pagebottom-h{display:none}.sc-stzh-pagebottom-h::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-pagebottom-h *.sc-stzh-pagebottom,.sc-stzh-pagebottom-h *.sc-stzh-pagebottom::before,.sc-stzh-pagebottom-h *.sc-stzh-pagebottom::after{box-sizing:border-box;text-underline-offset:var(--stzh-link-text-underline-offset);text-decoration-thickness:var(--stzh-link-text-decoration-thickness);-webkit-text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink);text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink)}.sc-stzh-pagebottom-h .has-focus.sc-stzh-pagebottom{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}.sc-stzh-pagebottom-h .stzh-fylingfocus-focused.sc-stzh-pagebottom{outline-style:none !important}.sc-stzh-pagebottom-h .stzh-fylingfocus-focused.sc-stzh-pagebottom::-moz-focus-inner{border:0 !important}@media print{.sc-stzh-pagebottom-h{display:none}}.stzh-pagebottom__wrapper.sc-stzh-pagebottom{display:grid}.stzh-pagebottom__left.sc-stzh-pagebottom{display:flex;flex-direction:column;flex-wrap:wrap;row-gap:var(--stzh-space-xsmall)}@media screen and (min-width: 600px){.stzh-pagebottom__left.sc-stzh-pagebottom{flex-direction:row}}.stzh-pagebottom__share-title.sc-stzh-pagebottom{font-size:var(--stzh-font-curve-caption-default-font-size, var(--stzh-font-nano-font-size));line-height:var(--stzh-font-curve-caption-default-text-line-height, var(--stzh-font-nano-text-line-height));margin-bottom:var(--stzh-space-small)}@media screen and (min-width: 900px){.stzh-pagebottom__share-title.sc-stzh-pagebottom{font-size:var(--stzh-font-curve-caption-medium-font-size, var(--stzh-font-micro-font-size));line-height:var(--stzh-font-curve-caption-medium-text-line-height, var(--stzh-font-micro-text-line-height))}}.stzh-pagebottom__sticky-actions.sc-stzh-pagebottom{margin-left:auto;margin-top:var(--stzh-space-medium);--stzh-button-white-space:nowrap}@media screen and (min-width: 600px){.stzh-pagebottom__sticky-actions.sc-stzh-pagebottom{margin-top:0}}.stzh-pagebottom__print.sc-stzh-pagebottom,.stzh-pagebottom__share-wrapper.sc-stzh-pagebottom{flex-shrink:0}.stzh-pagebottom__share-wrapper.sc-stzh-pagebottom{margin-left:-0.625rem}@media screen and (min-width: 900px){.stzh-pagebottom__share-wrapper.sc-stzh-pagebottom{margin-left:0}}@media screen and (min-width: 600px){.stzh-pagebottom__print.sc-stzh-pagebottom{margin-right:var(--stzh-space-xxlarge)}}@media screen and (min-width: 900px){.stzh-pagebottom__print.sc-stzh-pagebottom{margin-right:var(--stzh-space-xxlarge)}}@media screen and (min-width: 900px) and (min-width: 600px){.stzh-pagebottom__print.sc-stzh-pagebottom{margin-right:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 900px) and (min-width: 900px){.stzh-pagebottom__print.sc-stzh-pagebottom{margin-right:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 900px) and (min-width: 1260px){.stzh-pagebottom__print.sc-stzh-pagebottom{margin-right:var(--stzh-space-xbig)}}.stzh-pagebottom.sc-stzh-pagebottom:has(.stzh-pagebottom__sticky-actions:not(:empty)) .stzh-pagebottom__wrapper.sc-stzh-pagebottom{grid-template-columns:auto}@media screen and (min-width: 600px){.stzh-pagebottom.sc-stzh-pagebottom:has(.stzh-pagebottom__sticky-actions:not(:empty)) .stzh-pagebottom__wrapper.sc-stzh-pagebottom{grid-template-columns:minmax(0, 1fr) calc(\n          6.875rem + 2.75rem + var(--stzh-space-small) + var(--stzh-space-medium)\n        )}}";
 const StzhPagebottomStyle0 = stzhPagebottomCss;
@@ -37,7 +37,7 @@ const StzhPagebottom$1 = /*@__PURE__*/ proxyCustomElement(class StzhPagebottom e
             "stzh-pagebottom": true,
             rs_skip: true, // will prevent component being read by readspeaker
         };
-        return (h(Host, { key: '86b219e13a6c85c70e372c828e974bdc65e46008' }, h("div", { key: '20bba21d493d56f2eb5a7939bf3caabbb4dbf32f', class: classes }, h("div", { key: 'e81fc4ef130048b7622c84d079b078a12ef130b5', class: "stzh-pagebottom__wrapper" }, h("div", { key: '9187966337d643df6040607705cbd70555205a15', class: "stzh-pagebottom__left" }, this.withPrint && (h("div", { key: '937f70cb75fc59de9d7d057f4694efd2a0fdc8ce', class: "stzh-pagebottom__print" }, h("stzh-print", { key: '31357b288e32c8948844ba7826641937904bac28' }, h("stzh-button", { key: 'b5077a2e0d80c9423e4a121076313ed9c1672c0b', label: this.localization.printLabel, variant: "tertiary-plain", size: "small", noPaddingLeft: true, noPaddingRight: true, analyticsId: this.printAnalyticsId })))), !this.shareDisabled && (h("div", { key: '9e2fef4459e773003ec4ac3493cf9b9905b4c3a4', class: "stzh-pagebottom__share-wrapper" }, this.shareTitle && h("div", { key: 'eb8d45284496f544c25b900cc77ce1ac204ea719', class: "stzh-pagebottom__share-title" }, this.shareTitle), h("stzh-share", { key: '97d0740070666ef7b6843220e562cdf78ecccff0', url: this.shareUrl, services: this.shareServices, mailSubject: this.shareMailSubject, mailBody: this.shareMailBody })))), h("div", { key: '5266eb1985d2c8574ca59a9365f971ac877b9f6c', class: "stzh-pagebottom__sticky-actions" }, h("slot", { key: '6c5455890be560cac1382688757fe5f9d21dc073', name: "sticky-actions" }))))));
+        return (h(Host, { key: '39fc15c82ea7a0342ae22995c955fb1aa335cf2f' }, h("div", { key: '3a98fdfddf3a7c8ec913e8d043abb3317960a613', class: classes }, h("div", { key: '7d0b419eb9e3c52033f23036acf768676dcbf7d4', class: "stzh-pagebottom__wrapper" }, h("div", { key: '0e226f0e488f5d47777db162f07642343451e051', class: "stzh-pagebottom__left" }, this.withPrint && (h("div", { key: '59d325ef57c910eed0e4d445859a9bb1c5f00b50', class: "stzh-pagebottom__print" }, h("stzh-print", { key: '0b91e400063e68a8a5693801f425cca292daee59' }, h("stzh-button", { key: 'e7318c4b8436589b7a465da53b36a9ba3a9dbc6b', label: this.localization.printLabel, variant: "tertiary-plain", size: "small", noPaddingLeft: true, noPaddingRight: true, analyticsId: this.printAnalyticsId })))), !this.shareDisabled && (h("div", { key: '62743d682cc6bbb1c1a29abb3d8d045379ff5a7e', class: "stzh-pagebottom__share-wrapper" }, this.shareTitle && h("div", { key: '0d02e2741d7ff6733cd66cce07f89a0c21c50d2f', class: "stzh-pagebottom__share-title" }, this.shareTitle), h("stzh-share", { key: '71fe83be58ab15c8cc2140290b2d734a1a6c8431', url: this.shareUrl, services: this.shareServices, mailSubject: this.shareMailSubject, mailBody: this.shareMailBody })))), h("div", { key: 'ddd86749013107816d852a7bb9ef6ef06f80f5f4', class: "stzh-pagebottom__sticky-actions" }, h("slot", { key: 'cd63c9c294c612119748bb25668ef1867354e21b', name: "sticky-actions" }))))));
     }
     get element() { return this; }
     static get style() { return StzhPagebottomStyle0; }

package/dist/components/stzh-pagecontent.js

@@ -17,7 +17,7 @@ const StzhPagecontent$1 = /*@__PURE__*/ proxyCustomElement(class StzhPagecontent
             "stzh-pagecontent--has-aside-left": hasAsideLeft || hasAnchornav,
             "stzh-pagecontent--has-no-aside-left": !hasAsideLeft && !hasAnchornav,
         };
-        return (h(Host, { key: '4d9f85a23cdf707919faf0ca310094e998d9eab3' }, h("div", { key: '229b94d83ac0b07aff14a0c4c8aaecc73bbfbeb1', class: classes }, h("aside", { key: '44b74f2b05773a3fc24366a1d2a4f032b90f111c', class: "stzh-pagecontent__aside-left" }, h("div", { key: 'eca1e7294926c27c021d03cad273a9b3c2962b0d', class: "stzh-pagecontent__anchornav" }, h("slot", { key: 'afa16547566f035323f9032282303585bb2a7fb4', name: "anchornav" })), h("slot", { key: '8b1ac4b7aa2cfe6baf02538bfef73f163c958030', name: "aside-left" })), h("div", { key: '14703cd1bf2a490371046412586ba863ade146c9', class: "stzh-pagecontent__content" }, h("slot", { key: '12ffb5f3807742bbbddd7e70ba94a44e9db91799' })))));
+        return (h(Host, { key: 'e96ce1bc99f2ab5f8f282aec53deaf2908e1f8ba' }, h("div", { key: 'c9a7ca33dbe6a590722a540b9d2bb409fae365ab', class: classes }, h("aside", { key: '1d4f570f023aca62eb5e234261c2184082b66386', class: "stzh-pagecontent__aside-left" }, h("div", { key: 'c7cdda306b9302cb783afa8e065c1f22d1048861', class: "stzh-pagecontent__anchornav" }, h("slot", { key: '9a8c8304c851198acd84f22563a8df02ead9602a', name: "anchornav" })), h("slot", { key: '339ba37df14dacf411362086b38d147e10128047', name: "aside-left" })), h("div", { key: 'a28547b90c50f3149b9725f2129cc791f817f390', class: "stzh-pagecontent__content" }, h("slot", { key: 'deb6bbd7edd0f4749c710ba80a2d4706b8bec795' })))));
     }
     get element() { return this; }
     static get style() { return StzhPagecontentStyle0; }

package/dist/components/stzh-pagetitle-hero.js

@@ -90,7 +90,7 @@ const StzhPagetitleHero$1 = /*@__PURE__*/ proxyCustomElement(class StzhPagetitle
             "stzh-pagetitle-hero--has-no-lead": !leadSlotUsed,
             "stzh-pagetitle-hero--has-back-link": backLinkSlotUsed,
         };
-        return (h(Host, { key: '4092fdf29e81da467a01ce14169ef0a236fa1e81' }, h("div", { key: 'a3a5fa6f25707cfc669ebc2068c7659b2ede3a75', class: classes }, h("div", { key: '44705be15cd02e32cd63089fec428ca89f274c4e', class: "stzh-pagetitle-hero__header" }, h("div", { key: '3368ece2fcb33a65b43ef1d69cac47bfabacd7a6', class: "stzh-pagetitle-hero__back-link" }, h("slot", { key: 'e9a10e3a4ea5f63929e4a5b1a36f5d1a70c00744', name: "back-link" })), h("div", { key: 'c469457f5348d0fbaa824bf440078320e8a32596', class: "stzh-pagetitle-hero__image-wrapper" }, h("div", { key: 'fc53ef3d0dcfde0d119e7027b4d9188b900c751c', class: "stzh-pagetitle-hero__image-ratio" }), h("slot", { key: '9ae6ec6a9935a3aa4ffd8053c18664067d6680cb', name: "image" })), h("div", { key: '0f0f8af4c8f2112e2e6c3b93e21271e827366052', class: "stzh-pagetitle-hero__title-wrapper" }, h("div", { key: '58645c0a1a06a5989dcbcceecff1257bf9f014ff', class: "stzh-pagetitle-hero__tags", role: "list" }, h("slot", { key: '4c6eee91b82a84e6aebbf47bd7579a0ed38aac14', name: "tag" })), h("div", { key: '41d1ef58eab92d23dd56280f366372e1f314ad9d', class: "stzh-pagetitle-hero__title-parent" }, h("h1", { key: '08158f41da5669da5cee4d65f66022220f7c7304', ref: el => (this.mainTitleElement = el), class: "stzh-pagetitle-hero__title", id: this.headingId, innerHTML: this.heading })), this.subtitle && h("div", { key: 'fcc6c8049f43836f7ed054225c0f32c50161c19c', class: "stzh-pagetitle-hero__subtitle" }, this.subtitle))), h("div", { key: '281ce8413afb63bd550af21b02eeed4337c979f9', class: "stzh-pagetitle-hero__lead" }, h("slot", { key: '992301a3e044847bc796daa82ffe749c2e9055d0', name: "lead" }), h("div", { key: 'ffb40b5bf0fc473a8b1c3acdd9fe10c699fd5063', class: "stzh-pagetitle-hero__lead-author" }, this.leadAuthor)))));
+        return (h(Host, { key: '1657d8a33fc183979dae782a391de0615dfbc4ea' }, h("div", { key: '801b6d1369e98f67c208b0be3fa45c1a176e39d6', class: classes }, h("div", { key: '935eac6988b56b44cfec10230c8bf18bf8ab1e31', class: "stzh-pagetitle-hero__header" }, h("div", { key: '5848e215afaaf040201ed738b39aab2a6f07062c', class: "stzh-pagetitle-hero__back-link" }, h("slot", { key: '24b64fc4a9a4b29ea6b39f08ca702b7809f1e7d5', name: "back-link" })), h("div", { key: '0ddaa2d333f1caeea92c72c5cebd45d0a3b018a2', class: "stzh-pagetitle-hero__image-wrapper" }, h("div", { key: '2b1400b3453a9a095b97ea3fe98a235d19cd5438', class: "stzh-pagetitle-hero__image-ratio" }), h("slot", { key: 'e183ea5dc1b2a58ac728e2cf53a722178134b666', name: "image" })), h("div", { key: '4cc1a4ae81ed787411bc61dcac181be4d6964cd9', class: "stzh-pagetitle-hero__title-wrapper" }, h("div", { key: 'b6a3bb60c5fdac396380bdcec66371bdd832d69b', class: "stzh-pagetitle-hero__tags", role: "list" }, h("slot", { key: '7006bdba82027e8c87e5284599be85b2ea9eeee9', name: "tag" })), h("div", { key: 'ed97596a9d6efe5efcbae587205abeeaf1250741', class: "stzh-pagetitle-hero__title-parent" }, h("h1", { key: 'ae7f0e566032dc884cde9cfd0952f6604e390fe9', ref: el => (this.mainTitleElement = el), class: "stzh-pagetitle-hero__title", id: this.headingId, innerHTML: this.heading })), this.subtitle && h("div", { key: '79de06597cdd88a0dc71551293a4a42efbe0a68e', class: "stzh-pagetitle-hero__subtitle" }, this.subtitle))), h("div", { key: '964ca1ab5ab1605759fbcc8a7a7267f70d570a16', class: "stzh-pagetitle-hero__lead" }, h("slot", { key: '669bb2abe3cd5afafe31047ae0642c7ea7f6b33c', name: "lead" }), h("div", { key: '67404442468b2d4a599409fa43271068e958b55f', class: "stzh-pagetitle-hero__lead-author" }, this.leadAuthor)))));
     }
     get element() { return this; }
     static get style() { return StzhPagetitleHeroStyle0; }

package/dist/components/stzh-pagetitle-home.js

@@ -1,7 +1,7 @@
 import { p as proxyCustomElement, H, h, d as Host } from './p-8f01554b.js';
 import { g as getTheme, s as setPropsIfNull, h as hasSlot } from './p-289f5de2.js';
 import { m as media, a as addMediaChangeListener, r as removeMediaChangeListener } from './p-f4adb3cd.js';
-import { d as defineCustomElement$2 } from './p-527121ef.js';
+import { d as defineCustomElement$2 } from './p-36fb6c94.js';
 
 const stzhPagetitleHomeCss = ".sc-stzh-pagetitle-home-h{font-family:var(--stzh-font-family-medium);font-weight:var(--stzh-font-weight-medium);font-style:var(--stzh-font-style-medium);color:var(--stzh-base-color);box-sizing:border-box;display:block}[hidden].sc-stzh-pagetitle-home-h,[stzh-hidden].sc-stzh-pagetitle-home-h{display:none}.sc-stzh-pagetitle-home-h::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-pagetitle-home-h *.sc-stzh-pagetitle-home,.sc-stzh-pagetitle-home-h *.sc-stzh-pagetitle-home::before,.sc-stzh-pagetitle-home-h *.sc-stzh-pagetitle-home::after{box-sizing:border-box;text-underline-offset:var(--stzh-link-text-underline-offset);text-decoration-thickness:var(--stzh-link-text-decoration-thickness);-webkit-text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink);text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink)}.sc-stzh-pagetitle-home-h .has-focus.sc-stzh-pagetitle-home{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}.sc-stzh-pagetitle-home-h .stzh-fylingfocus-focused.sc-stzh-pagetitle-home{outline-style:none !important}.sc-stzh-pagetitle-home-h .stzh-fylingfocus-focused.sc-stzh-pagetitle-home::-moz-focus-inner{border:0 !important}.sc-stzh-pagetitle-home-h.sc-stzh-pagetitle-home-s>[slot=image],.sc-stzh-pagetitle-home-h .sc-stzh-pagetitle-home-s>[slot=image]{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.sc-stzh-pagetitle-home-h.sc-stzh-pagetitle-home-s>[slot=heading],.sc-stzh-pagetitle-home-h .sc-stzh-pagetitle-home-s>[slot=heading]{--color:var(--stzh-pagetitle-home-heading-color, var(--stzh-color-secondary50))}.sc-stzh-pagetitle-home-h.sc-stzh-pagetitle-home-s>[slot=subheading],.sc-stzh-pagetitle-home-h .sc-stzh-pagetitle-home-s>[slot=subheading]{--color:var(--stzh-pagetitle-home-heading-color, var(--stzh-heading-color))}.sc-stzh-pagetitle-home-h.sc-stzh-pagetitle-home-s>[slot=readspeaker] *,.sc-stzh-pagetitle-home-h .sc-stzh-pagetitle-home-s>[slot=readspeaker] *{--color:var(--stzh-pagetitle-home-readspeaker-color, var(--stzh-heading-color));--hover-color:var(\n    --stzh-pagetitle-home-readspeaker-color,\n    var(--stzh-heading-color)\n  )}.sc-stzh-pagetitle-home-h[has-image].sc-stzh-pagetitle-home-s>[slot=readspeaker] *,.sc-stzh-pagetitle-home-h[has-image] .sc-stzh-pagetitle-home-s>[slot=readspeaker] *{--color:var(--stzh-pagetitle-home-readspeaker-color, var(--stzh-color-white));--hover-color:var(--stzh-pagetitle-home-readspeaker-color, var(--stzh-color-white))}.sc-stzh-pagetitle-home-h[has-image].sc-stzh-pagetitle-home-s>[slot=heading],.sc-stzh-pagetitle-home-h[has-image] .sc-stzh-pagetitle-home-s>[slot=heading]{--color:var(--stzh-pagetitle-home-heading-color, var(--stzh-color-lemonyellow50))}.sc-stzh-pagetitle-home-h[has-image].sc-stzh-pagetitle-home-s>[slot=subheading],.sc-stzh-pagetitle-home-h[has-image] .sc-stzh-pagetitle-home-s>[slot=subheading]{--color:var(--stzh-pagetitle-home-subheading-color, var(--stzh-color-white))}.stzh-pagetitle-home.sc-stzh-pagetitle-home{position:relative;padding-bottom:var(--stzh-space-xxlarge)}@media screen and (min-width: 900px){.stzh-pagetitle-home.sc-stzh-pagetitle-home{padding-bottom:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 1260px){.stzh-pagetitle-home.sc-stzh-pagetitle-home{padding-bottom:var(--stzh-space-xxxxlarge)}}.stzh-pagetitle-home__container.sc-stzh-pagetitle-home{margin-left:1.25rem;margin-right:1.25rem}@media screen and (min-width: 600px){.stzh-pagetitle-home__container.sc-stzh-pagetitle-home{margin-left:2rem;margin-right:2rem}}@media screen and (min-width: 900px){.stzh-pagetitle-home__container.sc-stzh-pagetitle-home{margin-left:2.5rem;margin-right:2.5rem}}@media screen and (min-width: 1260px){.stzh-pagetitle-home__container.sc-stzh-pagetitle-home{margin-left:4rem;margin-right:4rem}}@media screen and (min-width: 1600px){.stzh-pagetitle-home__container.sc-stzh-pagetitle-home{margin-left:auto;margin-right:auto;max-width:84.25rem}}.stzh-pagetitle-home__text.sc-stzh-pagetitle-home{padding-top:var(--stzh-space-xxlarge);padding-bottom:var(--stzh-space-xxlarge);column-gap:var(--stzh-grid-gutter);display:grid;grid-template-columns:repeat(4, minmax(0, 1fr))}@media screen and (min-width: 600px){.stzh-pagetitle-home__text.sc-stzh-pagetitle-home{padding-top:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 900px){.stzh-pagetitle-home__text.sc-stzh-pagetitle-home{padding-top:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 1260px){.stzh-pagetitle-home__text.sc-stzh-pagetitle-home{padding-top:var(--stzh-space-xbig)}}@media screen and (min-width: 600px){.stzh-pagetitle-home__text.sc-stzh-pagetitle-home{padding-bottom:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 900px){.stzh-pagetitle-home__text.sc-stzh-pagetitle-home{padding-bottom:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 1260px){.stzh-pagetitle-home__text.sc-stzh-pagetitle-home{padding-bottom:var(--stzh-space-xbig)}}@media screen and (min-width: 600px){.stzh-pagetitle-home__text.sc-stzh-pagetitle-home{column-gap:var(--stzh-grid-gutter-small)}}@media screen and (min-width: 900px){.stzh-pagetitle-home__text.sc-stzh-pagetitle-home{column-gap:var(--stzh-grid-gutter-medium)}}@media screen and (min-width: 1260px){.stzh-pagetitle-home__text.sc-stzh-pagetitle-home{column-gap:var(--stzh-grid-gutter-large)}}@media screen and (min-width: 1600px){.stzh-pagetitle-home__text.sc-stzh-pagetitle-home{column-gap:var(--stzh-grid-gutter-ultra)}}@media screen and (min-width: 900px){.stzh-pagetitle-home__text.sc-stzh-pagetitle-home{grid-template-columns:repeat(8, minmax(0, 1fr))}}@media screen and (min-width: 1260px){.stzh-pagetitle-home__text.sc-stzh-pagetitle-home{grid-template-columns:repeat(12, minmax(0, 1fr))}}.stzh-pagetitle-home__image-wrapper.sc-stzh-pagetitle-home{position:relative}.stzh-pagetitle-home__image-inner-wrapper.sc-stzh-pagetitle-home{position:absolute;inset:0;height:100%;margin-left:calc(1.25rem / -1);margin-right:calc(1.25rem / -1)}@media screen and (min-width: 600px){.stzh-pagetitle-home__image-inner-wrapper.sc-stzh-pagetitle-home{margin-left:calc(2rem / -1);margin-right:calc(2rem / -1)}}@media screen and (min-width: 900px){.stzh-pagetitle-home__image-inner-wrapper.sc-stzh-pagetitle-home{margin-left:0;margin-right:0;width:calc(100% + 2.5rem)}}@media screen and (min-width: 1260px){.stzh-pagetitle-home__image-inner-wrapper.sc-stzh-pagetitle-home{width:calc(100% + 4rem)}}@media screen and (min-width: 1600px){.stzh-pagetitle-home__image-inner-wrapper.sc-stzh-pagetitle-home{width:calc(100% + (100rem - 84.25rem) / 2)}}.stzh-pagetitle-home__image-gradient.sc-stzh-pagetitle-home{position:absolute;background:linear-gradient(1.21deg, rgba(0, 0, 0, 0) 31.71%, rgba(0, 0, 0, 0.5) 83.84%);top:0;right:0;bottom:0;left:0;z-index:1}@media screen and (min-width: 600px){.stzh-pagetitle-home__image-gradient.sc-stzh-pagetitle-home{background:linear-gradient(270deg, rgba(0, 0, 0, 0) 31.21%, rgba(0, 0, 0, 0.5) 91.45%)}}@media screen and (min-width: 1600px){.stzh-pagetitle-home__image-gradient.sc-stzh-pagetitle-home{left:calc((100vw - 84.25rem) / 2)}.stzh-pagetitle-home__image-gradient.sc-stzh-pagetitle-home:before{content:\"\";position:absolute;background:rgba(0, 0, 0, 0.5);top:0;right:calc(\n          (100vw - 84.25rem) / 2 +\n            84.25rem - var(--stzh-scrollbar-width, 0px)\n        );bottom:0;left:calc((100vw - 84.25rem) / 2 * -1 - var(--stzh-scrollbar-width, 0px));z-index:1}}.stzh-pagetitle-home__meta.sc-stzh-pagetitle-home{display:flex;flex-direction:column-reverse;row-gap:var(--stzh-space-xsmall);margin-bottom:var(--stzh-space-medium)}@media screen and (min-width: 600px){.stzh-pagetitle-home__meta.sc-stzh-pagetitle-home{margin-bottom:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-pagetitle-home__meta.sc-stzh-pagetitle-home{margin-bottom:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-pagetitle-home__meta.sc-stzh-pagetitle-home{margin-bottom:var(--stzh-space-xxlarge)}}@media screen and (min-width: 900px){.stzh-pagetitle-home__meta.sc-stzh-pagetitle-home{flex-direction:row}}@media screen and (min-width: 600px) and (max-width: 899px){.stzh-pagetitle-home__readspeaker.sc-stzh-pagetitle-home{--stzh-readspeaker-dropdown-position:relative;--stzh-readspeaker-dropdown-top:auto}}.stzh-pagetitle-home__subheading.sc-stzh-pagetitle-home{--stzh-base-lead-color:var(--stzh-heading-color)}.stzh-pagetitle-home__heading.sc-stzh-pagetitle-home:not(:empty)+.stzh-pagetitle-home__subheading.sc-stzh-pagetitle-home:not(:empty){margin-top:var(--stzh-space-xxsmall)}@media screen and (min-width: 900px){.stzh-pagetitle-home__heading.sc-stzh-pagetitle-home:not(:empty)+.stzh-pagetitle-home__subheading.sc-stzh-pagetitle-home:not(:empty){margin-top:var(--stzh-space-xsmall)}}@media screen and (min-width: 1260px){.stzh-pagetitle-home__heading.sc-stzh-pagetitle-home:not(:empty)+.stzh-pagetitle-home__subheading.sc-stzh-pagetitle-home:not(:empty){margin-top:var(--stzh-space-small)}}.stzh-pagetitle-home__heading.sc-stzh-pagetitle-home,.stzh-pagetitle-home__subheading.sc-stzh-pagetitle-home,.stzh-pagetitle-home__meta.sc-stzh-pagetitle-home{grid-column:1/span 4}@media screen and (min-width: 900px){.stzh-pagetitle-home__heading.sc-stzh-pagetitle-home,.stzh-pagetitle-home__subheading.sc-stzh-pagetitle-home,.stzh-pagetitle-home__meta.sc-stzh-pagetitle-home{grid-column:1/span 10}}.stzh-pagetitle-home__ratio.sc-stzh-pagetitle-home{--max-height:42.5rem;--overflow:hidden}.stzh-pagetitle-home--has-no-image.sc-stzh-pagetitle-home .stzh-pagetitle-home__ratio.sc-stzh-pagetitle-home{display:none}.stzh-pagetitle-home--has-no-image.sc-stzh-pagetitle-home .stzh-pagetitle-home__text.sc-stzh-pagetitle-home{padding-top:var(--stzh-space-medium)}@media screen and (min-width: 600px){.stzh-pagetitle-home--has-no-image.sc-stzh-pagetitle-home .stzh-pagetitle-home__text.sc-stzh-pagetitle-home{padding-top:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-pagetitle-home--has-no-image.sc-stzh-pagetitle-home .stzh-pagetitle-home__text.sc-stzh-pagetitle-home{padding-top:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-pagetitle-home--has-no-image.sc-stzh-pagetitle-home .stzh-pagetitle-home__text.sc-stzh-pagetitle-home{padding-top:var(--stzh-space-xxlarge)}}.stzh-pagetitle-home--has-image.sc-stzh-pagetitle-home{padding-bottom:0}.stzh-pagetitle-home--has-image.sc-stzh-pagetitle-home .stzh-pagetitle-home__container.sc-stzh-pagetitle-home{position:absolute;top:0;right:0;left:0;z-index:1}.stzh-pagetitle-home--has-image.sc-stzh-pagetitle-home .stzh-pagetitle-home__text.sc-stzh-pagetitle-home{padding-top:var(--stzh-space-xxlarge)}@media screen and (min-width: 900px){.stzh-pagetitle-home--has-image.sc-stzh-pagetitle-home .stzh-pagetitle-home__text.sc-stzh-pagetitle-home{padding-top:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 1260px){.stzh-pagetitle-home--has-image.sc-stzh-pagetitle-home .stzh-pagetitle-home__text.sc-stzh-pagetitle-home{padding-top:var(--stzh-space-xxxxlarge)}}.stzh-pagetitle-home--hyphens.sc-stzh-pagetitle-home .stzh-pagetitle-home__heading.sc-stzh-pagetitle-home{hyphens:auto}";
 const StzhPagetitleHomeStyle0 = stzhPagetitleHomeCss;
@@ -74,7 +74,7 @@ const StzhPagetitleHome$1 = /*@__PURE__*/ proxyCustomElement(class StzhPagetitle
             "stzh-pagetitle-home--hyphens": this.hyphensEnabled,
             "stzh-pagetitle-home--has-meta": readspeakerSlotUsed,
         };
-        return (h(Host, { key: 'b638d153bcfb7b4fe87b87b29d7320583775bd46', "has-image": imageSlotUsed }, h("div", { key: '68999d5a6d6ec3470b2d7b90fa7240fb101f8972', class: classes }, h("div", { key: '01da18fe59c497bd145f9d6db14334fc518f9063', class: "stzh-pagetitle-home__image-wrapper" }, h("stzh-ratio", { key: '058edc2961c2f6f186711bdb0904d1998eb0e990', ratio: "1:1", ratioSmall: "16:9", ratioMedium: "2:1", ratioLarge: "21:9", class: "stzh-pagetitle-home__ratio" }), h("div", { key: '925bbfc859262fd6d2ff3ab2130d1e3d82f85b44', class: "stzh-pagetitle-home__image-gradient" }), h("div", { key: '6b26d4baaa957d85f8ff20d62380a18734fbbc6a', class: "stzh-pagetitle-home__image-inner-wrapper" }, h("slot", { key: '70101199a9e82da6a40dd921a7d961f82b1eb764', name: "image" }))), h("div", { key: 'b0110b6de4093b9f62993ccbf3fcea7adbaf23d9', class: "stzh-pagetitle-home__container" }, h("div", { key: '13050ea6e6d918ef44cf8a9aa7168d9b5619cace', class: "stzh-pagetitle-home__wrapper" }, h("div", { key: 'c324c43fe755b7716d11b1734304656c464f2f50', class: "stzh-pagetitle-home__text" }, h("div", { key: '8368115a3c0629aec8ba5b427aac8fe1b11de5da', class: "stzh-pagetitle-home__meta" }, h("div", { key: 'b03e94e3011103f27a3344e08d0889b2a8f3beba', class: "stzh-pagetitle-home__readspeaker" }, h("slot", { key: '693a60c6dab6698c2ff8c526e8635c2c7b69d371', name: "readspeaker" }))), h("div", { key: 'a4b9dcf0f9f62b21d5077cb070baeefe98a79613', class: "stzh-pagetitle-home__heading" }, h("slot", { key: '42b95509e25a8496ebb19f6e20d48526dc981a41', name: "heading" })), h("div", { key: '9f115338a44493e71aab896f8610962e139cda0e', class: "stzh-pagetitle-home__subheading" }, h("slot", { key: '298604d1fce9000561b0aeac82fa13e84700821f', name: "subheading" }))))))));
+        return (h(Host, { key: '411e43b873355f6833302d3f5c4634656d07674f', "has-image": imageSlotUsed }, h("div", { key: '9ad919e56bffd1e94aae92ef51f9c1fe3b6f9baf', class: classes }, h("div", { key: 'f190aa80becf5e7d4da05629e141341f5487d32b', class: "stzh-pagetitle-home__image-wrapper" }, h("stzh-ratio", { key: 'e45711502cef5fa846f3d23f3e6f8294a961d8b2', ratio: "1:1", ratioSmall: "16:9", ratioMedium: "2:1", ratioLarge: "21:9", class: "stzh-pagetitle-home__ratio" }), h("div", { key: '4d85c6a810e68f9b4cee772c6dcc39f38d028d5f', class: "stzh-pagetitle-home__image-gradient" }), h("div", { key: '6ba98cd456027bd4d149d4b5b00ba5d2ba959c0f', class: "stzh-pagetitle-home__image-inner-wrapper" }, h("slot", { key: '4a007d005c3daa04819fb460b8add30a08be6e6c', name: "image" }))), h("div", { key: '48b3c611569615b7c426246ef6c5563fb81f346a', class: "stzh-pagetitle-home__container" }, h("div", { key: 'fee8d4b5883efd42f1b5f2d8da8d8d2345e1ecb0', class: "stzh-pagetitle-home__wrapper" }, h("div", { key: '94fdb6c4dc4896572899fd322d85c62fab62441f', class: "stzh-pagetitle-home__text" }, h("div", { key: '6a19a90f9a5265aa920a0bfd4dfa857456a0514c', class: "stzh-pagetitle-home__meta" }, h("div", { key: '117fe57cb0a394ea68123ddb8a2e8758739667e4', class: "stzh-pagetitle-home__readspeaker" }, h("slot", { key: 'e851ae904e772763342e5511b3c5c9fd05655cf5', name: "readspeaker" }))), h("div", { key: '8144c982a635ce17edd77f285842ec958cca80d8', class: "stzh-pagetitle-home__heading" }, h("slot", { key: '241266cbb89558ef831725c518ff9d28dcc2058d', name: "heading" })), h("div", { key: 'e0e9cc3e78d2ccc635283eae26867b9002c1a64e', class: "stzh-pagetitle-home__subheading" }, h("slot", { key: '21a58fe263656bc417fe254de48474d47e774227', name: "subheading" }))))))));
     }
     get element() { return this; }
     static get style() { return StzhPagetitleHomeStyle0; }

package/dist/components/stzh-pagetitle.js

@@ -1,7 +1,7 @@
 import { p as proxyCustomElement, H, h, d as Host } from './p-8f01554b.js';
 import { s as setPropsIfNull, h as hasSlot } from './p-289f5de2.js';
 import { m as media } from './p-f4adb3cd.js';
-import { d as defineCustomElement$2 } from './p-527121ef.js';
+import { d as defineCustomElement$2 } from './p-36fb6c94.js';
 
 const stzhPagetitleCss = ".sc-stzh-pagetitle-h{font-family:var(--stzh-font-family-medium);font-weight:var(--stzh-font-weight-medium);font-style:var(--stzh-font-style-medium);color:var(--stzh-base-color);box-sizing:border-box;display:block}[hidden].sc-stzh-pagetitle-h,[stzh-hidden].sc-stzh-pagetitle-h{display:none}.sc-stzh-pagetitle-h::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-pagetitle-h *.sc-stzh-pagetitle,.sc-stzh-pagetitle-h *.sc-stzh-pagetitle::before,.sc-stzh-pagetitle-h *.sc-stzh-pagetitle::after{box-sizing:border-box;text-underline-offset:var(--stzh-link-text-underline-offset);text-decoration-thickness:var(--stzh-link-text-decoration-thickness);-webkit-text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink);text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink)}.sc-stzh-pagetitle-h .has-focus.sc-stzh-pagetitle{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}.sc-stzh-pagetitle-h .stzh-fylingfocus-focused.sc-stzh-pagetitle{outline-style:none !important}.sc-stzh-pagetitle-h .stzh-fylingfocus-focused.sc-stzh-pagetitle::-moz-focus-inner{border:0 !important}.sc-stzh-pagetitle-h{--background-color:var(\n    --stzh-pagetitle-background-color,\n    var(--stzh-pagetitle-background-color)\n  );--image-background-color:var(--stzh-ratio-background-color);--heading-color:var(--stzh-pagetitle-heading-color, var(--stzh-heading-color));--lead-color:var(--stzh-pagetitle-lead-color, var(--stzh-heading-color))}.sc-stzh-pagetitle-h.sc-stzh-pagetitle-s>[slot=image],.sc-stzh-pagetitle-h .sc-stzh-pagetitle-s>[slot=image]{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.sc-stzh-pagetitle-h.sc-stzh-pagetitle-s>[slot=readspeaker] *,.sc-stzh-pagetitle-h .sc-stzh-pagetitle-s>[slot=readspeaker] *{--color:var(--stzh-pagetitle-readspeaker-color, var(--stzh-heading-color));--hover-color:var(--stzh-pagetitle-readspeaker-color, var(--stzh-heading-color))}[background=default].sc-stzh-pagetitle-h{--stzh-readspeaker-background-color:var(--background-color);--stzh-readspeaker-audio-track-progress-background-color:var(--stzh-color-white)}[background=transparent].sc-stzh-pagetitle-h{--background-color:transparent;--heading-color:var(\n    --stzh-pagetitle-transparent-heading-color,\n    var(--stzh-heading-color)\n  )}.stzh-pagetitle.sc-stzh-pagetitle{background-color:var(--background-color)}.stzh-pagetitle__container.sc-stzh-pagetitle{margin-left:1.25rem;margin-right:1.25rem}@media screen and (min-width: 600px){.stzh-pagetitle__container.sc-stzh-pagetitle{margin-left:2rem;margin-right:2rem}}@media screen and (min-width: 900px){.stzh-pagetitle__container.sc-stzh-pagetitle{margin-left:2.5rem;margin-right:2.5rem}}@media screen and (min-width: 1260px){.stzh-pagetitle__container.sc-stzh-pagetitle{margin-left:4rem;margin-right:4rem}}@media screen and (min-width: 1600px){.stzh-pagetitle__container.sc-stzh-pagetitle{margin-left:auto;margin-right:auto;max-width:84.25rem}}.stzh-pagetitle__wrapper.sc-stzh-pagetitle{position:relative;display:grid}.stzh-pagetitle__text.sc-stzh-pagetitle{padding-top:var(--stzh-space-xxlarge);padding-bottom:var(--stzh-space-xxlarge);display:flex;flex-direction:column;justify-content:center}@media screen and (min-width: 600px){.stzh-pagetitle__text.sc-stzh-pagetitle{padding-top:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 900px){.stzh-pagetitle__text.sc-stzh-pagetitle{padding-top:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 1260px){.stzh-pagetitle__text.sc-stzh-pagetitle{padding-top:var(--stzh-space-xbig)}}@media screen and (min-width: 600px){.stzh-pagetitle__text.sc-stzh-pagetitle{padding-bottom:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 900px){.stzh-pagetitle__text.sc-stzh-pagetitle{padding-bottom:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 1260px){.stzh-pagetitle__text.sc-stzh-pagetitle{padding-bottom:var(--stzh-space-xbig)}}.stzh-pagetitle__image-wrapper.sc-stzh-pagetitle{position:relative}.stzh-pagetitle__ratio.sc-stzh-pagetitle{--background-color:var(--image-background-color)}.stzh-pagetitle__image-inner-wrapper.sc-stzh-pagetitle{background-color:var(--image-background-color);position:absolute;inset:0;height:100%;margin-left:calc(1.25rem / -1);margin-right:calc(1.25rem / -1)}@media screen and (min-width: 600px){.stzh-pagetitle__image-inner-wrapper.sc-stzh-pagetitle{margin-left:calc(2rem / -1);margin-right:calc(2rem / -1)}}@media screen and (min-width: 900px){.stzh-pagetitle__image-inner-wrapper.sc-stzh-pagetitle{margin-left:0;margin-right:0;width:calc(100% + 2.5rem)}}@media screen and (min-width: 1260px){.stzh-pagetitle__image-inner-wrapper.sc-stzh-pagetitle{width:calc(100% + 4rem)}}@media screen and (min-width: 1600px){.stzh-pagetitle__image-inner-wrapper.sc-stzh-pagetitle{width:calc(100% + (100rem - 84.25rem) / 2)}}.stzh-pagetitle__meta.sc-stzh-pagetitle{display:flex;flex-direction:column-reverse;row-gap:var(--stzh-space-xsmall)}@media screen and (min-width: 900px){.stzh-pagetitle__meta.sc-stzh-pagetitle{flex-direction:row}}.stzh-pagetitle__tag.sc-stzh-pagetitle:not(:empty){margin-right:auto}@media screen and (min-width: 600px) and (max-width: 899px){.stzh-pagetitle__readspeaker.sc-stzh-pagetitle{--stzh-readspeaker-dropdown-position:relative;--stzh-readspeaker-dropdown-top:auto}}.stzh-pagetitle__dateline.sc-stzh-pagetitle{font-size:var(--stzh-font-milli-font-size);line-height:var(--stzh-font-milli-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing);margin-top:var(--stzh-space-medium);color:var(--stzh-color-primary70);margin-bottom:var(--stzh-space-xsmall)}@media screen and (min-width: 600px){.stzh-pagetitle__dateline.sc-stzh-pagetitle{margin-top:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-pagetitle__dateline.sc-stzh-pagetitle{margin-top:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-pagetitle__dateline.sc-stzh-pagetitle{margin-top:var(--stzh-space-xxlarge)}}.stzh-pagetitle__lead.sc-stzh-pagetitle{--stzh-base-lead-color:var(--lead-color)}.stzh-pagetitle__heading.sc-stzh-pagetitle{--stzh-heading-color:var(--heading-color)}.stzh-pagetitle__heading.sc-stzh-pagetitle:not(:empty)+.stzh-pagetitle__lead.sc-stzh-pagetitle:not(:empty){margin-top:var(--stzh-space-large)}@media screen and (min-width: 600px){.stzh-pagetitle__heading.sc-stzh-pagetitle:not(:empty)+.stzh-pagetitle__lead.sc-stzh-pagetitle:not(:empty){margin-top:var(--stzh-space-xlarge)}}@media screen and (min-width: 900px){.stzh-pagetitle__heading.sc-stzh-pagetitle:not(:empty)+.stzh-pagetitle__lead.sc-stzh-pagetitle:not(:empty){margin-top:var(--stzh-space-xxlarge)}}@media screen and (min-width: 1260px){.stzh-pagetitle__heading.sc-stzh-pagetitle:not(:empty)+.stzh-pagetitle__lead.sc-stzh-pagetitle:not(:empty){margin-top:var(--stzh-space-xxxlarge)}}.stzh-pagetitle__disturber.sc-stzh-pagetitle{z-index:var(--stzh-z-index-sticky);position:fixed;left:0;right:0;bottom:0}@media screen and (min-width: 900px){.stzh-pagetitle__disturber.sc-stzh-pagetitle{z-index:initial;position:absolute;width:calc(\n        ((100% - 7 * var(--stzh-grid-gutter-medium)) / 8 * 3) + 2 * var(--stzh-grid-gutter-medium)\n      );left:auto;bottom:calc((\n            var(--stzh-space-big) -\n              var(--stzh-space-xlarge)\n          ) / -1)}}@media screen and (min-width: 1260px){.stzh-pagetitle__disturber.sc-stzh-pagetitle{width:calc(\n        ((100% - 11 * var(--stzh-grid-gutter-large)) / 12 * 4) + 3 * var(--stzh-grid-gutter-large)\n      )}}@media screen and (min-width: 1600px){.stzh-pagetitle__disturber.sc-stzh-pagetitle{width:calc(\n        ((100% - 11 * var(--stzh-grid-gutter-ultra)) / 12 * 4) + 3 * var(--stzh-grid-gutter-ultra)\n      )}}.stzh-pagetitle--has-no-image.sc-stzh-pagetitle .stzh-pagetitle__ratio.sc-stzh-pagetitle{display:none}.stzh-pagetitle--has-no-image.sc-stzh-pagetitle .stzh-pagetitle__text.sc-stzh-pagetitle{column-gap:var(--stzh-grid-gutter);display:grid;grid-template-columns:repeat(4, minmax(0, 1fr))}@media screen and (min-width: 600px){.stzh-pagetitle--has-no-image.sc-stzh-pagetitle .stzh-pagetitle__text.sc-stzh-pagetitle{column-gap:var(--stzh-grid-gutter-small)}}@media screen and (min-width: 900px){.stzh-pagetitle--has-no-image.sc-stzh-pagetitle .stzh-pagetitle__text.sc-stzh-pagetitle{column-gap:var(--stzh-grid-gutter-medium)}}@media screen and (min-width: 1260px){.stzh-pagetitle--has-no-image.sc-stzh-pagetitle .stzh-pagetitle__text.sc-stzh-pagetitle{column-gap:var(--stzh-grid-gutter-large)}}@media screen and (min-width: 1600px){.stzh-pagetitle--has-no-image.sc-stzh-pagetitle .stzh-pagetitle__text.sc-stzh-pagetitle{column-gap:var(--stzh-grid-gutter-ultra)}}@media screen and (min-width: 900px){.stzh-pagetitle--has-no-image.sc-stzh-pagetitle .stzh-pagetitle__text.sc-stzh-pagetitle{grid-template-columns:repeat(8, minmax(0, 1fr))}}@media screen and (min-width: 1260px){.stzh-pagetitle--has-no-image.sc-stzh-pagetitle .stzh-pagetitle__text.sc-stzh-pagetitle{grid-template-columns:repeat(12, minmax(0, 1fr))}}.stzh-pagetitle--has-no-image.sc-stzh-pagetitle .stzh-pagetitle__meta.sc-stzh-pagetitle,.stzh-pagetitle--has-no-image.sc-stzh-pagetitle .stzh-pagetitle__dateline.sc-stzh-pagetitle,.stzh-pagetitle--has-no-image.sc-stzh-pagetitle .stzh-pagetitle__heading.sc-stzh-pagetitle,.stzh-pagetitle--has-no-image.sc-stzh-pagetitle .stzh-pagetitle__lead.sc-stzh-pagetitle{grid-column:1/span 4}@media screen and (min-width: 900px){.stzh-pagetitle--has-no-image.sc-stzh-pagetitle .stzh-pagetitle__meta.sc-stzh-pagetitle,.stzh-pagetitle--has-no-image.sc-stzh-pagetitle .stzh-pagetitle__dateline.sc-stzh-pagetitle,.stzh-pagetitle--has-no-image.sc-stzh-pagetitle .stzh-pagetitle__heading.sc-stzh-pagetitle{grid-column:1/span 8}}@media screen and (min-width: 900px){.stzh-pagetitle--has-no-image.sc-stzh-pagetitle .stzh-pagetitle__lead.sc-stzh-pagetitle{grid-column:1/span 6}}@media screen and (min-width: 1260px){.stzh-pagetitle--has-no-image.sc-stzh-pagetitle .stzh-pagetitle__lead.sc-stzh-pagetitle{grid-column:1/span 7}}@media screen and (min-width: 900px){.stzh-pagetitle--has-image.sc-stzh-pagetitle .stzh-pagetitle__wrapper.sc-stzh-pagetitle{grid-template-columns:repeat(2, minmax(0, 1fr));gap:var(--stzh-space-xxlarge)}}.stzh-pagetitle--has-meta.sc-stzh-pagetitle .stzh-pagetitle__text.sc-stzh-pagetitle{padding-top:var(--stzh-space-medium)}@media screen and (min-width: 600px){.stzh-pagetitle--has-meta.sc-stzh-pagetitle .stzh-pagetitle__text.sc-stzh-pagetitle{padding-top:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-pagetitle--has-meta.sc-stzh-pagetitle .stzh-pagetitle__text.sc-stzh-pagetitle{padding-top:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-pagetitle--has-meta.sc-stzh-pagetitle .stzh-pagetitle__text.sc-stzh-pagetitle{padding-top:var(--stzh-space-xxlarge)}}@media screen and (min-width: 900px){.stzh-pagetitle--has-tag.sc-stzh-pagetitle .stzh-pagetitle__readspeaker.sc-stzh-pagetitle{--stzh-readspeaker-dropdown-left:auto;--stzh-readspeaker-dropdown-right:0px;--stzh-readspeaker-dropdown-settings-left:auto;--stzh-readspeaker-dropdown-settings-right:0px}}.stzh-pagetitle--has-tag.sc-stzh-pagetitle:not(.stzh-pagetitle--has-dateline) .stzh-pagetitle__meta.sc-stzh-pagetitle{margin-bottom:var(--stzh-space-xlarge)}.stzh-pagetitle--background-default.sc-stzh-pagetitle .stzh-pagetitle__text.sc-stzh-pagetitle{--stzh-selection-background-color:var(--stzh-color-white)}.stzh-pagetitle--background-transparent.sc-stzh-pagetitle .stzh-pagetitle__text.sc-stzh-pagetitle{padding-bottom:var(--stzh-space-xxlarge)}@media screen and (min-width: 900px){.stzh-pagetitle--background-transparent.sc-stzh-pagetitle .stzh-pagetitle__text.sc-stzh-pagetitle{padding-bottom:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 1260px){.stzh-pagetitle--background-transparent.sc-stzh-pagetitle .stzh-pagetitle__text.sc-stzh-pagetitle{padding-bottom:var(--stzh-space-xxxxlarge)}}.stzh-pagetitle--hyphens.sc-stzh-pagetitle .stzh-pagetitle__heading.sc-stzh-pagetitle{hyphens:auto}.stzh-pagetitle--has-disturber.sc-stzh-pagetitle{margin-bottom:var(--stzh-space-large)}@media screen and (min-width: 600px){.stzh-pagetitle--has-disturber.sc-stzh-pagetitle{margin-bottom:var(--stzh-space-xlarge)}}@media screen and (min-width: 900px){.stzh-pagetitle--has-disturber.sc-stzh-pagetitle{margin-bottom:var(--stzh-space-xxlarge)}}@media screen and (min-width: 1260px){.stzh-pagetitle--has-disturber.sc-stzh-pagetitle{margin-bottom:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 900px) and (max-width: 1259px){.stzh-pagetitle--has-disturber.stzh-pagetitle--has-no-image.sc-stzh-pagetitle .stzh-pagetitle__lead.sc-stzh-pagetitle{grid-column:1/span 5}}";
 const StzhPagetitleStyle0 = stzhPagetitleCss;
@@ -133,7 +133,7 @@ const StzhPagetitle$1 = /*@__PURE__*/ proxyCustomElement(class StzhPagetitle ext
             "stzh-pagetitle--hyphens": this.hyphensEnabled,
             [`stzh-pagetitle--background-${this.background}`]: !!this.background,
         };
-        return (h(Host, { key: 'dd1dae5e9d6238ffdac9b57bee9028c6ab293a9e' }, h("div", { key: '7692e22c130fb9d768d54c57e56aea0bf5f49e75', class: classes }, h("div", { key: '276b719825766581a9310b2da3f2a8da24fc3ca8', class: "stzh-pagetitle__container" }, h("div", { key: '4edbf3c08ace8896ad635561e564fdfcfe9b0636', class: "stzh-pagetitle__wrapper" }, h("div", { key: 'b0d87b0ff4c587809434424dbe4b5ea820486849', class: "stzh-pagetitle__text" }, h("div", { key: '644c747a9faf9dec771338668bf8b1400ca0f22b', class: "stzh-pagetitle__meta" }, h("div", { key: '308d1af6ca44ed4e529f7b3f2c842c3cc5b433a8', class: "stzh-pagetitle__tag" }, h("slot", { key: '45d323f77a910db3c3333d71a4fca19e9df09de2', name: "tag" })), h("div", { key: '8c5f81a671e670b450efc5c689cba18b4146be34', class: "stzh-pagetitle__readspeaker" }, h("slot", { key: '53ca3e154eba02986ebb6a6243b01cdf211ec8e0', name: "readspeaker" }))), this.dateline && h("div", { key: '4c75ea7565d6d7ace87e4d315c21eaf2afad2ee4', class: "stzh-pagetitle__dateline" }, this.dateline), h("div", { key: 'a26fc81a10690ac96d14dd298a195861001feeb4', class: "stzh-pagetitle__heading" }, h("slot", { key: '187a4b8f2c292263c9176fea2fe421d78f43aeeb', name: "heading" })), h("div", { key: '187da73cdbbc557ad0609f83fee27a982b400d90', class: "stzh-pagetitle__lead" }, h("slot", { key: '0209e7b1c9431237292c7d62db87c95f58f89855', name: "lead" }))), h("div", { key: '8e9b473d1b013b1cef1b0df537612568cf0849e8', class: "stzh-pagetitle__image-wrapper" }, h("stzh-ratio", { key: '3d360e87e41d8ad5f8cdd292ca4d6d971af1c3fb', ratio: "16:9", ratioSmall: "3:2", ratioMedium: "16:9", class: "stzh-pagetitle__ratio" }), h("div", { key: '77fe51987394ce4d61e4b809bf3c1ed3e0231dcf', class: "stzh-pagetitle__image-inner-wrapper" }, h("slot", { key: '74b4a5695c7fcd3f9dbdd11d2e6eae6f9cd395d6', name: "image" }))), h("div", { key: '70f64853370f205febf986d7b0f405aa5d635371', class: "stzh-pagetitle__disturber", ref: el => (this.disturberElement = el) }, h("slot", { key: '8e45414bd0ef9b94029098bd2998ea3c6fb0c64d', name: "disturber" })))))));
+        return (h(Host, { key: 'e6398f212eed8534ac80eb764a74ebe35d311620' }, h("div", { key: 'c11ed79faf6349fde988346d754d5a2b905309ae', class: classes }, h("div", { key: '5e98c7aba81ccc1b3490cacacfa55af86a900ff5', class: "stzh-pagetitle__container" }, h("div", { key: 'de34dd84cdb5ada82a19191f4437b66a563ea89c', class: "stzh-pagetitle__wrapper" }, h("div", { key: '6fbf0bb4f0abc036927a0b64504ee5ca74ef6be7', class: "stzh-pagetitle__text" }, h("div", { key: 'b550842ed8723ec0502a8a139afcd5809d02176a', class: "stzh-pagetitle__meta" }, h("div", { key: '81ca34cc8ca8372d05050061493cc76551801e0f', class: "stzh-pagetitle__tag" }, h("slot", { key: '096301436aa8ac1f1377ad85169d8c3e04543fe8', name: "tag" })), h("div", { key: '035ef0ac6f8d40859ea758d0d3831cb28877e5bf', class: "stzh-pagetitle__readspeaker" }, h("slot", { key: '5186a2037e376aabcfdd35b0b1d59458e3605126', name: "readspeaker" }))), this.dateline && h("div", { key: '23e7b45df5b0d607b247a93ea0dda8e0a28885ea', class: "stzh-pagetitle__dateline" }, this.dateline), h("div", { key: '8c6d1f999728d64f92b649a46364b74ee50d6c95', class: "stzh-pagetitle__heading" }, h("slot", { key: '1ac3b98d90c4a11e9e32c6a6b5fe78a2b9c1a0c7', name: "heading" })), h("div", { key: 'fcd54af4d4cab40af4a3dfa7b3f8fb98d6000ecf', class: "stzh-pagetitle__lead" }, h("slot", { key: 'a430bf605d8a66d7fb962bb5a01380053c174451', name: "lead" }))), h("div", { key: '195842563342453fea20960eebcb0af217f5ddac', class: "stzh-pagetitle__image-wrapper" }, h("stzh-ratio", { key: '56f5eebb638ece8823e6c73b290f53c84f63015b', ratio: "16:9", ratioSmall: "3:2", ratioMedium: "16:9", class: "stzh-pagetitle__ratio" }), h("div", { key: '9bb742947b00b029f25d24d8930c4fb66fd355a8', class: "stzh-pagetitle__image-inner-wrapper" }, h("slot", { key: 'f819b8ee87e9fd6a262ad868e5e94406d632ed15', name: "image" }))), h("div", { key: '8f4d70ee60c6da6689192c30be4dd26e11e3fde5', class: "stzh-pagetitle__disturber", ref: el => (this.disturberElement = el) }, h("slot", { key: '5d90b3643bc224571d075f7522d048a5e49bbfdc', name: "disturber" })))))));
     }
     get element() { return this; }
     static get style() { return StzhPagetitleStyle0; }

package/dist/components/stzh-pagination.js

@@ -1,4 +1,4 @@
-import { S as StzhPagination$1, d as defineCustomElement$1 } from './p-a6169d66.js';
+import { S as StzhPagination$1, d as defineCustomElement$1 } from './p-e551f11e.js';
 
 const StzhPagination = StzhPagination$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/stzh-panorama.js

@@ -1,14 +1,14 @@
 import { p as proxyCustomElement, H, c as createEvent, h, F as Fragment, d as Host } from './p-8f01554b.js';
-import { d as defineCustomElement$b } from './p-17efbc57.js';
-import { d as defineCustomElement$a } from './p-e42121d1.js';
-import { d as defineCustomElement$9 } from './p-8254224a.js';
-import { d as defineCustomElement$8 } from './p-5a5884a1.js';
-import { d as defineCustomElement$7 } from './p-5a8587ab.js';
-import { d as defineCustomElement$6 } from './p-0ac64574.js';
-import { d as defineCustomElement$5 } from './p-6268e18b.js';
-import { d as defineCustomElement$4 } from './p-527121ef.js';
-import { d as defineCustomElement$3 } from './p-9a31aa56.js';
-import { d as defineCustomElement$2 } from './p-1449a24c.js';
+import { d as defineCustomElement$b } from './p-dd1c0c0c.js';
+import { d as defineCustomElement$a } from './p-4a78990f.js';
+import { d as defineCustomElement$9 } from './p-3f3349b1.js';
+import { d as defineCustomElement$8 } from './p-5571eadc.js';
+import { d as defineCustomElement$7 } from './p-7c4e756c.js';
+import { d as defineCustomElement$6 } from './p-111f7e01.js';
+import { d as defineCustomElement$5 } from './p-963d59bf.js';
+import { d as defineCustomElement$4 } from './p-36fb6c94.js';
+import { d as defineCustomElement$3 } from './p-63c4d8c4.js';
+import { d as defineCustomElement$2 } from './p-613937f1.js';
 
 // Pannellum 2.5.6, https://github.com/mpetroff/pannellum
 window.libpannellum=function(E,g,p){function Ba(K){function ja(a,e){return 1==a.level&&1!=e.level?-1:1==e.level&&1!=a.level?1:e.timestamp-a.timestamp}function Q(a,e){return a.level!=e.level?a.level-e.level:a.diff-e.diff}function ka(a,e,c,g,l,h){this.vertices=a;this.side=e;this.level=c;this.x=g;this.y=l;this.path=h.replace("%s",e).replace("%l",c).replace("%x",g).replace("%y",l);}function Ja(a,e,g,p,l){var h;var d=e.vertices;h=la(a,d.slice(0,3));var u=la(a,d.slice(3,6)),x=la(a,d.slice(6,9)),d=la(a,d.slice(9,
@@ -451,9 +451,9 @@ const StzhPanorama$1 = /*@__PURE__*/ proxyCustomElement(class StzhPanorama exten
             text: imageTitle,
         }));
         const currentScene = this._scenes.find(({ sceneId }) => sceneId === this.scene);
-        return (h(Host, { key: '0239b3952066af59f6041b26236db080a23ccb0a' }, h("div", { key: '0b872046692908dfc813c6f1f800fda8af7d1bea', class: classes }, h("stzh-figure", { key: 'bb84231fee7fea352a8b7962c3d017b8d686e84d', class: "stzh-panorama__figure", heading: this.heading, caption: currentScene.caption || this.caption, copyright: currentScene.copyright || this.copyright }, h("stzh-ratio", { key: 'fdaeae37626d47f8d0ce8cb1a76898ffd3210d7f' }, h("div", { key: '79c759aa7bd07042715f4f5e756654650a3a3a8e', ref: el => (this.containerElement = el), class: "stzh-panorama__container", tabindex: "0" }, h("div", { key: 'f3dd8596b0c6711060d10e1f9d35e903406d7fbf', class: "stzh-panorama__sceneselector" }, sceneOptions.length > 1 && (h("stzh-dropdown", { key: '8cb5beee664516811443042edf284e063186fa89', class: "stzh-panorama__sceneselector-dropdown", size: "small", popoverPlacement: "top", label: this.localization.sceneLabel, labelHidden: true, noSearch: true, items: [this.scene], options: sceneOptions, onStzhChange: this.handleSceneDropdownChange })), (currentScene.imageAuthor || currentScene.copyright || this.copyright) && (h("div", { key: 'ec84da9ea267914c07820b2a7d70135a4a760a67', class: "stzh-panorama__copyright" }, currentScene.imageAuthor || currentScene.copyright || this.copyright))), h("div", { key: '6d1e159ac1458020e7f3cea59cf2714247b0a0ae', class: "stzh-panorama__controls", onKeyDown: this.handleControlsKeydown }, this.showControls && (h(Fragment, { key: '7b3453f65caa37af5e6a227209a2043f4c65caaf' }, h("stzh-button", { key: 'af6697075c085f158b92aebbe3839ca7d4ec99a6', class: "stzh-panorama__control stzh-panorama__control--show-medium", iconOnly: true, "a11y-label": this.localization.panLeft, variant: "secondary", icon: "arrow-left", size: "small", onClick: () => this.action("panLeft") }), h("stzh-button", { key: '4157878c68cacafd246b6eaf01fe27628cf43f7f', class: "stzh-panorama__control stzh-panorama__control--show-medium", iconOnly: true, "a11y-label": this.localization.panRight, variant: "secondary", icon: "arrow-right", size: "small", onClick: () => this.action("panRight") }), h("stzh-button", { key: '816285cf6b9009ac9a8d8b2f0e3b6f96172ee297', class: "stzh-panorama__control stzh-panorama__control--show-medium", iconOnly: true, "a11y-label": this.localization.panUp, variant: "secondary", icon: "arrow-up", size: "small", onClick: () => this.action("panUp") }), h("stzh-button", { key: 'f4058fff62b8f610fdd46437e35cfbbbfc39ed87', class: "stzh-panorama__control stzh-panorama__control--show-medium", iconOnly: true, "a11y-label": this.localization.panDown, variant: "secondary", icon: "arrow-down", size: "small", onClick: () => this.action("panDown") }), h("stzh-button", { key: '92f7651f9dfc74c3dd878b8076a18eb11aff67b8', class: "stzh-panorama__control stzh-panorama__control--show-medium", iconOnly: true, "a11y-label": this.localization.zoomIn, variant: "secondary", icon: "plus", size: "small", onClick: () => this.action("zoomIn") }), h("stzh-button", { key: '478529431ea9d25f2c930766d0498556e18dc864', class: "stzh-panorama__control stzh-panorama__control--show-medium", iconOnly: true, "a11y-label": this.localization.zoomOut, variant: "secondary", icon: "minus", size: "small", onClick: () => this.action("zoomOut") }))), this.isOrientationSupported && (h("stzh-button", { key: 'baa80c699ba238e8f3fbce666ac8e7aa3f555b90', class: "stzh-panorama__control", variant: "secondary", a11yLabel: this.isOrientationActive
+        return (h(Host, { key: 'e13a68f8203db678fd80e60cce44dc39a48933d9' }, h("div", { key: '08fbaddbb670022b80ec87b39d48237c49536c28', class: classes }, h("stzh-figure", { key: '5639e565f54bbb6157b9b850459dd5feb496f942', class: "stzh-panorama__figure", heading: this.heading, caption: currentScene.caption || this.caption, copyright: currentScene.copyright || this.copyright }, h("stzh-ratio", { key: '1be121e3e99af22ea13b49ea49c18caaff4a3959' }, h("div", { key: '9de470e5f725200a1bf7a7779f9c5a00124a66de', ref: el => (this.containerElement = el), class: "stzh-panorama__container", tabindex: "0" }, h("div", { key: 'ee7d8a3fe2ab75db9af737add03d23493b380d60', class: "stzh-panorama__sceneselector" }, sceneOptions.length > 1 && (h("stzh-dropdown", { key: '089090098be70ffad7b374439a9c40c8983d077c', class: "stzh-panorama__sceneselector-dropdown", size: "small", popoverPlacement: "top", label: this.localization.sceneLabel, labelHidden: true, noSearch: true, items: [this.scene], options: sceneOptions, onStzhChange: this.handleSceneDropdownChange })), (currentScene.imageAuthor || currentScene.copyright || this.copyright) && (h("div", { key: '38edbe69e5beabce1b46457b837c6b396f6a69b3', class: "stzh-panorama__copyright" }, currentScene.imageAuthor || currentScene.copyright || this.copyright))), h("div", { key: 'b5527f8113d1827a91de01b827a266afc78eb754', class: "stzh-panorama__controls", onKeyDown: this.handleControlsKeydown }, this.showControls && (h(Fragment, { key: 'ed77a68da8790ed236a6d7bb1d2ce25c18d7411f' }, h("stzh-button", { key: '164c91211f4095aaae34eda2e39e019fe337184e', class: "stzh-panorama__control stzh-panorama__control--show-medium", iconOnly: true, "a11y-label": this.localization.panLeft, variant: "secondary", icon: "arrow-left", size: "small", onClick: () => this.action("panLeft") }), h("stzh-button", { key: 'ae9ddb86cd1354fee6a69b81799ce456d1ae5f86', class: "stzh-panorama__control stzh-panorama__control--show-medium", iconOnly: true, "a11y-label": this.localization.panRight, variant: "secondary", icon: "arrow-right", size: "small", onClick: () => this.action("panRight") }), h("stzh-button", { key: 'c4c50653bc80fc34aa4b442d22ba70962fb09cd4', class: "stzh-panorama__control stzh-panorama__control--show-medium", iconOnly: true, "a11y-label": this.localization.panUp, variant: "secondary", icon: "arrow-up", size: "small", onClick: () => this.action("panUp") }), h("stzh-button", { key: '9e75f3ff02a72589e74adf79f088af439d6ff6be', class: "stzh-panorama__control stzh-panorama__control--show-medium", iconOnly: true, "a11y-label": this.localization.panDown, variant: "secondary", icon: "arrow-down", size: "small", onClick: () => this.action("panDown") }), h("stzh-button", { key: '14b6bd8033a1fd2a1affbc5b9504b35c66406c34', class: "stzh-panorama__control stzh-panorama__control--show-medium", iconOnly: true, "a11y-label": this.localization.zoomIn, variant: "secondary", icon: "plus", size: "small", onClick: () => this.action("zoomIn") }), h("stzh-button", { key: 'ea00141206e9d5edebd22af1154ebc9c025f3c94', class: "stzh-panorama__control stzh-panorama__control--show-medium", iconOnly: true, "a11y-label": this.localization.zoomOut, variant: "secondary", icon: "minus", size: "small", onClick: () => this.action("zoomOut") }))), this.isOrientationSupported && (h("stzh-button", { key: 'ca33d06c5e1386ba560b2e76f6aa1fc60ac3be71', class: "stzh-panorama__control", variant: "secondary", a11yLabel: this.isOrientationActive
                 ? this.localization.stopOrientation
-                : this.localization.startOrientation, icon: this.isOrientationActive ? "target-bullet" : "target", iconOnly: true, size: "small", onClick: () => this.action(this.isOrientationActive ? "stopOrientation" : "startOrientation") })), h("stzh-button", { key: '19f6f2154750c9efabcb9edc918b40282766babb', class: "stzh-panorama__control", variant: "secondary", a11yLabel: this.isFullscreen
+                : this.localization.startOrientation, icon: this.isOrientationActive ? "target-bullet" : "target", iconOnly: true, size: "small", onClick: () => this.action(this.isOrientationActive ? "stopOrientation" : "startOrientation") })), h("stzh-button", { key: 'a514f73a90d9e92edb65d50fb168a3f104504531', class: "stzh-panorama__control", variant: "secondary", a11yLabel: this.isFullscreen
                 ? this.localization.disableFullscreenLabel
                 : this.localization.enableFullscreenLabel, icon: this.isFullscreen ? "shrink" : "expand", iconOnly: true, size: "small", onClick: () => this.action("fullscreen") }))))))));
     }

package/dist/components/stzh-pi-content-navigation.js

@@ -1,7 +1,7 @@
 import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-8f01554b.js';
 import { h as hasSlot } from './p-289f5de2.js';
-import { d as defineCustomElement$3 } from './p-5a8587ab.js';
-import { d as defineCustomElement$2 } from './p-527121ef.js';
+import { d as defineCustomElement$3 } from './p-7c4e756c.js';
+import { d as defineCustomElement$2 } from './p-36fb6c94.js';
 
 const stzhPiContentNavigationCss = ".sc-stzh-pi-content-navigation-h{font-family:var(--stzh-font-family-medium);font-weight:var(--stzh-font-weight-medium);font-style:var(--stzh-font-style-medium);color:var(--stzh-base-color);box-sizing:border-box;display:block}[hidden].sc-stzh-pi-content-navigation-h,[stzh-hidden].sc-stzh-pi-content-navigation-h{display:none}.sc-stzh-pi-content-navigation-h::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-pi-content-navigation-h *.sc-stzh-pi-content-navigation,.sc-stzh-pi-content-navigation-h *.sc-stzh-pi-content-navigation::before,.sc-stzh-pi-content-navigation-h *.sc-stzh-pi-content-navigation::after{box-sizing:border-box;text-underline-offset:var(--stzh-link-text-underline-offset);text-decoration-thickness:var(--stzh-link-text-decoration-thickness);-webkit-text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink);text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink)}.sc-stzh-pi-content-navigation-h .has-focus.sc-stzh-pi-content-navigation{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}.sc-stzh-pi-content-navigation-h .stzh-fylingfocus-focused.sc-stzh-pi-content-navigation{outline-style:none !important}.sc-stzh-pi-content-navigation-h .stzh-fylingfocus-focused.sc-stzh-pi-content-navigation::-moz-focus-inner{border:0 !important}.sc-stzh-pi-content-navigation-h{--arrow-background-color:var(\n    --stzh-pi-content-navigation-arrow-background-color,\n    var(--stzh-color-secondary30)\n  );display:flex;flex-direction:column}.stzh-pi-content-navigation.sc-stzh-pi-content-navigation{position:relative;flex-grow:1;display:flex;flex-direction:column;gap:var(--stzh-space-small);background-color:var(--stzh-color-coolgrey20)}@media (forced-colors: active), (-ms-high-contrast: active){.stzh-pi-content-navigation.sc-stzh-pi-content-navigation{border:0.125rem solid}}.stzh-pi-content-navigation.sc-stzh-pi-content-navigation:hover .stzh-pi-content-navigation__arrow-icon.sc-stzh-pi-content-navigation{transform:translateX(0.25rem)}.stzh-pi-content-navigation__wrapper.sc-stzh-pi-content-navigation{display:flex;flex-grow:1;padding-right:var(--stzh-space-medium);padding-left:var(--stzh-space-medium);padding-top:var(--stzh-space-medium);padding-bottom:var(--stzh-space-medium);flex-direction:column;align-items:flex-start}@media screen and (min-width: 900px){.stzh-pi-content-navigation__wrapper.sc-stzh-pi-content-navigation{padding-right:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-pi-content-navigation__wrapper.sc-stzh-pi-content-navigation{padding-left:var(--stzh-space-large)}}@media screen and (min-width: 600px){.stzh-pi-content-navigation__wrapper.sc-stzh-pi-content-navigation{padding-top:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-pi-content-navigation__wrapper.sc-stzh-pi-content-navigation{padding-top:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-pi-content-navigation__wrapper.sc-stzh-pi-content-navigation{padding-top:var(--stzh-space-xxlarge)}}@media screen and (min-width: 600px){.stzh-pi-content-navigation__wrapper.sc-stzh-pi-content-navigation{padding-bottom:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-pi-content-navigation__wrapper.sc-stzh-pi-content-navigation{padding-bottom:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-pi-content-navigation__wrapper.sc-stzh-pi-content-navigation{padding-bottom:var(--stzh-space-xxlarge)}}.stzh-pi-content-navigation__image.sc-stzh-pi-content-navigation{width:100%;display:none}.stzh-pi-content-navigation__title.sc-stzh-pi-content-navigation{font-family:var(--stzh-font-family-heavy);font-weight:var(--stzh-font-weight-heavy);font-style:var(--stzh-font-style-heavy);font-size:var(--stzh-font-deci-font-size);line-height:var(--stzh-font-deci-heading-line-height);letter-spacing:var(--stzh-font-curve---heading-letter-spacing);overflow-wrap:break-word;word-wrap:break-word;word-break:break-word;hyphens:auto;color:var(--stzh-color-black);margin:0}@media screen and (min-width: 900px){.stzh-pi-content-navigation__title.sc-stzh-pi-content-navigation{font-size:var(--stzh-font-deca-font-size);line-height:var(--stzh-font-deca-text-line-height);letter-spacing:var(--stzh-font-deca-text-letter-spacing)}}.stzh-pi-content-navigation__title.sc-stzh-pi-content-navigation:has(+.stzh-pi-content-navigation__lead).sc-stzh-pi-content-navigation{padding-bottom:var(--stzh-space-xsmall)}@media screen and (min-width: 600px){.stzh-pi-content-navigation__title.sc-stzh-pi-content-navigation:has(+.stzh-pi-content-navigation__lead).sc-stzh-pi-content-navigation{padding-bottom:var(--stzh-space-small)}}@media screen and (min-width: 900px){.stzh-pi-content-navigation__title.sc-stzh-pi-content-navigation:has(+.stzh-pi-content-navigation__lead).sc-stzh-pi-content-navigation{padding-bottom:var(--stzh-space-medium)}}@media screen and (min-width: 1260px){.stzh-pi-content-navigation__title.sc-stzh-pi-content-navigation:has(+.stzh-pi-content-navigation__lead).sc-stzh-pi-content-navigation{padding-bottom:var(--stzh-space-xlarge)}}.stzh-pi-content-navigation__title-link.sc-stzh-pi-content-navigation{display:block;font-family:inherit;padding:0;appearance:none;background-color:transparent;border:none;color:var(--stzh-color-black);-webkit-text-decoration-line:none;text-decoration-line:none;transition:color var(--stzh-base-transition-animation-speed);border-radius:var(--stzh-button-border-radius);cursor:pointer;flex-grow:1;padding-bottom:2.5rem}.stzh-pi-content-navigation__title-link.sc-stzh-pi-content-navigation::after{content:\"\";display:block;position:absolute;top:0;left:0;width:100%;height:100%}.stzh-pi-content-navigation__title-link.sc-stzh-pi-content-navigation::after{z-index:1}.stzh-pi-content-navigation__lead.sc-stzh-pi-content-navigation{font-size:var(--stzh-font-curve-p2-default-font-size, var(--stzh-font-micro-font-size));line-height:var(--stzh-font-curve-p2-default-text-line-height, var(--stzh-font-micro-text-line-height))}@media screen and (min-width: 900px){.stzh-pi-content-navigation__lead.sc-stzh-pi-content-navigation{font-size:var(--stzh-font-curve-p2-medium-font-size, var(--stzh-font-milli-font-size));line-height:var(--stzh-font-curve-p2-medium-text-line-height, var(--stzh-font-milli-text-line-height));letter-spacing:var(--stzh-font-curve-p2-medium-text-letter-spacing)}}.stzh-pi-content-navigation__arrow.sc-stzh-pi-content-navigation{flex-shrink:0;display:flex;justify-content:center;align-items:center;width:2.75rem;height:2.75rem;position:absolute;right:0;bottom:0;color:var(--stzh-color-black);background-color:var(--arrow-background-color)}.stzh-pi-content-navigation__arrow-icon.sc-stzh-pi-content-navigation{transition:transform 150ms ease;--size:var(--stzh-icon-size-large)}.stzh-pi-content-navigation.sc-stzh-pi-content-navigation:not(.stzh-pi-content-navigation--is-navigation-level-1-or-2) .stzh-pi-content-navigation__wrapper.sc-stzh-pi-content-navigation{padding-right:var(--stzh-space-xsmall);padding-left:var(--stzh-space-xsmall)}@media screen and (min-width: 600px){.stzh-pi-content-navigation.sc-stzh-pi-content-navigation:not(.stzh-pi-content-navigation--is-navigation-level-1-or-2) .stzh-pi-content-navigation__wrapper.sc-stzh-pi-content-navigation{padding-right:var(--stzh-space-small)}}@media screen and (min-width: 900px){.stzh-pi-content-navigation.sc-stzh-pi-content-navigation:not(.stzh-pi-content-navigation--is-navigation-level-1-or-2) .stzh-pi-content-navigation__wrapper.sc-stzh-pi-content-navigation{padding-right:var(--stzh-space-medium)}}@media screen and (min-width: 1260px){.stzh-pi-content-navigation.sc-stzh-pi-content-navigation:not(.stzh-pi-content-navigation--is-navigation-level-1-or-2) .stzh-pi-content-navigation__wrapper.sc-stzh-pi-content-navigation{padding-right:var(--stzh-space-xlarge)}}@media screen and (min-width: 600px){.stzh-pi-content-navigation.sc-stzh-pi-content-navigation:not(.stzh-pi-content-navigation--is-navigation-level-1-or-2) .stzh-pi-content-navigation__wrapper.sc-stzh-pi-content-navigation{padding-left:var(--stzh-space-small)}}@media screen and (min-width: 900px){.stzh-pi-content-navigation.sc-stzh-pi-content-navigation:not(.stzh-pi-content-navigation--is-navigation-level-1-or-2) .stzh-pi-content-navigation__wrapper.sc-stzh-pi-content-navigation{padding-left:var(--stzh-space-medium)}}@media screen and (min-width: 1260px){.stzh-pi-content-navigation.sc-stzh-pi-content-navigation:not(.stzh-pi-content-navigation--is-navigation-level-1-or-2) .stzh-pi-content-navigation__wrapper.sc-stzh-pi-content-navigation{padding-left:var(--stzh-space-xlarge)}}.stzh-pi-content-navigation.sc-stzh-pi-content-navigation:not(.stzh-pi-content-navigation--is-navigation-level-1-or-2) .stzh-pi-content-navigation__title-ratio.sc-stzh-pi-content-navigation .stzh-pi-content-navigation__title.sc-stzh-pi-content-navigation{padding-right:var(--stzh-space-xsmall);padding-left:var(--stzh-space-xsmall)}@media screen and (min-width: 600px){.stzh-pi-content-navigation.sc-stzh-pi-content-navigation:not(.stzh-pi-content-navigation--is-navigation-level-1-or-2) .stzh-pi-content-navigation__title-ratio.sc-stzh-pi-content-navigation .stzh-pi-content-navigation__title.sc-stzh-pi-content-navigation{padding-right:var(--stzh-space-small)}}@media screen and (min-width: 900px){.stzh-pi-content-navigation.sc-stzh-pi-content-navigation:not(.stzh-pi-content-navigation--is-navigation-level-1-or-2) .stzh-pi-content-navigation__title-ratio.sc-stzh-pi-content-navigation .stzh-pi-content-navigation__title.sc-stzh-pi-content-navigation{padding-right:var(--stzh-space-medium)}}@media screen and (min-width: 1260px){.stzh-pi-content-navigation.sc-stzh-pi-content-navigation:not(.stzh-pi-content-navigation--is-navigation-level-1-or-2) .stzh-pi-content-navigation__title-ratio.sc-stzh-pi-content-navigation .stzh-pi-content-navigation__title.sc-stzh-pi-content-navigation{padding-right:var(--stzh-space-xlarge)}}@media screen and (min-width: 600px){.stzh-pi-content-navigation.sc-stzh-pi-content-navigation:not(.stzh-pi-content-navigation--is-navigation-level-1-or-2) .stzh-pi-content-navigation__title-ratio.sc-stzh-pi-content-navigation .stzh-pi-content-navigation__title.sc-stzh-pi-content-navigation{padding-left:var(--stzh-space-small)}}@media screen and (min-width: 900px){.stzh-pi-content-navigation.sc-stzh-pi-content-navigation:not(.stzh-pi-content-navigation--is-navigation-level-1-or-2) .stzh-pi-content-navigation__title-ratio.sc-stzh-pi-content-navigation .stzh-pi-content-navigation__title.sc-stzh-pi-content-navigation{padding-left:var(--stzh-space-medium)}}@media screen and (min-width: 1260px){.stzh-pi-content-navigation.sc-stzh-pi-content-navigation:not(.stzh-pi-content-navigation--is-navigation-level-1-or-2) .stzh-pi-content-navigation__title-ratio.sc-stzh-pi-content-navigation .stzh-pi-content-navigation__title.sc-stzh-pi-content-navigation{padding-left:var(--stzh-space-xlarge)}}.stzh-pi-content-navigation--has-image.sc-stzh-pi-content-navigation .stzh-pi-content-navigation__image.sc-stzh-pi-content-navigation{display:block}.stzh-pi-content-navigation__title-ratio.sc-stzh-pi-content-navigation{background-color:var(--stzh-color-coolgrey30);aspect-ratio:2/1;display:flex;align-items:center;padding-top:var(--stzh-space-medium);padding-right:var(--stzh-space-medium);padding-bottom:var(--stzh-space-medium);padding-left:var(--stzh-space-medium)}@media screen and (min-width: 600px){.stzh-pi-content-navigation__title-ratio.sc-stzh-pi-content-navigation{padding-top:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-pi-content-navigation__title-ratio.sc-stzh-pi-content-navigation{padding-top:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-pi-content-navigation__title-ratio.sc-stzh-pi-content-navigation{padding-top:var(--stzh-space-xxlarge)}}@media screen and (min-width: 900px){.stzh-pi-content-navigation__title-ratio.sc-stzh-pi-content-navigation{padding-right:var(--stzh-space-large)}}@media screen and (min-width: 600px){.stzh-pi-content-navigation__title-ratio.sc-stzh-pi-content-navigation{padding-bottom:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-pi-content-navigation__title-ratio.sc-stzh-pi-content-navigation{padding-bottom:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-pi-content-navigation__title-ratio.sc-stzh-pi-content-navigation{padding-bottom:var(--stzh-space-xxlarge)}}@media screen and (min-width: 900px){.stzh-pi-content-navigation__title-ratio.sc-stzh-pi-content-navigation{padding-left:var(--stzh-space-large)}}.stzh-pi-content-navigation__title-ratio.sc-stzh-pi-content-navigation .stzh-pi-content-navigation__title.sc-stzh-pi-content-navigation{height:-moz-fit-content;height:fit-content}";
 const StzhPiContentNavigationStyle0 = stzhPiContentNavigationCss;
@@ -52,7 +52,7 @@ const StzhPiContentNavigation$1 = /*@__PURE__*/ proxyCustomElement(class StzhPiC
             "stzh-pi-content-navigation--is-navigation-level-1-or-2": isNavigationLevel1or2,
         };
         const CardLink = this.href ? "a" : "button";
-        return (h(Host, { key: 'c42abe95e0d73723d1f0cf2aa751973a5a583c62', "has-lead": hasLead }, h("article", { key: '879c274c2073ea1ce0c5b6017233b610365d7aa2', class: classes, "aria-label": this.heading, role: "listitem" }, h(CardLink, { key: '8332f0c407d0c69d8c063ab1667a6c1465993925', ref: el => (this.cardLinkElement = el), class: "stzh-pi-content-navigation__title-link", href: this.href, target: this.target, onClick: this.handleCardClick }, h("div", { key: 'aeb3927354ce525cbe6edee3ae7226409de22a7e', class: "stzh-pi-content-navigation__image" }, h("stzh-ratio", { key: 'da9d6a69d53465d9171c7c6ab0e96bd1dc985024', ratio: "2:1" }, h("slot", { key: 'dfd6406a810fd11a13bc0f2670df982e33096103', name: "image" }))), shouldRenderTitleRatio && (h("div", { key: '4399f9261a7546906257c928c511aeac337feda2', class: "stzh-pi-content-navigation__title-ratio" }, this.renderHeading())), h("div", { key: 'cc0310c4e4ba422fc5f7a171206aa7902bea2052', class: "stzh-pi-content-navigation__wrapper" }, !shouldRenderTitleRatio && this.renderHeading(), hasLead && (h("div", { key: '0de77793c29c75685a56e073b15ff5b2b84321e9', class: "stzh-pi-content-navigation__lead" }, this.lead ? this.lead : h("slot", { name: "lead" })))), h("div", { key: '6d5307769334e8f1da198b5d375a4141aae31b2a', class: "stzh-pi-content-navigation__arrow" }, h("stzh-icon", { key: '89a95c1f263261738f1578db407e9121f3807775', class: "stzh-pi-content-navigation__arrow-icon", name: "arrow-right" }))))));
+        return (h(Host, { key: '0a16919e13de81aa15deb81d4162461bc797686d', "has-lead": hasLead }, h("article", { key: '546ab726feeb9c83537035fadb527653736a9883', class: classes, "aria-label": this.heading, role: "listitem" }, h(CardLink, { key: 'f70c9644e16f1e6ec267000151c0a0f1b6f3ec78', ref: el => (this.cardLinkElement = el), class: "stzh-pi-content-navigation__title-link", href: this.href, target: this.target, onClick: this.handleCardClick }, h("div", { key: 'd4b40a0c8bc2dd10832ee93c17706a0a449ca7a5', class: "stzh-pi-content-navigation__image" }, h("stzh-ratio", { key: '61f8e77a448c9bc15ffeb684c7fa6d209223f935', ratio: "2:1" }, h("slot", { key: 'b35984bd914f3a7eaaf75d11e57a125f50097a4f', name: "image" }))), shouldRenderTitleRatio && (h("div", { key: '787bbc48bafb804de5202715d1eb520599c90061', class: "stzh-pi-content-navigation__title-ratio" }, this.renderHeading())), h("div", { key: '2e5d9234f52eccf7dffa868b00c0a8bfcd337d62', class: "stzh-pi-content-navigation__wrapper" }, !shouldRenderTitleRatio && this.renderHeading(), hasLead && (h("div", { key: 'c3be66d778cf8d7e84c385c778c9ea638b4d5756', class: "stzh-pi-content-navigation__lead" }, this.lead ? this.lead : h("slot", { name: "lead" })))), h("div", { key: '5785a3fda4de2dd49ef6151ed9383b2ec00109a2', class: "stzh-pi-content-navigation__arrow" }, h("stzh-icon", { key: '0790cce9f6da093c7fd2e1614afe1c5b4e679da2', class: "stzh-pi-content-navigation__arrow-icon", name: "arrow-right" }))))));
     }
     get element() { return this; }
     static get style() { return StzhPiContentNavigationStyle0; }

package/dist/components/stzh-pi-menu.js

@@ -2,8 +2,8 @@ import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-
 import { w as waitForEvent } from './p-70ec7e79.js';
 import { s as stopAnimations, a as animateTo, b as shimKeyframesAutoValues } from './p-2c0bec3e.js';
 import { m as media, a as addMediaChangeListener, r as removeMediaChangeListener } from './p-f4adb3cd.js';
-import { d as defineCustomElement$3 } from './p-1c939b9f.js';
-import { d as defineCustomElement$2 } from './p-5a8587ab.js';
+import { d as defineCustomElement$3 } from './p-14716cc2.js';
+import { d as defineCustomElement$2 } from './p-7c4e756c.js';
 
 const stzhPiMenuCss = ":host{font-family:var(--stzh-font-family-medium);font-weight:var(--stzh-font-weight-medium);font-style:var(--stzh-font-style-medium);color:var(--stzh-base-color);box-sizing:border-box;display:block;}:host[hidden],:host[stzh-hidden]{display:none}:host::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}:host *,:host *::before,:host *::after{box-sizing:border-box;text-underline-offset:var(--stzh-link-text-underline-offset);text-decoration-thickness:var(--stzh-link-text-decoration-thickness);-webkit-text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink);text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink)}:host .has-focus{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}:host .stzh-fylingfocus-focused{outline-style:none !important}:host .stzh-fylingfocus-focused::-moz-focus-inner{border:0 !important}:host{--padding-left:var(--stzh-pi-menu-padding-left, 20px);--trigger-size:var(--stzh-icon-size-large);--trigger-color:var(--stzh-color-black);--content-background:var(--stzh-color-primary20);--icon-size:var(--stzh-icon-size);--button-color:var(--stzh-color-black);--button-background-color:var(--stzh-color-primary30);--hover-button-color:var(--button-color);--hover-button-background-color:var(--stzh-color-primary40);--hover-trigger-color:var(--trigger-color)}@media print{:host{page-break-inside:avoid;break-inside:avoid}}@media (forced-colors: active), (-ms-high-contrast: active){:host{--trigger-color:CanvasText;--hover-trigger-color:CanvasText}}.stzh-pi-menu{height:100%;transition:width 0.15s ease;width:100%;z-index:1;position:absolute;scrollbar-color:var(--stzh-color-primary40) var(--content-background);}.stzh-pi-menu::-webkit-scrollbar{width:0.5rem}.stzh-pi-menu::-webkit-scrollbar-thumb{background-color:var(--stzh-color-primary40)}.stzh-pi-menu::-webkit-scrollbar-track{background:var(--content-background)}.stzh-pi-menu--fixed{position:fixed;top:0;height:auto;bottom:0}.stzh-pi-menu__heading{margin:0;position:sticky;top:0}.stzh-pi-menu__backdrop{position:absolute;z-index:-1;top:0;width:0;height:0;background-color:var(--stzh-color-black40op);opacity:0;transition:opacity var(--stzh-base-transition-animation-speed);pointer-events:none}.stzh-pi-menu__backdrop--visible{width:100vw;height:100vh;opacity:1;pointer-events:auto}.stzh-pi-menu__button{font-size:var(--stzh-font-centi-font-size);line-height:var(--stzh-font-centi-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing);font-family:var(--stzh-font-family-heavy);font-weight:var(--stzh-font-weight-heavy);font-style:var(--stzh-font-style-heavy);padding-left:var(--stzh-space-none);padding-right:var(--stzh-space-medium);padding-top:var(--stzh-space-none);padding-bottom:var(--stzh-space-none);width:100%;min-height:var(--stzh-space-xbig);appearance:none;display:flex;align-items:center;gap:var(--stzh-space-xsmall);color:var(--button-color);background-color:var(--button-background-color);text-align:left;border:none;transition-property:background-color;transition-duration:var(--stzh-base-transition-animation-speed);cursor:pointer}@media screen and (min-width: 900px){.stzh-pi-menu__button{padding-right:var(--stzh-space-small)}}@media screen and (min-width: 1260px){.stzh-pi-menu__button{font-size:var(--stzh-font-deci-font-size);line-height:var(--stzh-font-deci-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing);font-size:var(--stzh-font-deci-font-size);line-height:var(--stzh-font-deci-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing)}}@media screen and (min-width: 1600px){.stzh-pi-menu__button{padding-left:calc((100vw - 100rem) / 2);padding-right:var(--stzh-space-medium)}}@media (prefers-reduced-motion: reduce){.stzh-pi-menu__button{transition:none}}.stzh-pi-menu__button:hover{color:var(--hover-button-color);background-color:var(--hover-button-background-color)}.stzh-pi-menu__button-spacer{visibility:hidden;pointer-events:none}.stzh-pi-menu__subheading{font-size:var(--stzh-font-centi-font-size);line-height:var(--stzh-font-centi-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing);font-family:var(--stzh-font-family-heavy);font-weight:var(--stzh-font-weight-heavy);font-style:var(--stzh-font-style-heavy);font-size:var(--stzh-font-centi-font-size);line-height:var(--stzh-font-centi-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing);font-family:var(--stzh-font-family-heavy);font-weight:var(--stzh-font-weight-heavy);font-style:var(--stzh-font-style-heavy);margin:0;padding:var(--stzh-space-small) var(--stzh-space-medium);hyphens:auto}@media screen and (min-width: 900px){.stzh-pi-menu__subheading{padding-left:var(--stzh-space-small);padding-right:var(--stzh-space-small)}}@media screen and (min-width: 1260px){.stzh-pi-menu__subheading{font-size:var(--stzh-font-deci-font-size);line-height:var(--stzh-font-deci-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing)}}@media screen and (min-width: 1600px){.stzh-pi-menu__subheading{padding-left:calc((100vw - 100rem) / 2 + var(--stzh-space-medium));padding-right:var(--stzh-space-medium)}}.stzh-pi-menu__content-inner{background-color:var(--content-background);overflow-y:hidden}.stzh-pi-menu__button-text{flex-grow:1;padding-left:var(--stzh-space-medium)}@media screen and (min-width: 900px){.stzh-pi-menu__button-text{padding-left:var(--stzh-space-small);padding-right:var(--stzh-space-small)}}@media screen and (min-width: 1600px){.stzh-pi-menu__button-text{padding-left:var(--stzh-space-medium);padding-right:var(--stzh-space-medium)}}.stzh-pi-menu__button-icon,.stzh-pi-menu__button-icon-in-menu{--size:var(--trigger-size);transition-property:transform, color;transition-duration:500ms;color:var(--trigger-color)}@media (prefers-reduced-motion: reduce){.stzh-pi-menu__button-icon,.stzh-pi-menu__button-icon-in-menu{transition:none}}.stzh-pi-menu__button-icon-in-menu{--size:var(--icon-size);color:var(--stzh-color-black);margin-left:auto}.stzh-pi-menu__button-icon-in-menu:hover{color:var(--stzh-color-primary70)}@media screen and (min-width: 900px){.stzh-pi-menu__button-icon-in-menu{display:none}}.stzh-pi-menu__sub-menu{display:flex;padding-right:var(--stzh-space-medium);align-items:center}@media screen and (min-width: 900px){.stzh-pi-menu__sub-menu{padding-right:var(--stzh-space-small)}}@media screen and (min-width: 1600px){.stzh-pi-menu__sub-menu{padding-right:var(--stzh-space-medium)}}.stzh-pi-menu__button:hover .stzh-pi-menu__button-icon{color:var(--hover-trigger-color)}.stzh-pi-menu__button:hover .stzh-pi-menu__button-icon.is-default::before,.stzh-pi-menu__button:hover .stzh-pi-menu__button-icon.is-default::after{background-color:var(--hover-trigger-color)}.stzh-pi-menu__content{height:calc(100vh - 4rem);width:100%}@media print{.stzh-pi-menu__content{height:auto !important;overflow:visible !important;display:block !important}}.stzh-pi-menu stzh-details .stzh-details--is-open .stzh-pi-menu__button-icon-in-menu{transform:rotate(180deg)}.stzh-pi-menu stzh-details .stzh-details__content-inner{padding-top:var(--stzh-space-none)}.stzh-pi-menu__nav{padding-bottom:var(--stzh-space-xlarge);padding-left:var(--stzh-space-none)}.stzh-pi-menu__nav-list{list-style:none;margin-block-start:0;margin-block-end:0;padding-inline-start:0}@media screen and (min-width: 900px){.stzh-pi-menu__nav-list.is-level-2{padding-bottom:var(--stzh-space-small)}}.stzh-pi-menu__nav-item{display:block;padding-top:var(--stzh-space-xxsmall);padding-right:var(--stzh-space-medium);padding-bottom:var(--stzh-space-xxsmall);padding-top:var(--stzh-space-xxsmall);padding-right:var(--stzh-space-medium);padding-bottom:var(--stzh-space-xxsmall);padding-left:var(--padding-left);text-decoration:none;color:var(--stzh-color-black)}@media screen and (min-width: 900px){.stzh-pi-menu__nav-item{padding-top:var(--stzh-space-xsmall)}}@media screen and (min-width: 1260px){.stzh-pi-menu__nav-item{padding-top:var(--stzh-space-small)}}@media screen and (min-width: 600px){.stzh-pi-menu__nav-item{padding-right:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-pi-menu__nav-item{padding-right:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-pi-menu__nav-item{padding-right:var(--stzh-space-xxlarge)}}@media screen and (min-width: 900px){.stzh-pi-menu__nav-item{padding-bottom:var(--stzh-space-xsmall)}}@media screen and (min-width: 1260px){.stzh-pi-menu__nav-item{padding-bottom:var(--stzh-space-small)}}@media screen and (min-width: 900px){.stzh-pi-menu__nav-item{padding-top:var(--stzh-space-xsmall)}}@media screen and (min-width: 1260px){.stzh-pi-menu__nav-item{padding-top:var(--stzh-space-small)}}@media screen and (min-width: 600px){.stzh-pi-menu__nav-item{padding-right:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-pi-menu__nav-item{padding-right:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-pi-menu__nav-item{padding-right:var(--stzh-space-xxlarge)}}@media screen and (min-width: 900px){.stzh-pi-menu__nav-item{padding-bottom:var(--stzh-space-xsmall)}}@media screen and (min-width: 1260px){.stzh-pi-menu__nav-item{padding-bottom:var(--stzh-space-small)}}.stzh-pi-menu__nav-item:hover{color:var(--stzh-color-primary70)}.stzh-pi-menu__nav-item.active{background-color:var(--stzh-color-primary30)}.stzh-pi-menu__nav-item.is-level-1{font-family:var(--stzh-font-family-heavy);font-weight:var(--stzh-font-weight-heavy);font-style:var(--stzh-font-style-heavy);padding:var(--stzh-space-small) var(--stzh-space-medium)}@media screen and (max-width: 899px){.stzh-pi-menu__nav-item.is-level-1{height:2.75rem;align-content:center}}@media screen and (min-width: 900px){.stzh-pi-menu__nav-item.is-level-1{padding-left:var(--stzh-space-small);padding-right:var(--stzh-space-small)}}@media screen and (min-width: 1600px){.stzh-pi-menu__nav-item.is-level-1{padding-left:calc((100vw - 100rem) / 2 + var(--stzh-space-medium));padding-right:var(--stzh-space-medium)}}.stzh-pi-menu__nav-item.is-level-2{line-height:var(--stzh-space-xlarge);padding:var(--stzh-space-xsmall) var(--stzh-space-xxlarge)}@media screen and (min-width: 900px){.stzh-pi-menu__nav-item.is-level-2{padding-left:var(--stzh-space-xlarge);padding-right:var(--stzh-space-xlarge)}}@media screen and (min-width: 1600px){.stzh-pi-menu__nav-item.is-level-2{padding-left:calc((100vw - 100rem) / 2 + var(--stzh-space-xxlarge));padding-right:var(--stzh-space-xxlarge)}}.stzh-pi-menu__button-space-helper{visibility:hidden;pointer-events:none}.stzh-pi-menu--is-open .stzh-pi-menu__button-icon{transform:rotate(180deg)}.stzh-pi-menu--is-open .stzh-pi-menu__content-inner{overflow-y:auto;height:calc(100vh - 4rem)}";
 const StzhPiMenuStyle0 = stzhPiMenuCss;
@@ -263,7 +263,7 @@ const StzhPiMenu$1 = /*@__PURE__*/ proxyCustomElement(class StzhPiMenu extends H
         // Screens medium, large and ultra
         const wideScreens = `${this.entangledMenuSize}px`;
         const menuWidth = this.open ? (this.isMedium ? wideScreens : narrowScreens) : this.isMedium ? wideScreens : closed;
-        return (h(Host, { key: '8d814a8e0e79688c18cf252a97027944664eaeee', tabindex: this.rootTabindex, onFocus: this.onRootFocus }, h("div", { key: 'e4048c92028b18c3a6e2bd0a33200b80cbf63bef', class: "stzh-pi-menu-positioner" }, h("div", { key: '58cba2e20480c28bea85e7268370aeb686785f2f', class: classes, style: { width: menuWidth } }, h("div", { key: '427a08f026aa5f274e6358e44e21d01754c88322', class: backdropClasses, onClick: this.handleBackdropClick }), h(Heading, { key: '9e3b71a442ad935930fa47961dfcce387220dd27', class: "stzh-pi-menu__heading", onClick: this.handleHeaderClick }, h("button", { key: '76e742716dc800c260ad509413efa3abcf2b7b1c', ref: el => (this.buttonElement = el), class: "stzh-pi-menu__button", "aria-expanded": `${this.open ? "true" : "false"}`, type: "button", "s-object-id": this.analyticsId || this.heading }, h("span", { key: 'd907834e673e9838d75120b239f3bba9574cbf43', class: "stzh-pi-menu__button-text" }, this.heading), h("stzh-icon", { key: 'a0aee001981739d866c75673f4e9739b299aa9f9', name: "angle-down", class: "stzh-pi-menu__button-icon" }))), h("div", { key: 'f48db0525c4aa919af26b0b102e187b0fba12175', id: `${this.piMenuId}-content`, ref: el => (this.bodyElement = el), class: "stzh-pi-menu__content", "aria-labelledby": `${this.piMenuId}-header`, role: "region" }, h("div", { key: '7d601e993e68d909bada6b7f73690b4b544d5f94', class: "stzh-pi-menu__content-inner" }, h("nav", { key: '16f78af2613d5d627ae425012e8ace36788d9c37', class: "stzh-pi-menu__nav", "aria-label": this.localization.menuLabel }, this.subheading && h("p", { key: '861ad618e88385525ce7455e3c3c3eeeb085ca97', class: "stzh-pi-menu__subheading" }, this.subheading), h("ul", { key: '3c57f05aa34ab8c0900c41f61beba7ad28dca17e', class: "stzh-pi-menu__nav-list is-level-1" }, this._menuItems.map((item, index) => (h("li", { class: "stzh-pi-menu__nav-list-item" }, this.isMedium || this.isLarge || this.isUltra ? (h("div", null, this.setSubMenuHeader(item), this.setSubMenuItems(item))) : (h("stzh-details", { open: index === 0 }, this.setSubMenuHeader(item), h("div", { slot: "content" }, this.setSubMenuItems(item)))))))))))), h("button", { key: 'fb870cbd1098cab33cdcd3a641146cd591bde3bc', class: "stzh-pi-menu__button stzh-pi-menu__button-space-helper", "aria-hidden": "true", type: "button" }, h("span", { key: 'f4073640a70396980e8d3a3305dbd58858cc7ead', class: "stzh-pi-menu__button-text" }, h("span", { key: '90c703747d6ac6fb8849bfb207a2c1fffe660cf5', class: "stzh-pi-menu__heading-text" }, this.heading)), h("stzh-icon", { key: '21cdf06321e37b291f4c32fda90c75b86d918ffe', name: "angle-down", class: "stzh-pi-menu__button-icon" })))));
+        return (h(Host, { key: '57045684e2f4a2ad5559d0a531b77d1bb3e13fcc', tabindex: this.rootTabindex, onFocus: this.onRootFocus }, h("div", { key: '42c42aa79045f7df2899fe837fee2f447a67d99b', class: "stzh-pi-menu-positioner" }, h("div", { key: 'dcb487d0a8c093aa51403b204e33ad5a4d89682f', class: classes, style: { width: menuWidth } }, h("div", { key: '49bd807628e73a723b2a6ff2088f30315eee2131', class: backdropClasses, onClick: this.handleBackdropClick }), h(Heading, { key: 'b85e45447c9ea90347107a8dbca3c925aa5c2315', class: "stzh-pi-menu__heading", onClick: this.handleHeaderClick }, h("button", { key: '42082f63ea72df85dd0d196383a4c9407b28caeb', ref: el => (this.buttonElement = el), class: "stzh-pi-menu__button", "aria-expanded": `${this.open ? "true" : "false"}`, type: "button", "s-object-id": this.analyticsId || this.heading }, h("span", { key: '64717628f0b735ebd05447efd2880f2c30d2b190', class: "stzh-pi-menu__button-text" }, this.heading), h("stzh-icon", { key: 'b727aef4cfd5bfffd7d8332d214db3062e6b85c7', name: "angle-down", class: "stzh-pi-menu__button-icon" }))), h("div", { key: 'fd1eb0ba81ab4853f7404777aab058280227f6e3', id: `${this.piMenuId}-content`, ref: el => (this.bodyElement = el), class: "stzh-pi-menu__content", "aria-labelledby": `${this.piMenuId}-header`, role: "region" }, h("div", { key: '684f545d9e82648acc98013ad52012eda80126de', class: "stzh-pi-menu__content-inner" }, h("nav", { key: '69d4e538668cd30c89b7b5054de0ecacb3f94d14', class: "stzh-pi-menu__nav", "aria-label": this.localization.menuLabel }, this.subheading && h("p", { key: '325c29a8d6b209ea46ca2c42eae6ba21386d8163', class: "stzh-pi-menu__subheading" }, this.subheading), h("ul", { key: 'e96fc4a6d795f42f7de769caa7503b312450c5e4', class: "stzh-pi-menu__nav-list is-level-1" }, this._menuItems.map((item, index) => (h("li", { class: "stzh-pi-menu__nav-list-item" }, this.isMedium || this.isLarge || this.isUltra ? (h("div", null, this.setSubMenuHeader(item), this.setSubMenuItems(item))) : (h("stzh-details", { open: index === 0 }, this.setSubMenuHeader(item), h("div", { slot: "content" }, this.setSubMenuItems(item)))))))))))), h("button", { key: 'a796b83c07871db48cdb79cf57f33fc45c463442', class: "stzh-pi-menu__button stzh-pi-menu__button-space-helper", "aria-hidden": "true", type: "button" }, h("span", { key: 'be9e79e611839893454186a68a384c887d8fdd5f', class: "stzh-pi-menu__button-text" }, h("span", { key: '24d7d0ad3f41dd70e887bff7e1d50a6297e8e369', class: "stzh-pi-menu__heading-text" }, this.heading)), h("stzh-icon", { key: 'a8a0ef3058c5b26000c6edfc68f2935c578058df', name: "angle-down", class: "stzh-pi-menu__button-icon" })))));
     }
     get element() { return this; }
     static get watchers() { return {

package/dist/components/stzh-pi-pagetitle.js

@@ -1,6 +1,6 @@
 import { p as proxyCustomElement, H, h, d as Host } from './p-8f01554b.js';
 import { s as setPropsIfNull, h as hasSlot } from './p-289f5de2.js';
-import { d as defineCustomElement$2 } from './p-527121ef.js';
+import { d as defineCustomElement$2 } from './p-36fb6c94.js';
 
 const stzhPiPagetitleCss = ".sc-stzh-pi-pagetitle-h{font-family:var(--stzh-font-family-medium);font-weight:var(--stzh-font-weight-medium);font-style:var(--stzh-font-style-medium);color:var(--stzh-base-color);box-sizing:border-box;display:block}[hidden].sc-stzh-pi-pagetitle-h,[stzh-hidden].sc-stzh-pi-pagetitle-h{display:none}.sc-stzh-pi-pagetitle-h::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-pi-pagetitle-h *.sc-stzh-pi-pagetitle,.sc-stzh-pi-pagetitle-h *.sc-stzh-pi-pagetitle::before,.sc-stzh-pi-pagetitle-h *.sc-stzh-pi-pagetitle::after{box-sizing:border-box;text-underline-offset:var(--stzh-link-text-underline-offset);text-decoration-thickness:var(--stzh-link-text-decoration-thickness);-webkit-text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink);text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink)}.sc-stzh-pi-pagetitle-h .has-focus.sc-stzh-pi-pagetitle{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}.sc-stzh-pi-pagetitle-h .stzh-fylingfocus-focused.sc-stzh-pi-pagetitle{outline-style:none !important}.sc-stzh-pi-pagetitle-h .stzh-fylingfocus-focused.sc-stzh-pi-pagetitle::-moz-focus-inner{border:0 !important}.sc-stzh-pi-pagetitle-h{--hero-background-color:var(\n    --stzh-pi-pagetitle-hero-background-color,\n    var(--stzh-color-primary10)\n  );--lead-background-color:var(\n    --stzh-pi-pagetitle-lead-background-color,\n    var(--stzh-color-primary40)\n  );--background-color:var(\n    --stzh-pi-pagetitle-background-color,\n    var(--stzh-color-coolgrey10)\n  );--grid-template-areas:\"hero hero hero hero\"\n    \"image-lead-menu image-lead-menu image-lead-menu image-lead-menu\"}@media screen and (min-width: 600px){.sc-stzh-pi-pagetitle-h{--grid-template-areas:\". hero hero hero\"\n      \"image-lead-menu image-lead-menu image-lead-menu image-lead-menu\"}}@media screen and (min-width: 900px){.sc-stzh-pi-pagetitle-h{--grid-template-areas:\". . hero hero hero hero hero hero\"\n      \"image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu\"}}@media screen and (min-width: 1260px){.sc-stzh-pi-pagetitle-h{--grid-template-areas:\". . hero hero hero hero hero hero hero hero hero .\"\n      \"image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu\"}}@media screen and (min-width: 1600px){.sc-stzh-pi-pagetitle-h{--grid-template-areas:\". . hero hero hero hero hero hero hero . . .\"\n      \"image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu\"}}.sc-stzh-pi-pagetitle-h.sc-stzh-pi-pagetitle-s>[slot=dateline],.sc-stzh-pi-pagetitle-h .sc-stzh-pi-pagetitle-s>[slot=dateline]{font-size:var(--stzh-font-milli-font-size);line-height:var(--stzh-font-milli-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing);font-family:var(--stzh-font-family-heavy);font-weight:var(--stzh-font-weight-heavy);font-style:var(--stzh-font-style-heavy);--color:var(--stzh-color-black80op)}.sc-stzh-pi-pagetitle-h.sc-stzh-pi-pagetitle-s>[slot=heading],.sc-stzh-pi-pagetitle-h .sc-stzh-pi-pagetitle-s>[slot=heading],.sc-stzh-pi-pagetitle-h.sc-stzh-pi-pagetitle-s>[slot=lead] *,.sc-stzh-pi-pagetitle-h .sc-stzh-pi-pagetitle-s>[slot=lead] *,.sc-stzh-pi-pagetitle-h.sc-stzh-pi-pagetitle-s>[slot=breadcrumb],.sc-stzh-pi-pagetitle-h .sc-stzh-pi-pagetitle-s>[slot=breadcrumb]{--color:var(--stzh-color-black)}.sc-stzh-pi-pagetitle-h.sc-stzh-pi-pagetitle-s>[slot=menu],.sc-stzh-pi-pagetitle-h .sc-stzh-pi-pagetitle-s>[slot=menu]{--stzh-pi-menu-padding-left:1.25rem}@media screen and (min-width: 600px){.sc-stzh-pi-pagetitle-h.sc-stzh-pi-pagetitle-s>[slot=menu],.sc-stzh-pi-pagetitle-h .sc-stzh-pi-pagetitle-s>[slot=menu]{--stzh-pi-menu-padding-left:2rem}}@media screen and (min-width: 1260px){.sc-stzh-pi-pagetitle-h.sc-stzh-pi-pagetitle-s>[slot=menu],.sc-stzh-pi-pagetitle-h .sc-stzh-pi-pagetitle-s>[slot=menu]{--stzh-pi-menu-padding-left:4rem}}@media screen and (min-width: 1600px){.sc-stzh-pi-pagetitle-h.sc-stzh-pi-pagetitle-s>[slot=menu],.sc-stzh-pi-pagetitle-h .sc-stzh-pi-pagetitle-s>[slot=menu]{--stzh-pi-menu-padding-left:calc((100vw - 84.25rem) / 2)}}.stzh-pi-pagetitle.sc-stzh-pi-pagetitle{margin-bottom:var(--stzh-space-xxlarge);margin-bottom:var(--stzh-space-xxlarge)}@media screen and (min-width: 900px){.stzh-pi-pagetitle.sc-stzh-pi-pagetitle{margin-bottom:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle.sc-stzh-pi-pagetitle{margin-bottom:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 900px){.stzh-pi-pagetitle.sc-stzh-pi-pagetitle{margin-bottom:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle.sc-stzh-pi-pagetitle{margin-bottom:var(--stzh-space-xxxxlarge)}}.stzh-pi-pagetitle__hero-container.sc-stzh-pi-pagetitle{column-gap:var(--stzh-grid-gutter);display:grid;grid-template-columns:repeat(4, minmax(0, 1fr));grid-template-areas:var(--grid-template-areas);background-color:var(--hero-background-color);padding-top:var(--stzh-space-medium);padding-top:var(--stzh-space-medium);padding-left:1.25rem;padding-right:1.25rem}@media screen and (min-width: 600px){.stzh-pi-pagetitle__hero-container.sc-stzh-pi-pagetitle{column-gap:var(--stzh-grid-gutter-small)}}@media screen and (min-width: 900px){.stzh-pi-pagetitle__hero-container.sc-stzh-pi-pagetitle{column-gap:var(--stzh-grid-gutter-medium)}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle__hero-container.sc-stzh-pi-pagetitle{column-gap:var(--stzh-grid-gutter-large)}}@media screen and (min-width: 1600px){.stzh-pi-pagetitle__hero-container.sc-stzh-pi-pagetitle{column-gap:var(--stzh-grid-gutter-ultra)}}@media screen and (min-width: 900px){.stzh-pi-pagetitle__hero-container.sc-stzh-pi-pagetitle{grid-template-columns:repeat(8, minmax(0, 1fr))}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle__hero-container.sc-stzh-pi-pagetitle{grid-template-columns:repeat(12, minmax(0, 1fr))}}@media screen and (min-width: 600px){.stzh-pi-pagetitle__hero-container.sc-stzh-pi-pagetitle{padding-top:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-pi-pagetitle__hero-container.sc-stzh-pi-pagetitle{padding-top:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle__hero-container.sc-stzh-pi-pagetitle{padding-top:var(--stzh-space-xxlarge)}}@media screen and (min-width: 600px){.stzh-pi-pagetitle__hero-container.sc-stzh-pi-pagetitle{padding-top:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-pi-pagetitle__hero-container.sc-stzh-pi-pagetitle{padding-top:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle__hero-container.sc-stzh-pi-pagetitle{padding-top:var(--stzh-space-xxlarge)}}@media screen and (min-width: 600px){.stzh-pi-pagetitle__hero-container.sc-stzh-pi-pagetitle{padding-left:2rem;padding-right:2rem}}@media screen and (min-width: 900px){.stzh-pi-pagetitle__hero-container.sc-stzh-pi-pagetitle{padding-left:2.5rem;padding-right:2.5rem}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle__hero-container.sc-stzh-pi-pagetitle{padding-left:4rem;padding-right:4rem}}@media screen and (min-width: 1600px){.stzh-pi-pagetitle__hero-container.sc-stzh-pi-pagetitle{padding-left:calc((100vw - 84.25rem) / 2);padding-right:calc((100vw - 84.25rem) / 2)}}.stzh-pi-pagetitle__image-lead-menu-container.sc-stzh-pi-pagetitle{column-gap:var(--stzh-grid-gutter);display:grid;grid-template-columns:repeat(4, minmax(0, 1fr));grid-template-areas:var(--grid-template-areas);background-color:var(--hero-background-color)}@media screen and (min-width: 600px){.stzh-pi-pagetitle__image-lead-menu-container.sc-stzh-pi-pagetitle{column-gap:var(--stzh-grid-gutter-small)}}@media screen and (min-width: 900px){.stzh-pi-pagetitle__image-lead-menu-container.sc-stzh-pi-pagetitle{column-gap:var(--stzh-grid-gutter-medium)}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle__image-lead-menu-container.sc-stzh-pi-pagetitle{column-gap:var(--stzh-grid-gutter-large)}}@media screen and (min-width: 1600px){.stzh-pi-pagetitle__image-lead-menu-container.sc-stzh-pi-pagetitle{column-gap:var(--stzh-grid-gutter-ultra)}}@media screen and (min-width: 900px){.stzh-pi-pagetitle__image-lead-menu-container.sc-stzh-pi-pagetitle{grid-template-columns:repeat(8, minmax(0, 1fr))}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle__image-lead-menu-container.sc-stzh-pi-pagetitle{grid-template-columns:repeat(12, minmax(0, 1fr))}}@media screen and (min-width: 900px){.stzh-pi-pagetitle__image-lead-menu-container.sc-stzh-pi-pagetitle{padding-left:1.25rem;padding-right:1.25rem}}@media screen and (min-width: 900px) and (min-width: 600px){.stzh-pi-pagetitle__image-lead-menu-container.sc-stzh-pi-pagetitle{padding-left:2rem;padding-right:2rem}}@media screen and (min-width: 900px) and (min-width: 900px){.stzh-pi-pagetitle__image-lead-menu-container.sc-stzh-pi-pagetitle{padding-left:2.5rem;padding-right:2.5rem}}@media screen and (min-width: 900px) and (min-width: 1260px){.stzh-pi-pagetitle__image-lead-menu-container.sc-stzh-pi-pagetitle{padding-left:4rem;padding-right:4rem}}@media screen and (min-width: 900px) and (min-width: 1600px){.stzh-pi-pagetitle__image-lead-menu-container.sc-stzh-pi-pagetitle{padding-left:calc((100vw - 84.25rem) / 2);padding-right:calc((100vw - 84.25rem) / 2)}}.stzh-pi-pagetitle__lead-container.sc-stzh-pi-pagetitle{column-gap:var(--stzh-grid-gutter);display:grid;grid-template-columns:repeat(4, minmax(0, 1fr));grid-template-areas:\"lead lead lead lead\";background-color:var(--lead-background-color);padding-left:1.25rem;padding-right:1.25rem}@media screen and (min-width: 600px){.stzh-pi-pagetitle__lead-container.sc-stzh-pi-pagetitle{column-gap:var(--stzh-grid-gutter-small)}}@media screen and (min-width: 900px){.stzh-pi-pagetitle__lead-container.sc-stzh-pi-pagetitle{column-gap:var(--stzh-grid-gutter-medium)}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle__lead-container.sc-stzh-pi-pagetitle{column-gap:var(--stzh-grid-gutter-large)}}@media screen and (min-width: 1600px){.stzh-pi-pagetitle__lead-container.sc-stzh-pi-pagetitle{column-gap:var(--stzh-grid-gutter-ultra)}}@media screen and (min-width: 900px){.stzh-pi-pagetitle__lead-container.sc-stzh-pi-pagetitle{grid-template-columns:repeat(8, minmax(0, 1fr))}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle__lead-container.sc-stzh-pi-pagetitle{grid-template-columns:repeat(12, minmax(0, 1fr))}}@media screen and (min-width: 600px){.stzh-pi-pagetitle__lead-container.sc-stzh-pi-pagetitle{padding-left:2rem;padding-right:2rem}}@media screen and (min-width: 900px){.stzh-pi-pagetitle__lead-container.sc-stzh-pi-pagetitle{padding-left:2.5rem;padding-right:2.5rem}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle__lead-container.sc-stzh-pi-pagetitle{padding-left:4rem;padding-right:4rem}}@media screen and (min-width: 1600px){.stzh-pi-pagetitle__lead-container.sc-stzh-pi-pagetitle{padding-left:calc((100vw - 84.25rem) / 2);padding-right:calc((100vw - 84.25rem) / 2)}}@media screen and (min-width: 900px){.stzh-pi-pagetitle__lead-container.sc-stzh-pi-pagetitle{grid-template-areas:\". . lead lead lead lead lead lead\"}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle__lead-container.sc-stzh-pi-pagetitle{grid-template-areas:\". . . lead lead lead lead lead lead . . .\"}}.stzh-pi-pagetitle__image-lead-menu.sc-stzh-pi-pagetitle{grid-area:image-lead-menu;column-gap:var(--stzh-grid-gutter);display:grid;grid-template-columns:repeat(4, minmax(0, 1fr));grid-template-areas:\"image image image image\" \"lead lead lead lead\"}@media screen and (min-width: 600px){.stzh-pi-pagetitle__image-lead-menu.sc-stzh-pi-pagetitle{column-gap:var(--stzh-grid-gutter-small)}}@media screen and (min-width: 900px){.stzh-pi-pagetitle__image-lead-menu.sc-stzh-pi-pagetitle{column-gap:var(--stzh-grid-gutter-medium)}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle__image-lead-menu.sc-stzh-pi-pagetitle{column-gap:var(--stzh-grid-gutter-large)}}@media screen and (min-width: 1600px){.stzh-pi-pagetitle__image-lead-menu.sc-stzh-pi-pagetitle{column-gap:var(--stzh-grid-gutter-ultra)}}@media screen and (min-width: 900px){.stzh-pi-pagetitle__image-lead-menu.sc-stzh-pi-pagetitle{grid-template-columns:repeat(8, minmax(0, 1fr))}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle__image-lead-menu.sc-stzh-pi-pagetitle{grid-template-columns:repeat(12, minmax(0, 1fr))}}@media screen and (min-width: 900px){.stzh-pi-pagetitle__image-lead-menu.sc-stzh-pi-pagetitle{grid-template-areas:\". . image image image image image image\" \"lead lead lead lead lead lead lead lead\"}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle__image-lead-menu.sc-stzh-pi-pagetitle{grid-template-areas:\". . . image image image image image image image image image\" \"lead lead lead lead lead lead lead lead lead lead lead lead\"}}.stzh-pi-pagetitle__hero.sc-stzh-pi-pagetitle{grid-area:hero}.stzh-pi-pagetitle__menu.sc-stzh-pi-pagetitle{display:none;grid-column:1/2;grid-row:1/2;position:relative;z-index:2}@media screen and (min-width: 900px){.stzh-pi-pagetitle__menu.sc-stzh-pi-pagetitle{grid-column:1/3;grid-row:1/2}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle__menu.sc-stzh-pi-pagetitle{grid-column:1/3;grid-row:1/2}}.stzh-pi-pagetitle__image.sc-stzh-pi-pagetitle{grid-column:1/-1;grid-row:1/2;z-index:1}@media screen and (min-width: 900px){.stzh-pi-pagetitle__image.sc-stzh-pi-pagetitle{margin-right:-2.5rem;grid-column:3/-1;grid-row:1/2}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle__image.sc-stzh-pi-pagetitle{margin-right:-4rem}}@media screen and (min-width: 1600px){.stzh-pi-pagetitle__image.sc-stzh-pi-pagetitle{margin-right:calc((100vw - 84.25rem) / -2)}}.stzh-pi-pagetitle__lead.sc-stzh-pi-pagetitle{--stzh-base-lead-color:var(--stzh-heading-color);grid-column:1/-1;grid-row:2/4;z-index:1;background-color:var(--lead-background-color);padding-top:var(--stzh-space-medium);padding-bottom:var(--stzh-space-medium)}@media screen and (min-width: 600px){.stzh-pi-pagetitle__lead.sc-stzh-pi-pagetitle{padding-top:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-pi-pagetitle__lead.sc-stzh-pi-pagetitle{padding-top:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle__lead.sc-stzh-pi-pagetitle{padding-top:var(--stzh-space-xxlarge)}}@media screen and (min-width: 600px){.stzh-pi-pagetitle__lead.sc-stzh-pi-pagetitle{padding-bottom:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-pi-pagetitle__lead.sc-stzh-pi-pagetitle{padding-bottom:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle__lead.sc-stzh-pi-pagetitle{padding-bottom:var(--stzh-space-xxlarge)}}@media screen and (min-width: 900px){.stzh-pi-pagetitle__lead.sc-stzh-pi-pagetitle{grid-column:3/-1;grid-row:2/-1}}.stzh-pi-pagetitle__text.sc-stzh-pi-pagetitle{padding-top:var(--stzh-space-xxlarge);padding-bottom:var(--stzh-space-xxlarge);display:flex;flex-direction:column;justify-content:center}@media screen and (min-width: 600px){.stzh-pi-pagetitle__text.sc-stzh-pi-pagetitle{padding-top:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 900px){.stzh-pi-pagetitle__text.sc-stzh-pi-pagetitle{padding-top:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle__text.sc-stzh-pi-pagetitle{padding-top:var(--stzh-space-xbig)}}@media screen and (min-width: 600px){.stzh-pi-pagetitle__text.sc-stzh-pi-pagetitle{padding-bottom:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 900px){.stzh-pi-pagetitle__text.sc-stzh-pi-pagetitle{padding-bottom:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle__text.sc-stzh-pi-pagetitle{padding-bottom:var(--stzh-space-xbig)}}.stzh-pi-pagetitle__meta.sc-stzh-pi-pagetitle{display:flex;flex-direction:column-reverse;row-gap:var(--stzh-space-xsmall)}@media screen and (min-width: 900px){.stzh-pi-pagetitle__meta.sc-stzh-pi-pagetitle{flex-direction:row}}.stzh-pi-pagetitle__readspeaker.sc-stzh-pi-pagetitle{margin-bottom:var(--stzh-space-medium)}@media screen and (min-width: 600px){.stzh-pi-pagetitle__readspeaker.sc-stzh-pi-pagetitle{margin-bottom:var(--stzh-space-large)}}@media screen and (min-width: 600px) and (max-width: 899px){.stzh-pi-pagetitle__readspeaker.sc-stzh-pi-pagetitle{--stzh-readspeaker-dropdown-position:relative;--stzh-readspeaker-dropdown-top:auto}}.stzh-pi-pagetitle__dateline.sc-stzh-pi-pagetitle{margin-bottom:var(--stzh-space-xxsmall)}.stzh-pi-pagetitle__breadcrumbs.sc-stzh-pi-pagetitle{margin-bottom:var(--stzh-space-medium)}@media screen and (min-width: 600px){.stzh-pi-pagetitle__breadcrumbs.sc-stzh-pi-pagetitle{margin-bottom:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-pi-pagetitle__breadcrumbs.sc-stzh-pi-pagetitle{margin-bottom:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle__breadcrumbs.sc-stzh-pi-pagetitle{margin-bottom:var(--stzh-space-xxlarge)}}.stzh-pi-pagetitle__heading.sc-stzh-pi-pagetitle{margin-bottom:var(--stzh-space-medium)}@media screen and (min-width: 600px){.stzh-pi-pagetitle__heading.sc-stzh-pi-pagetitle{margin-bottom:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-pi-pagetitle__heading.sc-stzh-pi-pagetitle{margin-bottom:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle__heading.sc-stzh-pi-pagetitle{margin-bottom:var(--stzh-space-xxlarge)}}@media screen and (min-width: 900px){.stzh-pi-pagetitle__menu-inner.sc-stzh-pi-pagetitle{position:absolute;top:0;right:0;bottom:0;left:0}}.stzh-pi-pagetitle__article-info-wrapper.sc-stzh-pi-pagetitle{margin-left:1.25rem;margin-right:1.25rem;padding-top:var(--stzh-space-xxlarge);column-gap:var(--stzh-grid-gutter);display:grid;grid-template-columns:repeat(4, minmax(0, 1fr));grid-template-areas:\"article-info article-info article-info article-info\"}@media screen and (min-width: 600px){.stzh-pi-pagetitle__article-info-wrapper.sc-stzh-pi-pagetitle{margin-left:2rem;margin-right:2rem}}@media screen and (min-width: 900px){.stzh-pi-pagetitle__article-info-wrapper.sc-stzh-pi-pagetitle{margin-left:2.5rem;margin-right:2.5rem}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle__article-info-wrapper.sc-stzh-pi-pagetitle{margin-left:4rem;margin-right:4rem}}@media screen and (min-width: 1600px){.stzh-pi-pagetitle__article-info-wrapper.sc-stzh-pi-pagetitle{margin-left:auto;margin-right:auto;max-width:84.25rem}}@media screen and (min-width: 900px){.stzh-pi-pagetitle__article-info-wrapper.sc-stzh-pi-pagetitle{padding-top:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle__article-info-wrapper.sc-stzh-pi-pagetitle{padding-top:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 600px){.stzh-pi-pagetitle__article-info-wrapper.sc-stzh-pi-pagetitle{column-gap:var(--stzh-grid-gutter-small)}}@media screen and (min-width: 900px){.stzh-pi-pagetitle__article-info-wrapper.sc-stzh-pi-pagetitle{column-gap:var(--stzh-grid-gutter-medium)}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle__article-info-wrapper.sc-stzh-pi-pagetitle{column-gap:var(--stzh-grid-gutter-large)}}@media screen and (min-width: 1600px){.stzh-pi-pagetitle__article-info-wrapper.sc-stzh-pi-pagetitle{column-gap:var(--stzh-grid-gutter-ultra)}}@media screen and (min-width: 900px){.stzh-pi-pagetitle__article-info-wrapper.sc-stzh-pi-pagetitle{grid-template-columns:repeat(8, minmax(0, 1fr))}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle__article-info-wrapper.sc-stzh-pi-pagetitle{grid-template-columns:repeat(12, minmax(0, 1fr))}}@media screen and (min-width: 900px){.stzh-pi-pagetitle__article-info-wrapper.sc-stzh-pi-pagetitle{grid-template-areas:\". . article-info article-info article-info article-info article-info article-info\"}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle__article-info-wrapper.sc-stzh-pi-pagetitle{grid-template-areas:\". . article-info article-info article-info article-info article-info article-info article-info article-info article-info article-info\"}}.stzh-pi-pagetitle__article-info.sc-stzh-pi-pagetitle{grid-area:article-info}@media screen and (min-width: 900px){.stzh-pi-pagetitle__article-info-holder.sc-stzh-pi-pagetitle{padding-left:var(--stzh-space-medium)}}@media screen and (min-width: 900px) and (min-width: 600px){.stzh-pi-pagetitle__article-info-holder.sc-stzh-pi-pagetitle{padding-left:var(--stzh-space-large)}}@media screen and (min-width: 900px) and (min-width: 900px){.stzh-pi-pagetitle__article-info-holder.sc-stzh-pi-pagetitle{padding-left:var(--stzh-space-xlarge)}}@media screen and (min-width: 900px) and (min-width: 1260px){.stzh-pi-pagetitle__article-info-holder.sc-stzh-pi-pagetitle{padding-left:var(--stzh-space-xxlarge)}}.stzh-pi-pagetitle__author.sc-stzh-pi-pagetitle{margin-top:0;margin-bottom:var(--stzh-space-xxsmall);color:var(--stzh-color-coolgrey70);font-family:var(--stzh-font-family-heavy);font-weight:var(--stzh-font-weight-heavy);font-style:var(--stzh-font-style-heavy);font-size:var(--stzh-font-curve-p1-default-font-size, var(--stzh-font-milli-font-size));line-height:var(--stzh-font-curve-p1-default-text-line-height, var(--stzh-font-milli-text-line-height));letter-spacing:var(--stzh-font-curve-p1-default-text-letter-spacing)}@media screen and (min-width: 900px){.stzh-pi-pagetitle__author.sc-stzh-pi-pagetitle{font-size:var(--stzh-font-curve-p1-medium-font-size, var(--stzh-font-centi-font-size));line-height:var(--stzh-font-curve-p1-medium-text-line-height, var(--stzh-font-centi-text-line-height));letter-spacing:var(--stzh-font-curve-p1-medium-text-letter-spacing)}}.stzh-pi-pagetitle__date.sc-stzh-pi-pagetitle{margin:0;font-size:var(--stzh-font-curve-p1-default-font-size, var(--stzh-font-milli-font-size));line-height:var(--stzh-font-curve-p1-default-text-line-height, var(--stzh-font-milli-text-line-height));letter-spacing:var(--stzh-font-curve-p1-default-text-letter-spacing)}@media screen and (min-width: 900px){.stzh-pi-pagetitle__date.sc-stzh-pi-pagetitle{font-size:var(--stzh-font-curve-p1-medium-font-size, var(--stzh-font-centi-font-size));line-height:var(--stzh-font-curve-p1-medium-text-line-height, var(--stzh-font-centi-text-line-height));letter-spacing:var(--stzh-font-curve-p1-medium-text-letter-spacing)}}.stzh-pi-pagetitle--has-menu.sc-stzh-pi-pagetitle .stzh-pi-pagetitle__image-lead-menu.sc-stzh-pi-pagetitle{grid-template-columns:auto repeat(3, minmax(0, 1fr))}@media screen and (min-width: 900px){.stzh-pi-pagetitle--has-menu.sc-stzh-pi-pagetitle .stzh-pi-pagetitle__image-lead-menu.sc-stzh-pi-pagetitle{grid-template-columns:repeat(8, minmax(0, 1fr))}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle--has-menu.sc-stzh-pi-pagetitle .stzh-pi-pagetitle__image-lead-menu.sc-stzh-pi-pagetitle{grid-template-columns:repeat(12, minmax(0, 1fr))}}.stzh-pi-pagetitle--has-menu.sc-stzh-pi-pagetitle .stzh-pi-pagetitle__image-lead-menu-container.sc-stzh-pi-pagetitle{background-color:transparent}@media screen and (max-width: 899px){.stzh-pi-pagetitle--has-menu.sc-stzh-pi-pagetitle .stzh-pi-pagetitle__image-lead-menu-container.sc-stzh-pi-pagetitle{background-color:var(--lead-background-color)}}.stzh-pi-pagetitle--has-menu.sc-stzh-pi-pagetitle .stzh-pi-pagetitle__menu.sc-stzh-pi-pagetitle{position:relative;display:inherit;margin-right:calc(var(--stzh-grid-gutter) * -1)}@media screen and (min-width: 600px){.stzh-pi-pagetitle--has-menu.sc-stzh-pi-pagetitle .stzh-pi-pagetitle__menu.sc-stzh-pi-pagetitle{margin-right:calc(var(--stzh-grid-gutter-small) * -1)}}@media screen and (min-width: 900px){.stzh-pi-pagetitle--has-menu.sc-stzh-pi-pagetitle .stzh-pi-pagetitle__menu.sc-stzh-pi-pagetitle{margin-right:calc(var(--stzh-grid-gutter-medium) * -1);margin-left:-2.5rem}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle--has-menu.sc-stzh-pi-pagetitle .stzh-pi-pagetitle__menu.sc-stzh-pi-pagetitle{margin-right:calc(var(--stzh-grid-gutter-large) * -1);margin-left:-4rem}}@media screen and (min-width: 1600px){.stzh-pi-pagetitle--has-menu.sc-stzh-pi-pagetitle .stzh-pi-pagetitle__menu.sc-stzh-pi-pagetitle{margin-right:calc(var(--stzh-grid-gutter-ultra) * -1);margin-left:calc((100vw - 84.25rem) / -2)}}.stzh-pi-pagetitle--has-menu.sc-stzh-pi-pagetitle .stzh-pi-pagetitle__lead.sc-stzh-pi-pagetitle{padding-left:var(--stzh-space-medium)}@media screen and (min-width: 600px){.stzh-pi-pagetitle--has-menu.sc-stzh-pi-pagetitle .stzh-pi-pagetitle__lead.sc-stzh-pi-pagetitle{padding-left:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-pi-pagetitle--has-menu.sc-stzh-pi-pagetitle .stzh-pi-pagetitle__lead.sc-stzh-pi-pagetitle{padding-left:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle--has-menu.sc-stzh-pi-pagetitle .stzh-pi-pagetitle__lead.sc-stzh-pi-pagetitle{padding-left:var(--stzh-space-xxlarge)}}@media screen and (min-width: 900px){.stzh-pi-pagetitle--has-menu.sc-stzh-pi-pagetitle .stzh-pi-pagetitle__lead.sc-stzh-pi-pagetitle{margin-right:-2.5rem;padding-right:2.5rem}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle--has-menu.sc-stzh-pi-pagetitle .stzh-pi-pagetitle__lead.sc-stzh-pi-pagetitle{margin-right:-4rem;padding-right:4rem}}@media screen and (min-width: 1600px){.stzh-pi-pagetitle--has-menu.sc-stzh-pi-pagetitle .stzh-pi-pagetitle__lead.sc-stzh-pi-pagetitle{margin-right:calc((100vw - 84.25rem) / -2);padding-right:calc((100vw - 84.25rem) / 2)}}.stzh-pi-pagetitle--has-meta.sc-stzh-pi-pagetitle .stzh-pi-pagetitle__text.sc-stzh-pi-pagetitle{padding-top:var(--stzh-space-medium)}@media screen and (min-width: 600px){.stzh-pi-pagetitle--has-meta.sc-stzh-pi-pagetitle .stzh-pi-pagetitle__text.sc-stzh-pi-pagetitle{padding-top:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-pi-pagetitle--has-meta.sc-stzh-pi-pagetitle .stzh-pi-pagetitle__text.sc-stzh-pi-pagetitle{padding-top:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle--has-meta.sc-stzh-pi-pagetitle .stzh-pi-pagetitle__text.sc-stzh-pi-pagetitle{padding-top:var(--stzh-space-xxlarge)}}.stzh-pi-pagetitle--level-3.sc-stzh-pi-pagetitle,.stzh-pi-pagetitle--level-4.sc-stzh-pi-pagetitle{--hero-background-color:var(--stzh-color-coolgrey20);--lead-background-color:var(--stzh-color-coolgrey30)}.stzh-pi-pagetitle--hyphens.sc-stzh-pi-pagetitle .stzh-pi-pagetitle__heading.sc-stzh-pi-pagetitle{hyphens:auto}";
 const StzhPiPagetitleStyle0 = stzhPiPagetitleCss;
@@ -60,7 +60,7 @@ const StzhPiPagetitle$1 = /*@__PURE__*/ proxyCustomElement(class StzhPiPagetitle
             "stzh-pi-pagetitle--hyphens": this.hyphensEnabled,
             [`stzh-pi-pagetitle--level-${this.level}`]: !!this.level,
         };
-        return (h(Host, { key: 'bc1447bd906371534607883029d0fdafaac84865', "has-menu": menuSlotUsed, "has-article-info": hasArticleInfo }, h("div", { key: '2976ef10ec0a80e25447a706948df5e83bce96e4', class: classes }, h("div", { key: 'a643484b32794710eb3209eb30a464f2e6abd4f5', class: "stzh-pi-pagetitle__hero-container" }, h("div", { key: 'c7fb03253283621f30d744fd7b42bf88a7650aa7', class: "stzh-pi-pagetitle__hero" }, h("div", { key: '276a214f03d357f18601abb6573fd99fd492a89a', class: "stzh-pi-pagetitle__breadcrumbs" }, h("slot", { key: '1406af1abed10f1d4f19a25ca4889fd09a5dd594', name: "breadcrumb" })), h("div", { key: 'c02fd00abc4bb83333a392bcb6594e31a45e4733', class: "stzh-pi-pagetitle__meta" }, h("div", { key: '323c574c1b38891b9aea152fc0fde085ce645189', class: "stzh-pi-pagetitle__readspeaker" }, h("slot", { key: '023779d61f0f1726c7740726a5d5ad96db24837a', name: "readspeaker" }))), h("div", { key: 'a04c33680ba7bec7cd34b7e11d14e2761f75cf1e', class: "stzh-pi-pagetitle__dateline" }, h("slot", { key: '242c2ba331c2bd373970d3a36225acfa7ce55ca8', name: "dateline" })), h("div", { key: '2e4ea0b21f4ff9479b9a6c4ada9a355283fe3847', class: "stzh-pi-pagetitle__heading" }, h("slot", { key: 'bd4a74fbc65b05564abf7a0b88eee4c2ca523dbd', name: "heading" })))), h("div", { key: 'ee24ff47efc29d6fe1345ef7bfd08c697ccdcebb', class: "stzh-pi-pagetitle__image-lead-menu-container" }, h("div", { key: 'db6cb2a05c58b1189832d350160e943c4fb228a9', class: "stzh-pi-pagetitle__image-lead-menu" }, h("div", { key: 'bae5a9d6aa541bbd8c978b550f22bbecf92caab2', class: "stzh-pi-pagetitle__menu" }, menuSlotUsed && (h("div", { key: '64614f49e06acaa037f233a4b4361f5d0618f950', class: "stzh-pi-pagetitle__menu-inner" }, h("slot", { key: 'dbc9294e0a1ed5d65e2998aa1c956fed8355bf0b', name: "menu" })))), imageSlotUsed && (h("div", { key: '46cc40114e3d085f261e1244b2efe64fdc73073e', class: "stzh-pi-pagetitle__image" }, [1, 2].indexOf(this.level) > -1 && (h("div", { key: '2448c75b847ab9f4729aba5681c30bac615c6f9f', class: "stzh-pi-pagetitle__image-wrapper" }, h("stzh-ratio", { key: '01dcebc68d01b849f86073885564df8fb1ffdfcb', ratio: "16:9", ratioSmall: "21:9", class: "stzh-pi-pagetitle__ratio" }, h("slot", { key: '2b668c52975933f2294e6f3c87bcae85219d6044', name: "image" })))))), menuSlotUsed && (h("div", { key: 'a989167bc3a76e160b5cde9c06871948b65d0042', class: "stzh-pi-pagetitle__lead" }, h("slot", { key: 'bae28bb8353549eb9c4b4b9b3ce65aae911f07ca', name: "lead" }))))), !menuSlotUsed && (h("div", { key: '47657439842999b021bc4158c19b755f21ae8752', class: "stzh-pi-pagetitle__lead-container" }, h("div", { key: '5358eb381605b433ffd56793bd719ff3d1be9746', class: "stzh-pi-pagetitle__lead" }, h("slot", { key: '09dd20699f06cd5a77356f00d6db001264596f7c', name: "lead" })))), hasArticleInfo && (h("div", { key: '6087fc056609840d8f1ee629379c8da77440d035', class: "stzh-pi-pagetitle__article-info-wrapper" }, h("div", { key: 'ba08bb1cc82b8b13fb385a5b823ccf45d43c4252', class: "stzh-pi-pagetitle__article-info" }, h("div", { key: '1158c090072dc2090273d967e7bf2aaa22610272', class: "stzh-pi-pagetitle__article-info-holder" }, this.author && h("p", { key: 'd7bb67b16ad7404da9cb1b49df4921a681638fd1', class: "stzh-pi-pagetitle__author" }, this.author), this.date && h("p", { key: '615e3defa175315b194e2ebe8333f6d856327b24', class: "stzh-pi-pagetitle__date" }, this.date), h("slot", { key: '413b9e6f73c14b62ba6d752e644e0f928be4d7ca', name: "content" }))))))));
+        return (h(Host, { key: '517553d8fc2eccd4e392639972efd195cc13b82c', "has-menu": menuSlotUsed, "has-article-info": hasArticleInfo }, h("div", { key: '2c9b74f7594d4369ae717f3a0aa6221737818e37', class: classes }, h("div", { key: '6dbb9e4c7ef4125ef23884373700ca5510d5e2dc', class: "stzh-pi-pagetitle__hero-container" }, h("div", { key: '7d6590d75609755b9945181590a58e841ccb6a5d', class: "stzh-pi-pagetitle__hero" }, h("div", { key: 'efbac24ba586ef740b3fd012b653dacd571f8f87', class: "stzh-pi-pagetitle__breadcrumbs" }, h("slot", { key: '49ffdf90794fee13ac4098a7b7ab9ffffa022a00', name: "breadcrumb" })), h("div", { key: '87b59eafb444a76e740931ef533a17ef3dc7b378', class: "stzh-pi-pagetitle__meta" }, h("div", { key: '023f4c2a17340475e9a1bb99e5f9a7255b974cb2', class: "stzh-pi-pagetitle__readspeaker" }, h("slot", { key: 'f0f935fd4145be184f001899228e77d2d758e7a3', name: "readspeaker" }))), h("div", { key: '5b2800adf6b2e29621c5e0071daf3c6ead61f85c', class: "stzh-pi-pagetitle__dateline" }, h("slot", { key: 'e2b975fec524d79b1703c16bbdf59ca542173fec', name: "dateline" })), h("div", { key: 'f716648deb81197cb86ec57e153ef9533de7c739', class: "stzh-pi-pagetitle__heading" }, h("slot", { key: '29c5e4ef9226d7d5733c33d12232fee33f8044ae', name: "heading" })))), h("div", { key: 'd31ba15572bed4af76cd98acfef77998c297e805', class: "stzh-pi-pagetitle__image-lead-menu-container" }, h("div", { key: '3b77bd8ecbdf2a9e8ba57a2f43df4e67893f9c6f', class: "stzh-pi-pagetitle__image-lead-menu" }, h("div", { key: 'b31a688785c6ff74d414602e13240d7aca264f58', class: "stzh-pi-pagetitle__menu" }, menuSlotUsed && (h("div", { key: 'f9023fc9c4a64a7a618e95b646185a9a03e0b101', class: "stzh-pi-pagetitle__menu-inner" }, h("slot", { key: 'e9cf0a9658c999a5e4f8e1706976308e091f9e2a', name: "menu" })))), imageSlotUsed && (h("div", { key: '563ec8906f9a1829b3795ec4fa1d808e7bb1982e', class: "stzh-pi-pagetitle__image" }, [1, 2].indexOf(this.level) > -1 && (h("div", { key: 'f5608867a4849f00a22671b3e533259fec06e06f', class: "stzh-pi-pagetitle__image-wrapper" }, h("stzh-ratio", { key: 'd8026fe3433a8f59a43a874b9e64dfcf74fda574', ratio: "16:9", ratioSmall: "21:9", class: "stzh-pi-pagetitle__ratio" }, h("slot", { key: 'bc44a468ece509db858af815781cc9950b79cec9', name: "image" })))))), menuSlotUsed && (h("div", { key: '6c0268e26dd4462b28b41b234b8998c6cc4ebb7a', class: "stzh-pi-pagetitle__lead" }, h("slot", { key: 'dd88416348dde4e1a748f2bc842941c0bb1b17aa', name: "lead" }))))), !menuSlotUsed && (h("div", { key: '159cd4cc09defa62f7c926ba4d71d43762e7d682', class: "stzh-pi-pagetitle__lead-container" }, h("div", { key: 'a35c3f7341e49762fc86d9dde3055b89677dd919', class: "stzh-pi-pagetitle__lead" }, h("slot", { key: '559b60a5f60a8b0fdf6f7f5b9c221924ec932acf', name: "lead" })))), h("div", { key: '81477ae7580ee075a57395bced4f525a472d2680', class: "stzh-pi-pagetitle__article-info-wrapper" }, h("div", { key: '1e232da206f1fd05ea3fa28d85d1c773d17d2b6e', class: "stzh-pi-pagetitle__article-info" }, h("div", { key: 'e097552cd246d1064cb9f9b307f45ef1bfde834d', class: "stzh-pi-pagetitle__article-info-holder" }, hasArticleInfo && (h("div", { key: '11a170814162133727a85f9d3daf79499d0612e6' }, this.author && h("p", { key: 'a50c86bd6d4c336aeed4a77990be0854aa0fa869', class: "stzh-pi-pagetitle__author" }, this.author), this.date && h("p", { key: '8b3c06a346f10e06c9c6e969899b0f5db75aa172', class: "stzh-pi-pagetitle__date" }, this.date))), h("slot", { key: '1616edd716b2161e4ed69a31fc8c0f84ba93b7e8', name: "content" })))))));
     }
     get element() { return this; }
     static get style() { return StzhPiPagetitleStyle0; }

package/dist/components/stzh-pi-pagetitle.js.map

@@ -1 +1 @@
-{"file":"stzh-pi-pagetitle.js","mappings":";;;;AAAA,MAAM,kBAAkB,GAAG,uh0BAAuh0B,CAAC;AACnj0B,8BAAe,kBAAkB;;MCmBpBA,iBAAe;;;;QAelB,SAAI,GAAG;YACb,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,aAAa,CAAC,6DAA6D,CAAC,CAAC;YAC1G,MAAM,KAAK,GAAG,IAAI,CAAC,OAAO,CAAC,gBAAgB,CAAC,iDAAiD,CAAC,CAAC;YAC/F,MAAM,iBAAiB,GAAG,IAAI,CAAC,OAAO,CAAC,aAAa,CAAC,kCAAkC,CAAC,CAAC;YAEzF,IAAI,OAAO,EAAE;gBACX,cAAc,CAAC,OAAO,EAAE;oBACtB,KAAK,EAAE,MAAM;oBACb,KAAK,EAAE,GAAG;iBACe,CAAC,CAAC;aAC9B;YAED,IAAI,iBAAiB,EAAE;gBACrB,cAAc,CAAC,iBAAiB,EAAE;oBAChC,OAAO,EAAE,gBAAgB;oBACzB,aAAa,EAAE,IAAI;oBACnB,cAAc,EAAE,IAAI;oBACpB,IAAI,EAAE,OAAO;oBACb,UAAU,EAAE,MAAM;oBAClB,eAAe,EAAE,GAAG;iBACI,CAAC,CAAC;aAC7B;YAED,KAAK,CAAC,OAAO,CAAC,IAAI;gBAChB,cAAc,CAAC,IAAI,EAAE;oBACnB,IAAI,EAAE,IAAI;iBACY,CAAC,CAAC;aAC3B,CAAC,CAAC;SACJ,CAAC;qBAzC8C,CAAC;8BAGE,KAAK;sBAGd,EAAE;oBAGJ,EAAE;;IAkC1C,iBAAiB;QACf,IAAI,CAAC,IAAI,EAAE,CAAC;KACb;IAED,MAAM;QACJ,MAAM,aAAa,GAAG,OAAO,CAAC,IAAI,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC;QACrD,MAAM,YAAY,GAAG,OAAO,CAAC,IAAI,CAAC,OAAO,EAAE,MAAM,CAAC,CAAC;QACnD,MAAM,mBAAmB,GAAG,OAAO,CAAC,IAAI,CAAC,OAAO,EAAE,aAAa,CAAC,CAAC;QACjE,MAAM,YAAY,GAAG,OAAO,CAAC,IAAI,CAAC,OAAO,EAAE,MAAM,CAAC,CAAC;QACnD,MAAM,cAAc,GAAG,CAAC,CAAC,IAAI,CAAC,MAAM,IAAI,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC;QAEpD,MAAM,OAAO,GAAG;YACd,mBAAmB,EAAE,IAAI;YACzB,8BAA8B,EAAE,aAAa;YAC7C,iCAAiC,EAAE,CAAC,aAAa;YACjD,6BAA6B,EAAE,YAAY;YAC3C,6BAA6B,EAAE,mBAAmB;YAClD,6BAA6B,EAAE,YAAY;YAC3C,qCAAqC,EAAE,cAAc;YACrD,4BAA4B,EAAE,IAAI,CAAC,cAAc;YACjD,CAAC,4BAA4B,IAAI,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC,IAAI,CAAC,KAAK;SACzD,CAAC;QAEF,QACE,EAAC,IAAI,iEAAW,YAAY,sBAAoB,cAAc,IAC5D,4DAAK,KAAK,EAAE,OAAO,IACjB,4DAAK,KAAK,EAAC,mCAAmC,IAC5C,4DAAK,KAAK,EAAC,yBAAyB,IAClC,4DAAK,KAAK,EAAC,gCAAgC,IACzC,6DAAM,IAAI,EAAC,YAAY,GAAQ,CAC3B,EAEN,4DAAK,KAAK,EAAC,yBAAyB,IAClC,4DAAK,KAAK,EAAC,gCAAgC,IACzC,6DAAM,IAAI,EAAC,aAAa,GAAQ,CAC5B,CACF,EAEN,4DAAK,KAAK,EAAC,6BAA6B,IACtC,6DAAM,IAAI,EAAC,UAAU,GAAQ,CACzB,EAEN,4DAAK,KAAK,EAAC,4BAA4B,IACrC,6DAAM,IAAI,EAAC,SAAS,GAAQ,CACxB,CACF,CACF,EACN,4DAAK,KAAK,EAAC,8CAA8C,IACvD,4DAAK,KAAK,EAAC,oCAAoC,IAC7C,4DAAK,KAAK,EAAC,yBAAyB,IACjC,YAAY,KACX,4DAAK,KAAK,EAAC,+BAA+B,IACxC,6DAAM,IAAI,EAAC,MAAM,GAAQ,CACrB,CACP,CACG,EAEL,aAAa,KACZ,4DAAK,KAAK,EAAC,0BAA0B,IAClC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,KAC9B,4DAAK,KAAK,EAAC,kCAAkC,IAC3C,mEAAY,KAAK,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,EAAE,KAAK,EAAC,0BAA0B,IAC7E,6DAAM,IAAI,EAAE,OAAO,GAAS,CACjB,CACT,CACP,CACG,CACP,EAEA,YAAY,KACX,4DAAK,KAAK,EAAC,yBAAyB,IAClC,6DAAM,IAAI,EAAC,MAAM,GAAQ,CACrB,CACP,CACG,CACF,EAEL,CAAC,YAAY,KACZ,4DAAK,KAAK,EAAC,mCAAmC,IAC5C,4DAAK,KAAK,EAAC,yBAAyB,IAClC,6DAAM,IAAI,EAAC,MAAM,GAAQ,CACrB,CACF,CACP,EAEA,cAAc,KACb,4DAAK,KAAK,EAAC,yCAAyC,IAClD,4DAAK,KAAK,EAAC,iCAAiC,IAC1C,4DAAK,KAAK,EAAC,wCAAwC,IAChD,IAAI,CAAC,MAAM,IAAI,0DAAG,KAAK,EAAC,2BAA2B,IAAE,IAAI,CAAC,MAAM,CAAK,EACrE,IAAI,CAAC,IAAI,IAAI,0DAAG,KAAK,EAAC,yBAAyB,IAAE,IAAI,CAAC,IAAI,CAAK,EAEhE,6DAAM,IAAI,EAAC,SAAS,GAAG,CACnB,CACF,CACF,CACP,CACG,CACD,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["StzhPiPagetitle"],"sources":["src/components/CMS/stzh-pi-pagetitle/stzh-pi-pagetitle.scss?tag=stzh-pi-pagetitle&encapsulation=scoped","src/components/CMS/stzh-pi-pagetitle/stzh-pi-pagetitle.tsx"],"sourcesContent":["/**\n   * @prop --stzh-pi-pagetitle-background-color: Background if it has a menu\n   * @prop --stzh-pi-pagetitle-hero-background-color: Background color\n   * @prop --stzh-pi-pagetitle-lead-background-color: Background of lead section\n */\n\n:host {\n  --hero-background-color: var(\n    --stzh-pi-pagetitle-hero-background-color,\n    #{$colorPrimary10}\n  );\n  --lead-background-color: var(\n    --stzh-pi-pagetitle-lead-background-color,\n    #{$colorPrimary40}\n  );\n  --background-color: var(\n    --stzh-pi-pagetitle-background-color,\n    #{$colorCoolgrey10}\n  );\n  --grid-template-areas: \"hero hero hero hero\"\n    \"image-lead-menu image-lead-menu image-lead-menu image-lead-menu\";\n  @include mq($from: small) {\n    --grid-template-areas: \". hero hero hero\"\n      \"image-lead-menu image-lead-menu image-lead-menu image-lead-menu\";\n  }\n\n  @include mq($from: medium) {\n    --grid-template-areas: \". . hero hero hero hero hero hero\"\n      \"image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu\";\n  }\n\n  @include mq($from: large) {\n    --grid-template-areas: \". . hero hero hero hero hero hero hero hero hero .\"\n      \"image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu\";\n  }\n  @include mq($from: ultra) {\n    --grid-template-areas: \". . hero hero hero hero hero hero hero . . .\"\n      \"image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu\";\n  }\n\n  ::slotted([slot=\"dateline\"]) {\n    @include fontSize(\"milli\");\n    @include font(\"heavy\");\n    --color: var(--stzh-color-black80op);\n  }\n\n  ::slotted([slot=\"heading\"]),\n  ::slotted([slot=\"lead\"]) *,\n  ::slotted([slot=\"breadcrumb\"]) {\n    --color: var(--stzh-color-black);\n  }\n\n  ::slotted([slot=\"menu\"]) {\n    --stzh-pi-menu-padding-left: #{$containerMargin};\n\n    @include mq($from: small) {\n      --stzh-pi-menu-padding-left: #{$containerMarginSmall};\n    }\n\n    @include mq($from: large) {\n      --stzh-pi-menu-padding-left: #{$containerMarginLarge};\n    }\n\n    @include mq($from: ultra) {\n      --stzh-pi-menu-padding-left: calc((100vw - #{$containerMaxWidth}) / 2);\n    }\n  }\n}\n\n.stzh-pi-pagetitle {\n  @include spaceCurve(\"margin-bottom\", \"large\");\n  @include spaceCurve(\"margin-bottom\", \"large\");\n\n  /* Containers */\n\n  &__hero-container {\n    @include grid;\n    grid-template-areas: var(--grid-template-areas);\n    background-color: var(--hero-background-color);\n    @include spaceCurve(\"padding-top\", \"regular\");\n    @include spaceCurve(\"padding-top\", \"regular\");\n    @include containerPadding;\n  }\n\n  &__image-lead-menu-container {\n    @include grid;\n    grid-template-areas: var(--grid-template-areas);\n    background-color: var(--hero-background-color);\n\n    @include mq($from: medium) {\n      @include containerPadding;\n    }\n  }\n\n  &__lead-container {\n    @include grid;\n    grid-template-areas: \"lead lead lead lead\";\n    background-color: var(--lead-background-color);\n    @include containerPadding;\n\n    @include mq($from: medium) {\n      grid-template-areas: \". . lead lead lead lead lead lead\";\n    }\n\n    @include mq($from: large) {\n      grid-template-areas: \". . . lead lead lead lead lead lead . . .\";\n    }\n  }\n\n  &__image-lead-menu {\n    grid-area: image-lead-menu;\n\n    @include grid;\n    grid-template-areas: \"image image image image\" \"lead lead lead lead\";\n\n    @include mq($from: medium) {\n      grid-template-areas: \". . image image image image image image\" \"lead lead lead lead lead lead lead lead\";\n    }\n\n    @include mq($from: large) {\n      grid-template-areas: \". . . image image image image image image image image image\" \"lead lead lead lead lead lead lead lead lead lead lead lead\";\n    }\n  }\n\n  /* Elements */\n\n  &__hero {\n    grid-area: hero;\n  }\n\n  &__menu {\n    display: none;\n    // grid-area: menu;\n    grid-column: 1 / 2; /* span full width */\n    grid-row: 1 / 2; /* same row as image */\n    position: relative; /* allows z-index to work */\n    z-index: 2;\n\n    @include mq($from: medium) {\n      // grid-template-areas: \". . image image image image image image\" \"lead lead lead lead lead lead lead lead\";\n      grid-column: 1 / 3; /* span full width */\n      grid-row: 1 / 2; /* same row as image */\n    }\n\n    @include mq($from: large) {\n      // grid-template-areas: \". . . image image image image image image image image image\" \"lead lead lead lead lead lead lead lead lead lead lead lead\";\n      grid-column: 1 / 3; /* span full width */\n      grid-row: 1 / 2; /* same row as image */\n    }\n  }\n\n  &__image {\n    // grid-area: image;\n    grid-column: 1 / -1;\n    grid-row: 1 / 2; /* extend beyond menu row */\n    z-index: 1;\n\n    @include mq($from: medium) {\n      margin-right: -$containerMarginMedium;\n      grid-column: 3 / -1; /* span full width */\n      grid-row: 1 / 2; /* same row as image */\n    }\n\n    @include mq($from: large) {\n      margin-right: -$containerMarginLarge;\n    }\n\n    @include mq($from: ultra) {\n      margin-right: calc((100vw - #{$containerMaxWidth}) / -2);\n    }\n  }\n\n  &__lead {\n    --stzh-base-lead-color: #{$headingColor};\n    // grid-area: lead;\n    grid-column: 1 / -1;\n    grid-row: 2 / 4; /* extend beyond menu row */\n    z-index: 1;\n\n    background-color: var(--lead-background-color);\n    @include spaceCurve(\"padding-top\", \"regular\");\n    @include spaceCurve(\"padding-bottom\", \"regular\");\n\n    @include mq($from: medium) {\n      grid-column: 3 / -1; /* span full width */\n      grid-row: 2 / -1; /* same row as image */\n    }\n  }\n\n  &__text {\n    @include spaceCurve(\"padding-top\", \"big\");\n    @include spaceCurve(\"padding-bottom\", \"big\");\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n  }\n\n  &__meta {\n    display: flex;\n    flex-direction: column-reverse;\n    row-gap: space(\"xsmall\");\n\n    @include mq($from: medium) {\n      flex-direction: row;\n    }\n  }\n\n  &__readspeaker {\n    margin-bottom: space(\"medium\");\n\n    @include mq($from: small) {\n      margin-bottom: space(\"large\");\n    }\n\n    @include mq($from: small, $to: medium) {\n      --stzh-readspeaker-dropdown-position: relative;\n      --stzh-readspeaker-dropdown-top: auto;\n    }\n  }\n\n  &__dateline {\n    margin-bottom: space(\"xxsmall\");\n  }\n\n  &__breadcrumbs {\n    @include spaceCurve(\"margin-bottom\", \"regular\");\n  }\n\n  &__heading {\n    @include spaceCurve(\"margin-bottom\", \"regular\");\n  }\n\n  /**\n   * Menu.\n   */\n\n  &__menu-inner {\n    @include mq($from: medium) {\n      position: absolute;\n      top: 0;\n      right: 0;\n      bottom: 0;\n      left: 0;\n    }\n  }\n\n  /* Article Info */\n  &__article-info-wrapper {\n    @include container();\n    @include spaceCurve(\"padding-top\", \"large\");\n    @include grid;\n    grid-template-areas: \"article-info article-info article-info article-info\";\n\n    @include mq($from: medium) {\n      grid-template-areas: \". . article-info article-info article-info article-info article-info article-info\";\n    }\n\n    @include mq($from: large) {\n      grid-template-areas: \". . article-info article-info article-info article-info article-info article-info article-info article-info article-info article-info\";\n    }\n  }\n\n  &__article-info {\n    grid-area: article-info;\n  }\n\n  &__article-info-holder {\n    @include mq($from: medium) {\n      @include spaceCurve(\"padding-left\", \"regular\");\n    }\n  }\n\n  &__author {\n    margin-top: 0;\n    margin-bottom: var(--stzh-space-xxsmall);\n    color: var(--stzh-color-coolgrey70);\n    @include font(\"heavy\");\n    @include fontCurve(\"p1\");\n  }\n\n  &__date {\n    margin: 0;\n    @include fontCurve(\"p1\");\n  }\n\n  /**\n   * Has menu.\n   */\n  &--has-menu &__image-lead-menu {\n    grid-template-columns: auto repeat(3, minmax(0, 1fr));\n    // grid-template-areas: \"menu image image image\" \"menu lead lead lead\";\n\n    @include mq($from: medium) {\n      grid-template-columns: $gridColumnsMedium;\n      // grid-template-areas: \"menu menu image image image image image image\" \"menu menu lead lead lead lead lead lead\";\n    }\n\n    @include mq($from: large) {\n      grid-template-columns: $gridColumnsLarge;\n      // grid-template-areas: \"menu menu menu image image image image image image image image image\" \"menu menu menu lead lead lead lead lead lead lead lead lead\";\n    }\n  }\n\n  &--has-menu &__image-lead-menu-container {\n    background-color: transparent;\n    @include mq($to: medium) {\n      background-color: var(--lead-background-color);\n    }\n  }\n\n  &--has-menu &__menu {\n    position: relative;\n    display: inherit;\n    margin-right: calc(#{$gridGutter} * -1);\n\n    @include mq($from: small) {\n      margin-right: calc(#{$gridGutterSmall} * -1);\n    }\n\n    @include mq($from: medium) {\n      margin-right: calc(#{$gridGutterMedium} * -1);\n      margin-left: -$containerMarginMedium;\n    }\n\n    @include mq($from: large) {\n      margin-right: calc(#{$gridGutterLarge} * -1);\n      margin-left: -$containerMarginLarge;\n    }\n\n    @include mq($from: ultra) {\n      margin-right: calc(#{$gridGutterUltra} * -1);\n      margin-left: calc((100vw - #{$containerMaxWidth}) / -2);\n    }\n  }\n\n  &--has-menu &__lead {\n    @include spaceCurve(\"padding-left\", \"regular\");\n\n    @include mq($from: medium) {\n      margin-right: -$containerMarginMedium;\n      padding-right: $containerMarginMedium;\n    }\n\n    @include mq($from: large) {\n      margin-right: -$containerMarginLarge;\n      padding-right: $containerMarginLarge;\n    }\n\n    @include mq($from: ultra) {\n      margin-right: calc((100vw - #{$containerMaxWidth}) / -2);\n      padding-right: calc((100vw - 84.25rem) / 2);\n    }\n  }\n\n  /* Has meta */\n\n  &--has-meta &__text {\n    @include spaceCurve(\"padding-top\", \"regular\");\n  }\n\n  /* Level 3-4 */\n  &--level-3,\n  &--level-4 {\n    --hero-background-color: var(--stzh-color-coolgrey20);\n    --lead-background-color: var(--stzh-color-coolgrey30);\n  }\n\n  /* Hyphens */\n  &--hyphens &__heading {\n    hyphens: auto;\n  }\n}\n","import { Component, Element, h, Host, Prop } from \"@stencil/core\";\n\nimport { hasSlot, setPropsIfNull } from \"../../../utils/utils\";\n\n/**\n * @slot - Slot for any content\n * @slot heading - Slot for `stzh-heading` element\n * @slot image - Slot for `stzh-figure` or `img` element\n * @slot lead - Slot for `stzh-text` element\n * @slot readspeaker - Slot for `stzh-readspeaker` element\n * @slot breadcrumb - Slot for `stzh-link` element\n * @slot menu - Slot for `stzh-link` element\n * @slot dateline - Slot for date or meta information\n * @slot content - Slot for content\n */\n@Component({\n  tag: \"stzh-pi-pagetitle\",\n  styleUrl: \"stzh-pi-pagetitle.scss\",\n  scoped: true,\n})\nexport class StzhPiPagetitle {\n  /** Level */\n  @Prop({ reflect: true }) level: 1 | 2 | 3 | 4 = 1;\n\n  /** Automatic Hyphens */\n  @Prop({ reflect: true }) hyphensEnabled: boolean = false;\n\n  /** Author of the content */\n  @Prop({ reflect: true }) author: string = \"\";\n\n  /** Date of the content */\n  @Prop({ reflect: true }) date: string = \"\";\n\n  @Element() element: HTMLStzhPiPagetitleElement;\n\n  private init = () => {\n    const heading = this.element.querySelector('stzh-heading[slot=\"heading\"], [slot=\"heading\"] stzh-heading');\n    const leads = this.element.querySelectorAll('stzh-text[slot=\"lead\"], [slot=\"lead\"] stzh-text');\n    const readspeakerButton = this.element.querySelector('[slot=\"readspeaker\"] stzh-button');\n\n    if (heading) {\n      setPropsIfNull(heading, {\n        curve: \"hero\",\n        level: \"1\",\n      } as HTMLStzhHeadingElement);\n    }\n\n    if (readspeakerButton) {\n      setPropsIfNull(readspeakerButton, {\n        variant: \"tertiary-plain\",\n        noPaddingLeft: true,\n        noPaddingRight: true,\n        size: \"small\",\n        sizeMedium: \"tiny\",\n        buttonAccesskey: \"L\",\n      } as HTMLStzhButtonElement);\n    }\n\n    leads.forEach(lead => {\n      setPropsIfNull(lead, {\n        lead: true,\n      } as HTMLStzhTextElement);\n    });\n  };\n\n  connectedCallback() {\n    this.init();\n  }\n\n  render() {\n    const imageSlotUsed = hasSlot(this.element, \"image\");\n    const leadSlotUsed = hasSlot(this.element, \"lead\");\n    const readspeakerSlotUsed = hasSlot(this.element, \"readspeaker\");\n    const menuSlotUsed = hasSlot(this.element, \"menu\");\n    const hasArticleInfo = !!this.author || !!this.date;\n\n    const classes = {\n      \"stzh-pi-pagetitle\": true,\n      \"stzh-pi-pagetitle--has-image\": imageSlotUsed,\n      \"stzh-pi-pagetitle--has-no-image\": !imageSlotUsed,\n      \"stzh-pi-pagetitle--has-lead\": leadSlotUsed,\n      \"stzh-pi-pagetitle--has-meta\": readspeakerSlotUsed,\n      \"stzh-pi-pagetitle--has-menu\": menuSlotUsed,\n      \"stzh-pi-pagetitle--has-article-info\": hasArticleInfo,\n      \"stzh-pi-pagetitle--hyphens\": this.hyphensEnabled,\n      [`stzh-pi-pagetitle--level-${this.level}`]: !!this.level,\n    };\n\n    return (\n      <Host has-menu={menuSlotUsed} has-article-info={hasArticleInfo}>\n        <div class={classes}>\n          <div class=\"stzh-pi-pagetitle__hero-container\">\n            <div class=\"stzh-pi-pagetitle__hero\">\n              <div class=\"stzh-pi-pagetitle__breadcrumbs\">\n                <slot name=\"breadcrumb\"></slot>\n              </div>\n\n              <div class=\"stzh-pi-pagetitle__meta\">\n                <div class=\"stzh-pi-pagetitle__readspeaker\">\n                  <slot name=\"readspeaker\"></slot>\n                </div>\n              </div>\n\n              <div class=\"stzh-pi-pagetitle__dateline\">\n                <slot name=\"dateline\"></slot>\n              </div>\n\n              <div class=\"stzh-pi-pagetitle__heading\">\n                <slot name=\"heading\"></slot>\n              </div>\n            </div>\n          </div>\n          <div class=\"stzh-pi-pagetitle__image-lead-menu-container\">\n            <div class=\"stzh-pi-pagetitle__image-lead-menu\">\n              <div class=\"stzh-pi-pagetitle__menu\">\n                {menuSlotUsed && (\n                  <div class=\"stzh-pi-pagetitle__menu-inner\">\n                    <slot name=\"menu\"></slot>\n                  </div>\n                )}\n              </div>\n\n              {imageSlotUsed && (\n                <div class=\"stzh-pi-pagetitle__image\">\n                  {[1, 2].indexOf(this.level) > -1 && (\n                    <div class=\"stzh-pi-pagetitle__image-wrapper\">\n                      <stzh-ratio ratio={\"16:9\"} ratioSmall={\"21:9\"} class=\"stzh-pi-pagetitle__ratio\">\n                        <slot name={\"image\"}></slot>\n                      </stzh-ratio>\n                    </div>\n                  )}\n                </div>\n              )}\n\n              {menuSlotUsed && (\n                <div class=\"stzh-pi-pagetitle__lead\">\n                  <slot name=\"lead\"></slot>\n                </div>\n              )}\n            </div>\n          </div>\n\n          {!menuSlotUsed && (\n            <div class=\"stzh-pi-pagetitle__lead-container\">\n              <div class=\"stzh-pi-pagetitle__lead\">\n                <slot name=\"lead\"></slot>\n              </div>\n            </div>\n          )}\n\n          {hasArticleInfo && (\n            <div class=\"stzh-pi-pagetitle__article-info-wrapper\">\n              <div class=\"stzh-pi-pagetitle__article-info\">\n                <div class=\"stzh-pi-pagetitle__article-info-holder\">\n                  {this.author && <p class=\"stzh-pi-pagetitle__author\">{this.author}</p>}\n                  {this.date && <p class=\"stzh-pi-pagetitle__date\">{this.date}</p>}\n\n                  <slot name=\"content\" />\n                </div>\n              </div>\n            </div>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"stzh-pi-pagetitle.js","mappings":";;;;AAAA,MAAM,kBAAkB,GAAG,uh0BAAuh0B,CAAC;AACnj0B,8BAAe,kBAAkB;;MCmBpBA,iBAAe;;;;QAelB,SAAI,GAAG;YACb,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,aAAa,CAAC,6DAA6D,CAAC,CAAC;YAC1G,MAAM,KAAK,GAAG,IAAI,CAAC,OAAO,CAAC,gBAAgB,CAAC,iDAAiD,CAAC,CAAC;YAC/F,MAAM,iBAAiB,GAAG,IAAI,CAAC,OAAO,CAAC,aAAa,CAAC,kCAAkC,CAAC,CAAC;YAEzF,IAAI,OAAO,EAAE;gBACX,cAAc,CAAC,OAAO,EAAE;oBACtB,KAAK,EAAE,MAAM;oBACb,KAAK,EAAE,GAAG;iBACe,CAAC,CAAC;aAC9B;YAED,IAAI,iBAAiB,EAAE;gBACrB,cAAc,CAAC,iBAAiB,EAAE;oBAChC,OAAO,EAAE,gBAAgB;oBACzB,aAAa,EAAE,IAAI;oBACnB,cAAc,EAAE,IAAI;oBACpB,IAAI,EAAE,OAAO;oBACb,UAAU,EAAE,MAAM;oBAClB,eAAe,EAAE,GAAG;iBACI,CAAC,CAAC;aAC7B;YAED,KAAK,CAAC,OAAO,CAAC,IAAI;gBAChB,cAAc,CAAC,IAAI,EAAE;oBACnB,IAAI,EAAE,IAAI;iBACY,CAAC,CAAC;aAC3B,CAAC,CAAC;SACJ,CAAC;qBAzC8C,CAAC;8BAGE,KAAK;sBAGd,EAAE;oBAGJ,EAAE;;IAkC1C,iBAAiB;QACf,IAAI,CAAC,IAAI,EAAE,CAAC;KACb;IAED,MAAM;QACJ,MAAM,aAAa,GAAG,OAAO,CAAC,IAAI,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC;QACrD,MAAM,YAAY,GAAG,OAAO,CAAC,IAAI,CAAC,OAAO,EAAE,MAAM,CAAC,CAAC;QACnD,MAAM,mBAAmB,GAAG,OAAO,CAAC,IAAI,CAAC,OAAO,EAAE,aAAa,CAAC,CAAC;QACjE,MAAM,YAAY,GAAG,OAAO,CAAC,IAAI,CAAC,OAAO,EAAE,MAAM,CAAC,CAAC;QACnD,MAAM,cAAc,GAAG,CAAC,CAAC,IAAI,CAAC,MAAM,IAAI,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC;QAEpD,MAAM,OAAO,GAAG;YACd,mBAAmB,EAAE,IAAI;YACzB,8BAA8B,EAAE,aAAa;YAC7C,iCAAiC,EAAE,CAAC,aAAa;YACjD,6BAA6B,EAAE,YAAY;YAC3C,6BAA6B,EAAE,mBAAmB;YAClD,6BAA6B,EAAE,YAAY;YAC3C,qCAAqC,EAAE,cAAc;YACrD,4BAA4B,EAAE,IAAI,CAAC,cAAc;YACjD,CAAC,4BAA4B,IAAI,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC,IAAI,CAAC,KAAK;SACzD,CAAC;QAEF,QACE,EAAC,IAAI,iEAAW,YAAY,sBAAoB,cAAc,IAC5D,4DAAK,KAAK,EAAE,OAAO,IACjB,4DAAK,KAAK,EAAC,mCAAmC,IAC5C,4DAAK,KAAK,EAAC,yBAAyB,IAClC,4DAAK,KAAK,EAAC,gCAAgC,IACzC,6DAAM,IAAI,EAAC,YAAY,GAAQ,CAC3B,EAEN,4DAAK,KAAK,EAAC,yBAAyB,IAClC,4DAAK,KAAK,EAAC,gCAAgC,IACzC,6DAAM,IAAI,EAAC,aAAa,GAAQ,CAC5B,CACF,EAEN,4DAAK,KAAK,EAAC,6BAA6B,IACtC,6DAAM,IAAI,EAAC,UAAU,GAAQ,CACzB,EAEN,4DAAK,KAAK,EAAC,4BAA4B,IACrC,6DAAM,IAAI,EAAC,SAAS,GAAQ,CACxB,CACF,CACF,EACN,4DAAK,KAAK,EAAC,8CAA8C,IACvD,4DAAK,KAAK,EAAC,oCAAoC,IAC7C,4DAAK,KAAK,EAAC,yBAAyB,IACjC,YAAY,KACX,4DAAK,KAAK,EAAC,+BAA+B,IACxC,6DAAM,IAAI,EAAC,MAAM,GAAQ,CACrB,CACP,CACG,EAEL,aAAa,KACZ,4DAAK,KAAK,EAAC,0BAA0B,IAClC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,KAC9B,4DAAK,KAAK,EAAC,kCAAkC,IAC3C,mEAAY,KAAK,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,EAAE,KAAK,EAAC,0BAA0B,IAC7E,6DAAM,IAAI,EAAE,OAAO,GAAS,CACjB,CACT,CACP,CACG,CACP,EAEA,YAAY,KACX,4DAAK,KAAK,EAAC,yBAAyB,IAClC,6DAAM,IAAI,EAAC,MAAM,GAAQ,CACrB,CACP,CACG,CACF,EAEL,CAAC,YAAY,KACZ,4DAAK,KAAK,EAAC,mCAAmC,IAC5C,4DAAK,KAAK,EAAC,yBAAyB,IAClC,6DAAM,IAAI,EAAC,MAAM,GAAQ,CACrB,CACF,CACP,EAED,4DAAK,KAAK,EAAC,yCAAyC,IAClD,4DAAK,KAAK,EAAC,iCAAiC,IAC1C,4DAAK,KAAK,EAAC,wCAAwC,IAChD,cAAc,KACb,8DACG,IAAI,CAAC,MAAM,IAAI,0DAAG,KAAK,EAAC,2BAA2B,IAAE,IAAI,CAAC,MAAM,CAAK,EACrE,IAAI,CAAC,IAAI,IAAI,0DAAG,KAAK,EAAC,yBAAyB,IAAE,IAAI,CAAC,IAAI,CAAK,CAC5D,CACP,EACD,6DAAM,IAAI,EAAC,SAAS,GAAG,CACnB,CACF,CACF,CACF,CACD,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["StzhPiPagetitle"],"sources":["src/components/CMS/stzh-pi-pagetitle/stzh-pi-pagetitle.scss?tag=stzh-pi-pagetitle&encapsulation=scoped","src/components/CMS/stzh-pi-pagetitle/stzh-pi-pagetitle.tsx"],"sourcesContent":["/**\n   * @prop --stzh-pi-pagetitle-background-color: Background if it has a menu\n   * @prop --stzh-pi-pagetitle-hero-background-color: Background color\n   * @prop --stzh-pi-pagetitle-lead-background-color: Background of lead section\n */\n\n:host {\n  --hero-background-color: var(\n    --stzh-pi-pagetitle-hero-background-color,\n    #{$colorPrimary10}\n  );\n  --lead-background-color: var(\n    --stzh-pi-pagetitle-lead-background-color,\n    #{$colorPrimary40}\n  );\n  --background-color: var(\n    --stzh-pi-pagetitle-background-color,\n    #{$colorCoolgrey10}\n  );\n  --grid-template-areas: \"hero hero hero hero\"\n    \"image-lead-menu image-lead-menu image-lead-menu image-lead-menu\";\n  @include mq($from: small) {\n    --grid-template-areas: \". hero hero hero\"\n      \"image-lead-menu image-lead-menu image-lead-menu image-lead-menu\";\n  }\n\n  @include mq($from: medium) {\n    --grid-template-areas: \". . hero hero hero hero hero hero\"\n      \"image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu\";\n  }\n\n  @include mq($from: large) {\n    --grid-template-areas: \". . hero hero hero hero hero hero hero hero hero .\"\n      \"image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu\";\n  }\n  @include mq($from: ultra) {\n    --grid-template-areas: \". . hero hero hero hero hero hero hero . . .\"\n      \"image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu\";\n  }\n\n  ::slotted([slot=\"dateline\"]) {\n    @include fontSize(\"milli\");\n    @include font(\"heavy\");\n    --color: var(--stzh-color-black80op);\n  }\n\n  ::slotted([slot=\"heading\"]),\n  ::slotted([slot=\"lead\"]) *,\n  ::slotted([slot=\"breadcrumb\"]) {\n    --color: var(--stzh-color-black);\n  }\n\n  ::slotted([slot=\"menu\"]) {\n    --stzh-pi-menu-padding-left: #{$containerMargin};\n\n    @include mq($from: small) {\n      --stzh-pi-menu-padding-left: #{$containerMarginSmall};\n    }\n\n    @include mq($from: large) {\n      --stzh-pi-menu-padding-left: #{$containerMarginLarge};\n    }\n\n    @include mq($from: ultra) {\n      --stzh-pi-menu-padding-left: calc((100vw - #{$containerMaxWidth}) / 2);\n    }\n  }\n}\n\n.stzh-pi-pagetitle {\n  @include spaceCurve(\"margin-bottom\", \"large\");\n  @include spaceCurve(\"margin-bottom\", \"large\");\n\n  /* Containers */\n\n  &__hero-container {\n    @include grid;\n    grid-template-areas: var(--grid-template-areas);\n    background-color: var(--hero-background-color);\n    @include spaceCurve(\"padding-top\", \"regular\");\n    @include spaceCurve(\"padding-top\", \"regular\");\n    @include containerPadding;\n  }\n\n  &__image-lead-menu-container {\n    @include grid;\n    grid-template-areas: var(--grid-template-areas);\n    background-color: var(--hero-background-color);\n\n    @include mq($from: medium) {\n      @include containerPadding;\n    }\n  }\n\n  &__lead-container {\n    @include grid;\n    grid-template-areas: \"lead lead lead lead\";\n    background-color: var(--lead-background-color);\n    @include containerPadding;\n\n    @include mq($from: medium) {\n      grid-template-areas: \". . lead lead lead lead lead lead\";\n    }\n\n    @include mq($from: large) {\n      grid-template-areas: \". . . lead lead lead lead lead lead . . .\";\n    }\n  }\n\n  &__image-lead-menu {\n    grid-area: image-lead-menu;\n\n    @include grid;\n    grid-template-areas: \"image image image image\" \"lead lead lead lead\";\n\n    @include mq($from: medium) {\n      grid-template-areas: \". . image image image image image image\" \"lead lead lead lead lead lead lead lead\";\n    }\n\n    @include mq($from: large) {\n      grid-template-areas: \". . . image image image image image image image image image\" \"lead lead lead lead lead lead lead lead lead lead lead lead\";\n    }\n  }\n\n  /* Elements */\n\n  &__hero {\n    grid-area: hero;\n  }\n\n  &__menu {\n    display: none;\n    // grid-area: menu;\n    grid-column: 1 / 2; /* span full width */\n    grid-row: 1 / 2; /* same row as image */\n    position: relative; /* allows z-index to work */\n    z-index: 2;\n\n    @include mq($from: medium) {\n      // grid-template-areas: \". . image image image image image image\" \"lead lead lead lead lead lead lead lead\";\n      grid-column: 1 / 3; /* span full width */\n      grid-row: 1 / 2; /* same row as image */\n    }\n\n    @include mq($from: large) {\n      // grid-template-areas: \". . . image image image image image image image image image\" \"lead lead lead lead lead lead lead lead lead lead lead lead\";\n      grid-column: 1 / 3; /* span full width */\n      grid-row: 1 / 2; /* same row as image */\n    }\n  }\n\n  &__image {\n    // grid-area: image;\n    grid-column: 1 / -1;\n    grid-row: 1 / 2; /* extend beyond menu row */\n    z-index: 1;\n\n    @include mq($from: medium) {\n      margin-right: -$containerMarginMedium;\n      grid-column: 3 / -1; /* span full width */\n      grid-row: 1 / 2; /* same row as image */\n    }\n\n    @include mq($from: large) {\n      margin-right: -$containerMarginLarge;\n    }\n\n    @include mq($from: ultra) {\n      margin-right: calc((100vw - #{$containerMaxWidth}) / -2);\n    }\n  }\n\n  &__lead {\n    --stzh-base-lead-color: #{$headingColor};\n    // grid-area: lead;\n    grid-column: 1 / -1;\n    grid-row: 2 / 4; /* extend beyond menu row */\n    z-index: 1;\n\n    background-color: var(--lead-background-color);\n    @include spaceCurve(\"padding-top\", \"regular\");\n    @include spaceCurve(\"padding-bottom\", \"regular\");\n\n    @include mq($from: medium) {\n      grid-column: 3 / -1; /* span full width */\n      grid-row: 2 / -1; /* same row as image */\n    }\n  }\n\n  &__text {\n    @include spaceCurve(\"padding-top\", \"big\");\n    @include spaceCurve(\"padding-bottom\", \"big\");\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n  }\n\n  &__meta {\n    display: flex;\n    flex-direction: column-reverse;\n    row-gap: space(\"xsmall\");\n\n    @include mq($from: medium) {\n      flex-direction: row;\n    }\n  }\n\n  &__readspeaker {\n    margin-bottom: space(\"medium\");\n\n    @include mq($from: small) {\n      margin-bottom: space(\"large\");\n    }\n\n    @include mq($from: small, $to: medium) {\n      --stzh-readspeaker-dropdown-position: relative;\n      --stzh-readspeaker-dropdown-top: auto;\n    }\n  }\n\n  &__dateline {\n    margin-bottom: space(\"xxsmall\");\n  }\n\n  &__breadcrumbs {\n    @include spaceCurve(\"margin-bottom\", \"regular\");\n  }\n\n  &__heading {\n    @include spaceCurve(\"margin-bottom\", \"regular\");\n  }\n\n  /**\n   * Menu.\n   */\n\n  &__menu-inner {\n    @include mq($from: medium) {\n      position: absolute;\n      top: 0;\n      right: 0;\n      bottom: 0;\n      left: 0;\n    }\n  }\n\n  /* Article Info */\n  &__article-info-wrapper {\n    @include container();\n    @include spaceCurve(\"padding-top\", \"large\");\n    @include grid;\n    grid-template-areas: \"article-info article-info article-info article-info\";\n\n    @include mq($from: medium) {\n      grid-template-areas: \". . article-info article-info article-info article-info article-info article-info\";\n    }\n\n    @include mq($from: large) {\n      grid-template-areas: \". . article-info article-info article-info article-info article-info article-info article-info article-info article-info article-info\";\n    }\n  }\n\n  &__article-info {\n    grid-area: article-info;\n  }\n\n  &__article-info-holder {\n    @include mq($from: medium) {\n      @include spaceCurve(\"padding-left\", \"regular\");\n    }\n  }\n\n  &__author {\n    margin-top: 0;\n    margin-bottom: var(--stzh-space-xxsmall);\n    color: var(--stzh-color-coolgrey70);\n    @include font(\"heavy\");\n    @include fontCurve(\"p1\");\n  }\n\n  &__date {\n    margin: 0;\n    @include fontCurve(\"p1\");\n  }\n\n  /**\n   * Has menu.\n   */\n  &--has-menu &__image-lead-menu {\n    grid-template-columns: auto repeat(3, minmax(0, 1fr));\n    // grid-template-areas: \"menu image image image\" \"menu lead lead lead\";\n\n    @include mq($from: medium) {\n      grid-template-columns: $gridColumnsMedium;\n      // grid-template-areas: \"menu menu image image image image image image\" \"menu menu lead lead lead lead lead lead\";\n    }\n\n    @include mq($from: large) {\n      grid-template-columns: $gridColumnsLarge;\n      // grid-template-areas: \"menu menu menu image image image image image image image image image\" \"menu menu menu lead lead lead lead lead lead lead lead lead\";\n    }\n  }\n\n  &--has-menu &__image-lead-menu-container {\n    background-color: transparent;\n    @include mq($to: medium) {\n      background-color: var(--lead-background-color);\n    }\n  }\n\n  &--has-menu &__menu {\n    position: relative;\n    display: inherit;\n    margin-right: calc(#{$gridGutter} * -1);\n\n    @include mq($from: small) {\n      margin-right: calc(#{$gridGutterSmall} * -1);\n    }\n\n    @include mq($from: medium) {\n      margin-right: calc(#{$gridGutterMedium} * -1);\n      margin-left: -$containerMarginMedium;\n    }\n\n    @include mq($from: large) {\n      margin-right: calc(#{$gridGutterLarge} * -1);\n      margin-left: -$containerMarginLarge;\n    }\n\n    @include mq($from: ultra) {\n      margin-right: calc(#{$gridGutterUltra} * -1);\n      margin-left: calc((100vw - #{$containerMaxWidth}) / -2);\n    }\n  }\n\n  &--has-menu &__lead {\n    @include spaceCurve(\"padding-left\", \"regular\");\n\n    @include mq($from: medium) {\n      margin-right: -$containerMarginMedium;\n      padding-right: $containerMarginMedium;\n    }\n\n    @include mq($from: large) {\n      margin-right: -$containerMarginLarge;\n      padding-right: $containerMarginLarge;\n    }\n\n    @include mq($from: ultra) {\n      margin-right: calc((100vw - #{$containerMaxWidth}) / -2);\n      padding-right: calc((100vw - 84.25rem) / 2);\n    }\n  }\n\n  /* Has meta */\n\n  &--has-meta &__text {\n    @include spaceCurve(\"padding-top\", \"regular\");\n  }\n\n  /* Level 3-4 */\n  &--level-3,\n  &--level-4 {\n    --hero-background-color: var(--stzh-color-coolgrey20);\n    --lead-background-color: var(--stzh-color-coolgrey30);\n  }\n\n  /* Hyphens */\n  &--hyphens &__heading {\n    hyphens: auto;\n  }\n}\n","import { Component, Element, h, Host, Prop } from \"@stencil/core\";\n\nimport { hasSlot, setPropsIfNull } from \"../../../utils/utils\";\n\n/**\n * @slot - Slot for any content\n * @slot heading - Slot for `stzh-heading` element\n * @slot image - Slot for `stzh-figure` or `img` element\n * @slot lead - Slot for `stzh-text` element\n * @slot readspeaker - Slot for `stzh-readspeaker` element\n * @slot breadcrumb - Slot for `stzh-link` element\n * @slot menu - Slot for `stzh-link` element\n * @slot dateline - Slot for date or meta information\n * @slot content - Slot for content\n */\n@Component({\n  tag: \"stzh-pi-pagetitle\",\n  styleUrl: \"stzh-pi-pagetitle.scss\",\n  scoped: true,\n})\nexport class StzhPiPagetitle {\n  /** Level */\n  @Prop({ reflect: true }) level: 1 | 2 | 3 | 4 = 1;\n\n  /** Automatic Hyphens */\n  @Prop({ reflect: true }) hyphensEnabled: boolean = false;\n\n  /** Author of the content */\n  @Prop({ reflect: true }) author: string = \"\";\n\n  /** Date of the content */\n  @Prop({ reflect: true }) date: string = \"\";\n\n  @Element() element: HTMLStzhPiPagetitleElement;\n\n  private init = () => {\n    const heading = this.element.querySelector('stzh-heading[slot=\"heading\"], [slot=\"heading\"] stzh-heading');\n    const leads = this.element.querySelectorAll('stzh-text[slot=\"lead\"], [slot=\"lead\"] stzh-text');\n    const readspeakerButton = this.element.querySelector('[slot=\"readspeaker\"] stzh-button');\n\n    if (heading) {\n      setPropsIfNull(heading, {\n        curve: \"hero\",\n        level: \"1\",\n      } as HTMLStzhHeadingElement);\n    }\n\n    if (readspeakerButton) {\n      setPropsIfNull(readspeakerButton, {\n        variant: \"tertiary-plain\",\n        noPaddingLeft: true,\n        noPaddingRight: true,\n        size: \"small\",\n        sizeMedium: \"tiny\",\n        buttonAccesskey: \"L\",\n      } as HTMLStzhButtonElement);\n    }\n\n    leads.forEach(lead => {\n      setPropsIfNull(lead, {\n        lead: true,\n      } as HTMLStzhTextElement);\n    });\n  };\n\n  connectedCallback() {\n    this.init();\n  }\n\n  render() {\n    const imageSlotUsed = hasSlot(this.element, \"image\");\n    const leadSlotUsed = hasSlot(this.element, \"lead\");\n    const readspeakerSlotUsed = hasSlot(this.element, \"readspeaker\");\n    const menuSlotUsed = hasSlot(this.element, \"menu\");\n    const hasArticleInfo = !!this.author || !!this.date;\n\n    const classes = {\n      \"stzh-pi-pagetitle\": true,\n      \"stzh-pi-pagetitle--has-image\": imageSlotUsed,\n      \"stzh-pi-pagetitle--has-no-image\": !imageSlotUsed,\n      \"stzh-pi-pagetitle--has-lead\": leadSlotUsed,\n      \"stzh-pi-pagetitle--has-meta\": readspeakerSlotUsed,\n      \"stzh-pi-pagetitle--has-menu\": menuSlotUsed,\n      \"stzh-pi-pagetitle--has-article-info\": hasArticleInfo,\n      \"stzh-pi-pagetitle--hyphens\": this.hyphensEnabled,\n      [`stzh-pi-pagetitle--level-${this.level}`]: !!this.level,\n    };\n\n    return (\n      <Host has-menu={menuSlotUsed} has-article-info={hasArticleInfo}>\n        <div class={classes}>\n          <div class=\"stzh-pi-pagetitle__hero-container\">\n            <div class=\"stzh-pi-pagetitle__hero\">\n              <div class=\"stzh-pi-pagetitle__breadcrumbs\">\n                <slot name=\"breadcrumb\"></slot>\n              </div>\n\n              <div class=\"stzh-pi-pagetitle__meta\">\n                <div class=\"stzh-pi-pagetitle__readspeaker\">\n                  <slot name=\"readspeaker\"></slot>\n                </div>\n              </div>\n\n              <div class=\"stzh-pi-pagetitle__dateline\">\n                <slot name=\"dateline\"></slot>\n              </div>\n\n              <div class=\"stzh-pi-pagetitle__heading\">\n                <slot name=\"heading\"></slot>\n              </div>\n            </div>\n          </div>\n          <div class=\"stzh-pi-pagetitle__image-lead-menu-container\">\n            <div class=\"stzh-pi-pagetitle__image-lead-menu\">\n              <div class=\"stzh-pi-pagetitle__menu\">\n                {menuSlotUsed && (\n                  <div class=\"stzh-pi-pagetitle__menu-inner\">\n                    <slot name=\"menu\"></slot>\n                  </div>\n                )}\n              </div>\n\n              {imageSlotUsed && (\n                <div class=\"stzh-pi-pagetitle__image\">\n                  {[1, 2].indexOf(this.level) > -1 && (\n                    <div class=\"stzh-pi-pagetitle__image-wrapper\">\n                      <stzh-ratio ratio={\"16:9\"} ratioSmall={\"21:9\"} class=\"stzh-pi-pagetitle__ratio\">\n                        <slot name={\"image\"}></slot>\n                      </stzh-ratio>\n                    </div>\n                  )}\n                </div>\n              )}\n\n              {menuSlotUsed && (\n                <div class=\"stzh-pi-pagetitle__lead\">\n                  <slot name=\"lead\"></slot>\n                </div>\n              )}\n            </div>\n          </div>\n\n          {!menuSlotUsed && (\n            <div class=\"stzh-pi-pagetitle__lead-container\">\n              <div class=\"stzh-pi-pagetitle__lead\">\n                <slot name=\"lead\"></slot>\n              </div>\n            </div>\n          )}\n\n          <div class=\"stzh-pi-pagetitle__article-info-wrapper\">\n            <div class=\"stzh-pi-pagetitle__article-info\">\n              <div class=\"stzh-pi-pagetitle__article-info-holder\">\n                {hasArticleInfo && (\n                  <div>\n                    {this.author && <p class=\"stzh-pi-pagetitle__author\">{this.author}</p>}\n                    {this.date && <p class=\"stzh-pi-pagetitle__date\">{this.date}</p>}\n                  </div>\n                )}\n                <slot name=\"content\" />\n              </div>\n            </div>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/stzh-pi-teaser-layout-item.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface StzhPiTeaserLayoutItem extends Components.StzhPiTeaserLayoutItem, HTMLElement {}
+export const StzhPiTeaserLayoutItem: {
+    prototype: StzhPiTeaserLayoutItem;
+    new (): StzhPiTeaserLayoutItem;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;