@duetds/components 8.5.0 → 8.5.1

package/hydrate/index.js

@@ -7664,7 +7664,8 @@ function listenMouse() {
 // start listening for mouse clicking (and tabbing through that) only if window is defined (i.e. not on server)
 if (typeof window !== "undefined") {
     window.addEventListener("mousedown", listenMouse, false);
-    window.addEventListener("blur", () => notifySubscribers(true));
+    // on blur, leave the window in tabbing state
+    window.addEventListener("blur", () => listenKeys({ key: "Tab" }));
 }
 const subscribeTabbingChange = component => {
     tabbingChangeSubscribers.add(component);
@@ -8754,7 +8755,7 @@ const DuetPicture = ({ img, sources }) => {
         hAsync("img", Object.assign({}, img))));
 };
 
-const duetBannerCss = "/*!@*,\n*::after,\n*::before*/*.sc-duet-banner,*.sc-duet-banner::after,*.sc-duet-banner::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}/*!@:host*/.sc-duet-banner-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;margin-right:4px !important;margin-bottom:2px !important;display:block;width:auto}/*!@:host:last-child, :host:last-of-type*/.sc-duet-banner-h:last-child,.sc-duet-banner-h:last-of-type{margin-right:0 !important}/*!@:host(.duet-m-0)*/.duet-m-0.sc-duet-banner-h{margin:0 !important}/*!@.duet-banner*/.duet-banner.sc-duet-banner{display:grid;width:100%;height:100%;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-style:normal;text-align:left;border-radius:24px}/*!@.duet-banner.duet-p-0*/.duet-banner.duet-p-0.sc-duet-banner{padding:0 !important}/*!@.duet-banner.duet-m-0*/.duet-banner.duet-m-0.sc-duet-banner{margin:0 !important}/*!@.duet-banner .visual*/.duet-banner.sc-duet-banner .visual.sc-duet-banner{position:relative;overflow:hidden;border-top-left-radius:24px;border-top-right-radius:24px}/*!@.duet-banner .visual .image-container*/.duet-banner.sc-duet-banner .visual.sc-duet-banner .image-container.sc-duet-banner{position:relative;width:400px;height:400px;overflow:hidden;border-radius:20%;transform:rotate(7deg)}/*!@.duet-banner .visual .image*/.duet-banner.sc-duet-banner .visual.sc-duet-banner .image.sc-duet-banner{position:relative;top:20px;width:100%;height:100%;transform:rotate(-7deg);object-fit:cover}/*!@.duet-banner .visual .icon*/.duet-banner.sc-duet-banner .visual.sc-duet-banner .icon.sc-duet-banner{position:absolute}/*!@.duet-banner .content*/.duet-banner.sc-duet-banner .content.sc-duet-banner{display:flex;flex-direction:column;gap:8px;padding:0 20px 36px}/*!@.duet-banner .content .description*/.duet-banner.sc-duet-banner .content.sc-duet-banner .description.sc-duet-banner{hyphens:auto}/*!@.duet-banner .action*/.duet-banner.sc-duet-banner .action.sc-duet-banner{display:flex;flex-direction:column;flex-grow:1;align-items:flex-start;justify-content:flex-end;padding-top:16px}/*!@.duet-banner.small*/.duet-banner.small.sc-duet-banner{grid-template-rows:335px 1fr;max-width:335px}/*!@.duet-banner.small .visual*/.duet-banner.small.sc-duet-banner .visual.sc-duet-banner{border-top-left-radius:24px;border-top-right-radius:24px}/*!@.duet-banner.small .visual .image-container*/.duet-banner.small.sc-duet-banner .visual.sc-duet-banner .image-container.sc-duet-banner{top:-130px;left:-40px}/*!@.duet-banner.small .visual .icon*/.duet-banner.small.sc-duet-banner .visual.sc-duet-banner .icon.sc-duet-banner{bottom:30px;left:15px}/*!@.duet-banner.medium*/.duet-banner.medium.sc-duet-banner{grid-template-rows:none;grid-template-columns:50% 50%;min-width:500px;max-width:542px;height:288px}/*!@.duet-banner.medium .visual*/.duet-banner.medium.sc-duet-banner .visual.sc-duet-banner{border-top-left-radius:24px;border-bottom-left-radius:24px}/*!@.duet-banner.medium .visual .image-container*/.duet-banner.medium.sc-duet-banner .visual.sc-duet-banner .image-container.sc-duet-banner{position:absolute;bottom:-72px;left:-178px}/*!@.duet-banner.medium .visual .image*/.duet-banner.medium.sc-duet-banner .visual.sc-duet-banner .image.sc-duet-banner{width:auto;height:auto}/*!@.duet-banner.medium .visual .icon*/.duet-banner.medium.sc-duet-banner .visual.sc-duet-banner .icon.sc-duet-banner{top:36px;left:168px}/*!@.duet-banner.medium .content*/.duet-banner.medium.sc-duet-banner .content.sc-duet-banner{align-items:flex-start;justify-content:center;padding:0 72px 0 0}/*!@.duet-banner.medium .action*/.duet-banner.medium.sc-duet-banner .action.sc-duet-banner{flex-grow:0}/*!@.duet-banner.large*/.duet-banner.large.sc-duet-banner{grid-template-rows:none;grid-template-columns:50% 50%;min-width:900px;max-width:1112px;height:320px;max-height:none}/*!@.duet-banner.large .visual*/.duet-banner.large.sc-duet-banner .visual.sc-duet-banner{border-top-left-radius:24px;border-bottom-left-radius:24px}/*!@.duet-banner.large .visual .image-container*/.duet-banner.large.sc-duet-banner .visual.sc-duet-banner .image-container.sc-duet-banner{position:relative;top:-30px;left:-30px}/*!@.duet-banner.large .visual .image*/.duet-banner.large.sc-duet-banner .visual.sc-duet-banner .image.sc-duet-banner{top:-15px;left:30px;width:100%;height:100%}/*!@.duet-banner.large .visual .icon*/.duet-banner.large.sc-duet-banner .visual.sc-duet-banner .icon.sc-duet-banner{top:40px;bottom:auto;left:335px}/*!@.duet-banner.large .content*/.duet-banner.large.sc-duet-banner .content.sc-duet-banner{align-items:flex-start;justify-content:center;padding:0 72px 0 0}/*!@.duet-banner.large .action*/.duet-banner.large.sc-duet-banner .action.sc-duet-banner{flex-grow:0}@media (max-width: 35.9375em){/*!@.duet-banner.auto*/.duet-banner.auto.sc-duet-banner{grid-template-rows:335px 1fr;max-width:335px}/*!@.duet-banner.auto .visual*/.duet-banner.auto.sc-duet-banner .visual.sc-duet-banner{border-top-left-radius:24px;border-top-right-radius:24px}/*!@.duet-banner.auto .visual .image-container*/.duet-banner.auto.sc-duet-banner .visual.sc-duet-banner .image-container.sc-duet-banner{top:-130px;left:-40px}/*!@.duet-banner.auto .visual .icon*/.duet-banner.auto.sc-duet-banner .visual.sc-duet-banner .icon.sc-duet-banner{bottom:30px;left:15px}}@media (min-width: 36em){/*!@.duet-banner.auto*/.duet-banner.auto.sc-duet-banner{grid-template-rows:none;grid-template-columns:50% 50%;min-width:500px;max-width:542px;height:288px}/*!@.duet-banner.auto .visual*/.duet-banner.auto.sc-duet-banner .visual.sc-duet-banner{border-top-left-radius:24px;border-bottom-left-radius:24px}/*!@.duet-banner.auto .visual .image-container*/.duet-banner.auto.sc-duet-banner .visual.sc-duet-banner .image-container.sc-duet-banner{position:absolute;bottom:-72px;left:-178px}/*!@.duet-banner.auto .visual .image*/.duet-banner.auto.sc-duet-banner .visual.sc-duet-banner .image.sc-duet-banner{width:auto;height:auto}/*!@.duet-banner.auto .visual .icon*/.duet-banner.auto.sc-duet-banner .visual.sc-duet-banner .icon.sc-duet-banner{top:36px;left:168px}/*!@.duet-banner.auto .content*/.duet-banner.auto.sc-duet-banner .content.sc-duet-banner{align-items:flex-start;justify-content:center;padding:0 72px 0 0}/*!@.duet-banner.auto .action*/.duet-banner.auto.sc-duet-banner .action.sc-duet-banner{flex-grow:0}}@media (min-width: 62em){/*!@.duet-banner.auto*/.duet-banner.auto.sc-duet-banner{grid-template-rows:none;grid-template-columns:50% 50%;min-width:900px;max-width:1112px;height:320px;max-height:none}/*!@.duet-banner.auto .visual*/.duet-banner.auto.sc-duet-banner .visual.sc-duet-banner{border-top-left-radius:24px;border-bottom-left-radius:24px}/*!@.duet-banner.auto .visual .image-container*/.duet-banner.auto.sc-duet-banner .visual.sc-duet-banner .image-container.sc-duet-banner{position:relative;top:-30px;left:-30px}/*!@.duet-banner.auto .visual .image*/.duet-banner.auto.sc-duet-banner .visual.sc-duet-banner .image.sc-duet-banner{top:-15px;left:30px;width:100%;height:100%}/*!@.duet-banner.auto .visual .icon*/.duet-banner.auto.sc-duet-banner .visual.sc-duet-banner .icon.sc-duet-banner{top:40px;bottom:auto;left:335px}/*!@.duet-banner.auto .content*/.duet-banner.auto.sc-duet-banner .content.sc-duet-banner{align-items:flex-start;justify-content:center;padding:0 72px 0 0}/*!@.duet-banner.auto .action*/.duet-banner.auto.sc-duet-banner .action.sc-duet-banner{flex-grow:0}}/*!@.duet-banner.duet-theme-turva*/.duet-banner.duet-theme-turva.sc-duet-banner{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\"}/*!@.duet-banner.duet-theme-turva .visual .image-container*/.duet-banner.duet-theme-turva.sc-duet-banner .visual.sc-duet-banner .image-container.sc-duet-banner{width:526px;height:456px;transform:none;-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg%20fill%3D%22currentColor%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20160%20140%22%3E%3Cpath%20d%3D%22M87.8%20139.6a57.3%2057.3%200%2000-18.4-3.3c-8-.5-16.3-2.5-24.6-6-16.7-7-29-18.7-37.1-35.3a73.5%2073.5%200%2001-5-52.4c1.7-4%203-6.7%204-7.8a33%2033%200%20004-7.8C33.4%203.5%2063.2-4.3%20100%203.2c30.5%204%2049.7%2019.9%2057.6%2047.4l1.6%2024c4.4%2036-11.5%2056-47.5%2060.3-4%202.4-12%203.9-24%204.7%22%20fill-rule%3D%22nonzero%22%2F%3E%3C%2Fsvg%3E\");-webkit-mask-repeat:no-repeat;mask-image:url(\"data:image/svg+xml,%3Csvg%20fill%3D%22currentColor%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20160%20140%22%3E%3Cpath%20d%3D%22M87.8%20139.6a57.3%2057.3%200%2000-18.4-3.3c-8-.5-16.3-2.5-24.6-6-16.7-7-29-18.7-37.1-35.3a73.5%2073.5%200%2001-5-52.4c1.7-4%203-6.7%204-7.8a33%2033%200%20004-7.8C33.4%203.5%2063.2-4.3%20100%203.2c30.5%204%2049.7%2019.9%2057.6%2047.4l1.6%2024c4.4%2036-11.5%2056-47.5%2060.3-4%202.4-12%203.9-24%204.7%22%20fill-rule%3D%22nonzero%22%2F%3E%3C%2Fsvg%3E\");mask-repeat:no-repeat}/*!@.duet-banner.duet-theme-turva .visual .image*/.duet-banner.duet-theme-turva.sc-duet-banner .visual.sc-duet-banner .image.sc-duet-banner{transform:none}/*!@.duet-banner.duet-theme-turva.small .visual .image-container*/.duet-banner.duet-theme-turva.small.sc-duet-banner .visual.sc-duet-banner .image-container.sc-duet-banner{top:-164px;left:-147px}/*!@.duet-banner.duet-theme-turva.small .visual .image*/.duet-banner.duet-theme-turva.small.sc-duet-banner .visual.sc-duet-banner .image.sc-duet-banner{top:0;left:0}/*!@.duet-banner.duet-theme-turva.small .visual .icon*/.duet-banner.duet-theme-turva.small.sc-duet-banner .visual.sc-duet-banner .icon.sc-duet-banner{bottom:15px}/*!@.duet-banner.duet-theme-turva.medium .visual .image-container*/.duet-banner.duet-theme-turva.medium.sc-duet-banner .visual.sc-duet-banner .image-container.sc-duet-banner{top:-54.923px;left:-185px;width:410px;height:422px}/*!@.duet-banner.duet-theme-turva.medium .visual .image*/.duet-banner.duet-theme-turva.medium.sc-duet-banner .visual.sc-duet-banner .image.sc-duet-banner{top:0;left:0}/*!@.duet-banner.duet-theme-turva.large .visual .image-container*/.duet-banner.duet-theme-turva.large.sc-duet-banner .visual.sc-duet-banner .image-container.sc-duet-banner{top:-54.923px;left:-147px;width:526px;height:456px}/*!@.duet-banner.duet-theme-turva.large .visual .image*/.duet-banner.duet-theme-turva.large.sc-duet-banner .visual.sc-duet-banner .image.sc-duet-banner{top:0;left:0}/*!@.duet-banner.duet-theme-turva.large .visual .icon*/.duet-banner.duet-theme-turva.large.sc-duet-banner .visual.sc-duet-banner .icon.sc-duet-banner{bottom:auto;left:295px}/*!@.duet-banner.duet-theme-turva.auto .visual .image-container*/.duet-banner.duet-theme-turva.auto.sc-duet-banner .visual.sc-duet-banner .image-container.sc-duet-banner{top:-164px;left:-147px}/*!@.duet-banner.duet-theme-turva.auto .visual .image*/.duet-banner.duet-theme-turva.auto.sc-duet-banner .visual.sc-duet-banner .image.sc-duet-banner{top:0;left:0}/*!@.duet-banner.duet-theme-turva.auto .visual .icon*/.duet-banner.duet-theme-turva.auto.sc-duet-banner .visual.sc-duet-banner .icon.sc-duet-banner{bottom:15px}@media (min-width: 36em){/*!@.duet-banner.duet-theme-turva.auto .visual .image-container*/.duet-banner.duet-theme-turva.auto.sc-duet-banner .visual.sc-duet-banner .image-container.sc-duet-banner{top:-54.923px;left:-185px;width:410px;height:422px}/*!@.duet-banner.duet-theme-turva.auto .visual .image*/.duet-banner.duet-theme-turva.auto.sc-duet-banner .visual.sc-duet-banner .image.sc-duet-banner{top:0;left:0}}@media (min-width: 62em){/*!@.duet-banner.duet-theme-turva.auto .visual .image-container*/.duet-banner.duet-theme-turva.auto.sc-duet-banner .visual.sc-duet-banner .image-container.sc-duet-banner{top:-54.923px;left:-147px;width:526px;height:456px}/*!@.duet-banner.duet-theme-turva.auto .visual .image*/.duet-banner.duet-theme-turva.auto.sc-duet-banner .visual.sc-duet-banner .image.sc-duet-banner{top:0;left:0}/*!@.duet-banner.duet-theme-turva.auto .visual .icon*/.duet-banner.duet-theme-turva.auto.sc-duet-banner .visual.sc-duet-banner .icon.sc-duet-banner{bottom:auto;left:295px}}";
+const duetBannerCss = "/*!@*,\n*::after,\n*::before*/*.sc-duet-banner,*.sc-duet-banner::after,*.sc-duet-banner::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}/*!@:host*/.sc-duet-banner-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;margin-right:36px !important;margin-bottom:36px !important;display:flex;justify-content:center;width:auto}/*!@:host:last-child, :host:last-of-type*/.sc-duet-banner-h:last-child,.sc-duet-banner-h:last-of-type{margin-right:0 !important}/*!@:host(.duet-m-0)*/.duet-m-0.sc-duet-banner-h{margin:0 !important}/*!@.duet-banner*/.duet-banner.sc-duet-banner{display:grid;width:100%;height:100%;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-style:normal;text-align:left;border-radius:24px}/*!@.duet-banner.duet-p-0*/.duet-banner.duet-p-0.sc-duet-banner{padding:0 !important}/*!@.duet-banner.duet-m-0*/.duet-banner.duet-m-0.sc-duet-banner{margin:0 !important}/*!@.duet-banner .visual*/.duet-banner.sc-duet-banner .visual.sc-duet-banner{position:relative;overflow:hidden;border-top-left-radius:24px;border-top-right-radius:24px}/*!@.duet-banner .visual .image-container*/.duet-banner.sc-duet-banner .visual.sc-duet-banner .image-container.sc-duet-banner{position:relative;width:400px;height:400px;overflow:hidden;border-radius:20%;transform:rotate(7deg)}/*!@.duet-banner .visual .image*/.duet-banner.sc-duet-banner .visual.sc-duet-banner .image.sc-duet-banner{position:relative;top:20px;width:100%;height:100%;transform:rotate(-7deg);object-fit:cover}/*!@.duet-banner .visual .icon*/.duet-banner.sc-duet-banner .visual.sc-duet-banner .icon.sc-duet-banner{position:absolute}/*!@.duet-banner .content*/.duet-banner.sc-duet-banner .content.sc-duet-banner{display:flex;flex-direction:column;gap:8px;padding:0 20px 36px}/*!@.duet-banner .content .description*/.duet-banner.sc-duet-banner .content.sc-duet-banner .description.sc-duet-banner{hyphens:auto}/*!@.duet-banner .action*/.duet-banner.sc-duet-banner .action.sc-duet-banner{display:flex;flex-direction:column;flex-grow:1;align-items:flex-start;justify-content:flex-end;padding-top:16px}/*!@.duet-banner.small*/.duet-banner.small.sc-duet-banner{grid-template-rows:335px 1fr;max-width:335px}/*!@.duet-banner.small .visual*/.duet-banner.small.sc-duet-banner .visual.sc-duet-banner{border-top-left-radius:24px;border-top-right-radius:24px}/*!@.duet-banner.small .visual .image-container*/.duet-banner.small.sc-duet-banner .visual.sc-duet-banner .image-container.sc-duet-banner{top:-130px;left:-40px}/*!@.duet-banner.small .visual .icon*/.duet-banner.small.sc-duet-banner .visual.sc-duet-banner .icon.sc-duet-banner{bottom:30px;left:15px}/*!@.duet-banner.medium*/.duet-banner.medium.sc-duet-banner{grid-template-rows:none;grid-template-columns:50% 50%;max-width:542px;height:288px}/*!@.duet-banner.medium .visual*/.duet-banner.medium.sc-duet-banner .visual.sc-duet-banner{border-top-left-radius:24px;border-bottom-left-radius:24px}/*!@.duet-banner.medium .visual .image-container*/.duet-banner.medium.sc-duet-banner .visual.sc-duet-banner .image-container.sc-duet-banner{position:absolute;bottom:-72px;left:-178px}/*!@.duet-banner.medium .visual .image*/.duet-banner.medium.sc-duet-banner .visual.sc-duet-banner .image.sc-duet-banner{width:auto;height:auto}/*!@.duet-banner.medium .visual .icon*/.duet-banner.medium.sc-duet-banner .visual.sc-duet-banner .icon.sc-duet-banner{top:36px;left:168px}/*!@.duet-banner.medium .content*/.duet-banner.medium.sc-duet-banner .content.sc-duet-banner{align-items:flex-start;justify-content:center;padding:0 72px 0 0}/*!@.duet-banner.medium .action*/.duet-banner.medium.sc-duet-banner .action.sc-duet-banner{flex-grow:0}/*!@.duet-banner.large*/.duet-banner.large.sc-duet-banner{grid-template-rows:none;grid-template-columns:50% 50%;max-width:1112px;height:320px;max-height:none}/*!@.duet-banner.large .visual*/.duet-banner.large.sc-duet-banner .visual.sc-duet-banner{border-top-left-radius:24px;border-bottom-left-radius:24px}/*!@.duet-banner.large .visual .image-container*/.duet-banner.large.sc-duet-banner .visual.sc-duet-banner .image-container.sc-duet-banner{position:relative;top:-30px;left:-30px}/*!@.duet-banner.large .visual .image*/.duet-banner.large.sc-duet-banner .visual.sc-duet-banner .image.sc-duet-banner{top:-15px;left:30px;width:100%;height:100%}/*!@.duet-banner.large .visual .icon*/.duet-banner.large.sc-duet-banner .visual.sc-duet-banner .icon.sc-duet-banner{top:40px;bottom:auto;left:335px}/*!@.duet-banner.large .content*/.duet-banner.large.sc-duet-banner .content.sc-duet-banner{align-items:flex-start;justify-content:center;padding:0 72px 0 0}/*!@.duet-banner.large .action*/.duet-banner.large.sc-duet-banner .action.sc-duet-banner{flex-grow:0}/*!@.duet-banner.duet-theme-turva*/.duet-banner.duet-theme-turva.sc-duet-banner{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\"}/*!@.duet-banner.duet-theme-turva .visual .image-container*/.duet-banner.duet-theme-turva.sc-duet-banner .visual.sc-duet-banner .image-container.sc-duet-banner{width:526px;height:456px;transform:none;-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg%20fill%3D%22currentColor%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20160%20140%22%3E%3Cpath%20d%3D%22M87.8%20139.6a57.3%2057.3%200%2000-18.4-3.3c-8-.5-16.3-2.5-24.6-6-16.7-7-29-18.7-37.1-35.3a73.5%2073.5%200%2001-5-52.4c1.7-4%203-6.7%204-7.8a33%2033%200%20004-7.8C33.4%203.5%2063.2-4.3%20100%203.2c30.5%204%2049.7%2019.9%2057.6%2047.4l1.6%2024c4.4%2036-11.5%2056-47.5%2060.3-4%202.4-12%203.9-24%204.7%22%20fill-rule%3D%22nonzero%22%2F%3E%3C%2Fsvg%3E\");-webkit-mask-repeat:no-repeat;mask-image:url(\"data:image/svg+xml,%3Csvg%20fill%3D%22currentColor%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20160%20140%22%3E%3Cpath%20d%3D%22M87.8%20139.6a57.3%2057.3%200%2000-18.4-3.3c-8-.5-16.3-2.5-24.6-6-16.7-7-29-18.7-37.1-35.3a73.5%2073.5%200%2001-5-52.4c1.7-4%203-6.7%204-7.8a33%2033%200%20004-7.8C33.4%203.5%2063.2-4.3%20100%203.2c30.5%204%2049.7%2019.9%2057.6%2047.4l1.6%2024c4.4%2036-11.5%2056-47.5%2060.3-4%202.4-12%203.9-24%204.7%22%20fill-rule%3D%22nonzero%22%2F%3E%3C%2Fsvg%3E\");mask-repeat:no-repeat}/*!@.duet-banner.duet-theme-turva .visual .image*/.duet-banner.duet-theme-turva.sc-duet-banner .visual.sc-duet-banner .image.sc-duet-banner{transform:none}/*!@.duet-banner.duet-theme-turva.small .visual .image-container*/.duet-banner.duet-theme-turva.small.sc-duet-banner .visual.sc-duet-banner .image-container.sc-duet-banner{top:-164px;left:-147px}/*!@.duet-banner.duet-theme-turva.small .visual .image*/.duet-banner.duet-theme-turva.small.sc-duet-banner .visual.sc-duet-banner .image.sc-duet-banner{top:0;left:0}/*!@.duet-banner.duet-theme-turva.small .visual .icon*/.duet-banner.duet-theme-turva.small.sc-duet-banner .visual.sc-duet-banner .icon.sc-duet-banner{bottom:15px}/*!@.duet-banner.duet-theme-turva.medium .visual .image-container*/.duet-banner.duet-theme-turva.medium.sc-duet-banner .visual.sc-duet-banner .image-container.sc-duet-banner{top:-54.923px;left:-185px;width:410px;height:422px}/*!@.duet-banner.duet-theme-turva.medium .visual .image*/.duet-banner.duet-theme-turva.medium.sc-duet-banner .visual.sc-duet-banner .image.sc-duet-banner{top:0;left:0}/*!@.duet-banner.duet-theme-turva.large .visual .image-container*/.duet-banner.duet-theme-turva.large.sc-duet-banner .visual.sc-duet-banner .image-container.sc-duet-banner{top:-54.923px;left:-147px;width:526px;height:456px}/*!@.duet-banner.duet-theme-turva.large .visual .image*/.duet-banner.duet-theme-turva.large.sc-duet-banner .visual.sc-duet-banner .image.sc-duet-banner{top:0;left:0}/*!@.duet-banner.duet-theme-turva.large .visual .icon*/.duet-banner.duet-theme-turva.large.sc-duet-banner .visual.sc-duet-banner .icon.sc-duet-banner{bottom:auto;left:295px}";
 
 /**
  * @slot heading - Slot for heading content. Only span should be used in this slot.
@@ -8764,6 +8765,19 @@ const duetBannerCss = "/*!@*,\n*::after,\n*::before*/*.sc-duet-banner,*.sc-duet-
 class DuetBanner {
     constructor(hostRef) {
         registerInstance(this, hostRef);
+        this.checkBannerSize = () => {
+            const elementSize = this.element.clientWidth;
+            if (elementSize < 500 || this.size === "small") {
+                this.currentSize = "small";
+            }
+            else if (elementSize < 900 || this.size === "medium") {
+                this.currentSize = "medium";
+            }
+            else {
+                this.currentSize = "large";
+            }
+            this.setButtonSize();
+        };
         /**
          * Default to smaller button size for small and medium banners.
          */
@@ -8771,19 +8785,20 @@ class DuetBanner {
             if (this.hasActionSlot) {
                 const buttons = this.element.querySelectorAll("[slot='action'] duet-button, duet-button[slot='action']");
                 for (const button of buttons) {
-                    if (button && button.getAttribute("size") === null && this.size !== "large") {
+                    if (button && button.getAttribute("size") === null && this.currentSize !== "large") {
                         button.size = "small";
                     }
                 }
             }
         };
+        this.currentSize = undefined;
         this.theme = "";
         this.margin = "auto";
         this.backgroundColor = "primary-lighter";
         this.iconColor = "gray-lightest";
         this.iconBackgroundColor = "primary";
         this.textColor = "secondary";
-        this.size = "auto";
+        this.size = "large";
         this.image = "";
         this.sources = undefined;
         this.icon = "";
@@ -8799,6 +8814,15 @@ class DuetBanner {
         this.hasActionSlot = hasSlot(this.element, "action");
         checkNamedSlotElement(this.element, "heading", "span");
         this.setButtonSize();
+        setTimeout(() => {
+            this.checkBannerSize();
+        }, 0);
+    }
+    connectedCallback() {
+        window.addEventListener("resize", this.checkBannerSize);
+    }
+    disconnectedCallback() {
+        window.removeEventListener("resize", this.checkBannerSize);
     }
     /**
      * render() function
@@ -8818,8 +8842,8 @@ class DuetBanner {
         return (hAsync(Host, { class: { "duet-m-0": this.margin === "none" } }, hAsync("aside", { class: {
                 "duet-banner": true,
                 "duet-theme-turva": this.theme === "turva",
-                [this.size]: true,
-            }, style: bannerStyles }, hAsync("div", { class: "visual" }, hAsync("div", { class: "image-container" }, this.image && hAsync(DuetPicture, Object.assign({}, pictureSource))), this.icon && (hAsync("duet-icon", { theme: this.theme, class: "icon", name: this.icon, shape: "brand", size: this.size === "large" ? "xx-large" : "x-large", color: this.iconColor, background: this.iconBackgroundColor, "background-rotation": "7", "background-opacity": "0.85", margin: "none" }))), hAsync("div", { class: "content" }, this.hasHeadingSlot && (hAsync("div", { class: "heading" }, hAsync("duet-heading", { theme: this.theme, level: this.headingLevel, "visual-level": this.size === "large" ? "h2" : "h3", "fixed-size": true, margin: "none", color: this.textColor }, hAsync("span", null, hAsync("slot", { name: "heading" }))))), this.hasDescriptionSlot && (hAsync("div", { class: "description", style: { color } }, hAsync("slot", { name: "description" }))), this.hasActionSlot && (hAsync("div", { class: "action" }, hAsync("slot", { name: "action" })))))));
+                [this.currentSize]: true,
+            }, style: bannerStyles }, hAsync("div", { class: "visual" }, hAsync("div", { class: "image-container" }, this.image && hAsync(DuetPicture, Object.assign({}, pictureSource))), this.icon && (hAsync("duet-icon", { theme: this.theme, class: "icon", name: this.icon, shape: "brand", size: this.currentSize === "large" ? "xx-large" : "x-large", color: this.iconColor, background: this.iconBackgroundColor, "background-rotation": "7", "background-opacity": "0.85", margin: "none" }))), hAsync("div", { class: "content" }, this.hasHeadingSlot && (hAsync("div", { class: "heading" }, hAsync("duet-heading", { theme: this.theme, level: this.headingLevel, "visual-level": this.currentSize === "large" ? "h2" : "h3", "fixed-size": true, margin: "none", color: this.textColor }, hAsync("span", null, hAsync("slot", { name: "heading" }))))), this.hasDescriptionSlot && (hAsync("div", { class: "description", style: { color } }, hAsync("slot", { name: "description" }))), this.hasActionSlot && (hAsync("div", { class: "action" }, hAsync("slot", { name: "action" })))))));
     }
     get element() { return getElement(this); }
     static get style() { return duetBannerCss; }
@@ -8837,7 +8861,8 @@ class DuetBanner {
             "image": [1],
             "sources": [1],
             "icon": [1],
-            "headingLevel": [1, "heading-level"]
+            "headingLevel": [1, "heading-level"],
+            "currentSize": [32]
         },
         "$listeners$": undefined,
         "$lazyBundleId$": "-",
@@ -9503,7 +9528,7 @@ class DuetCard {
     }; }
 }
 
-const duetCheckboxCss = "*.sc-duet-checkbox,*.sc-duet-checkbox::after,*.sc-duet-checkbox::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}.sc-duet-checkbox-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;margin-right:8px !important;margin-bottom:12px !important;display:inline-flex;width:100%;vertical-align:bottom;-webkit-tap-highlight-color:transparent}.sc-duet-checkbox-h:last-child,.sc-duet-checkbox-h:last-of-type{margin-right:0 !important}.sc-duet-checkbox-h:last-child:not(:only-child){margin-bottom:0 !important}.duet-m-0.sc-duet-checkbox-h{margin:0 !important}.duet-label.sc-duet-checkbox{position:relative;z-index:100;display:inline;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:1rem;font-weight:400;line-height:1.5;color:rgb(0, 41, 77);vertical-align:top;cursor:pointer;background:transparent;transition:300ms ease}.duet-theme-turva.sc-duet-checkbox .duet-label.sc-duet-checkbox{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(23, 28, 58)}.duet-label.sc-duet-checkbox span.sc-duet-checkbox{display:inline-block;width:calc(100% - 32px);font-size:1rem;font-weight:400;vertical-align:top}.duet-checkbox-container.sc-duet-checkbox{position:relative;width:100%;height:100%}.duet-checkbox.sc-duet-checkbox{padding:14px !important;position:absolute;top:0;left:0;z-index:2;width:100%;height:100%;cursor:pointer;opacity:0}.duet-checkbox.sc-duet-checkbox+label.sc-duet-checkbox::before{z-index:100;display:inline-block;width:20px;height:20px;margin:2px 10px 1px 1px;vertical-align:top;content:\"\";background:rgb(255, 255, 255);border:1px solid rgb(0, 41, 77);border-radius:4px}.duet-theme-turva.sc-duet-checkbox .duet-checkbox.sc-duet-checkbox+label.sc-duet-checkbox::before{border-color:rgb(23, 28, 58)}.duet-checkbox.sc-duet-checkbox:checked+label.sc-duet-checkbox::before{background:rgb(0, 41, 77);border:1px solid rgb(0, 41, 77)}.duet-theme-turva.sc-duet-checkbox .duet-checkbox.sc-duet-checkbox:checked+label.sc-duet-checkbox::before{background:rgb(23, 28, 58);border-color:rgb(23, 28, 58)}.duet-checkbox.sc-duet-checkbox:focus+label.sc-duet-checkbox::before{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}.duet-theme-turva.sc-duet-checkbox .duet-checkbox.sc-duet-checkbox:focus+label.sc-duet-checkbox::before{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.duet-checkbox[aria-invalid=true].sc-duet-checkbox+label.sc-duet-checkbox::before{background:#fdf4f7;border-color:rgb(222, 35, 98)}.duet-theme-turva.sc-duet-checkbox .duet-checkbox[aria-invalid=true].sc-duet-checkbox+label.sc-duet-checkbox::before{background:#fdf4f3;border-color:rgb(224, 42, 13)}.duet-checkbox.sc-duet-checkbox+label.sc-duet-checkbox{position:static}.duet-checkbox.sc-duet-checkbox:checked+label.sc-duet-checkbox::after{position:absolute;top:6px;left:5px;z-index:200;width:12px;height:12px;pointer-events:none;content:\"\";background:transparent url(\"data:image/svg+xml,%3Csvg%20fill%3D%27white%27%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20d%3D%27M23.374.287a1.5%2C1.5%2C0%2C0%2C0-2.093.345L7.246%2C20.2%2C2.561%2C15.511A1.5%2C1.5%2C0%2C1%2C0%2C.439%2C17.632l5.935%2C5.934a1.525%2C1.525%2C0%2C0%2C0%2C2.279-.186l15.066-21A1.5%2C1.5%2C0%2C0%2C0%2C23.374.287Z%27%20%2F%3E%3C%2Fsvg%3E\") no-repeat 0 0;background-size:100% auto}.duet-checkbox[disabled].sc-duet-checkbox{cursor:default}.duet-checkbox[disabled].sc-duet-checkbox+label.sc-duet-checkbox{color:rgb(101, 119, 135)}.duet-theme-turva.sc-duet-checkbox .duet-checkbox[disabled].sc-duet-checkbox+label.sc-duet-checkbox{color:rgb(116, 116, 117)}.duet-checkbox[disabled].sc-duet-checkbox+label.sc-duet-checkbox::before{border-color:rgb(207, 210, 212)}.duet-theme-turva.sc-duet-checkbox .duet-checkbox[disabled].sc-duet-checkbox+label.sc-duet-checkbox::before{border-color:rgb(207, 207, 209)}.duet-checkbox[disabled].sc-duet-checkbox:checked+label.sc-duet-checkbox::before{background:rgb(101, 119, 135);border:1px solid rgb(101, 119, 135)}.duet-theme-turva.sc-duet-checkbox .duet-checkbox[disabled].sc-duet-checkbox:checked+label.sc-duet-checkbox::before{background:rgb(116, 116, 117);border-color:rgb(116, 116, 117)}.duet-checkbox-error.sc-duet-checkbox{margin-left:31px;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:0.875rem;font-weight:400;line-height:1.25;color:rgb(222, 35, 98);border-radius:4px}.duet-theme-turva.sc-duet-checkbox .duet-checkbox-error.sc-duet-checkbox{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(224, 42, 13)}.duet-label-hidden.sc-duet-checkbox .duet-label.sc-duet-checkbox span.sc-duet-checkbox{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);border:0}";
+const duetCheckboxCss = "*.sc-duet-checkbox,*.sc-duet-checkbox::after,*.sc-duet-checkbox::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}.sc-duet-checkbox-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;margin-right:8px !important;margin-bottom:12px !important;display:inline-flex;width:100%;vertical-align:bottom;-webkit-tap-highlight-color:transparent}.sc-duet-checkbox-h:last-child,.sc-duet-checkbox-h:last-of-type{margin-right:0 !important}.sc-duet-checkbox-h:last-child:not(:only-child){margin-bottom:0 !important}.duet-m-0.sc-duet-checkbox-h{margin:0 !important}.duet-label.sc-duet-checkbox{position:relative;z-index:100;display:inline;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:1rem;font-weight:400;line-height:1.5;color:rgb(0, 41, 77);vertical-align:top;cursor:pointer;background:transparent;transition:300ms ease}.duet-theme-turva.sc-duet-checkbox .duet-label.sc-duet-checkbox{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(23, 28, 58)}.duet-label.sc-duet-checkbox span.sc-duet-checkbox{display:inline-block;width:calc(100% - 32px);font-size:1rem;font-weight:400;vertical-align:top}.duet-checkbox-container.sc-duet-checkbox{position:relative;width:100%;height:100%}.duet-checkbox.sc-duet-checkbox{padding:14px !important;position:absolute;top:0;left:0;z-index:2;width:100%;height:100%;cursor:pointer;opacity:0}.duet-checkbox.sc-duet-checkbox+label.sc-duet-checkbox::before{z-index:100;display:inline-block;width:20px;height:20px;margin:2px 10px 1px 1px;vertical-align:top;content:\"\";background:rgb(255, 255, 255);border:1px solid rgb(0, 41, 77);border-radius:4px}.duet-theme-turva.sc-duet-checkbox .duet-checkbox.sc-duet-checkbox+label.sc-duet-checkbox::before{border-color:rgb(23, 28, 58)}.duet-checkbox.sc-duet-checkbox:checked+label.sc-duet-checkbox::before{background:rgb(0, 41, 77);border:1px solid rgb(0, 41, 77)}.duet-theme-turva.sc-duet-checkbox .duet-checkbox.sc-duet-checkbox:checked+label.sc-duet-checkbox::before{background:rgb(23, 28, 58);border-color:rgb(23, 28, 58)}.duet-checkbox.sc-duet-checkbox:focus+label.sc-duet-checkbox::before{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}.duet-theme-turva.sc-duet-checkbox .duet-checkbox.sc-duet-checkbox:focus+label.sc-duet-checkbox::before{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.duet-checkbox[aria-invalid=true].sc-duet-checkbox+label.sc-duet-checkbox::before{background:#fdf4f7;border-color:rgb(222, 35, 98)}.duet-theme-turva.sc-duet-checkbox .duet-checkbox[aria-invalid=true].sc-duet-checkbox+label.sc-duet-checkbox::before{background:#fdf4f3;border-color:rgb(224, 42, 13)}.duet-checkbox.sc-duet-checkbox+label.sc-duet-checkbox{position:static}.duet-checkbox.sc-duet-checkbox:checked+label.sc-duet-checkbox::after{position:absolute;top:6px;left:5px;z-index:200;width:12px;height:12px;pointer-events:none;content:\"\";background:transparent url(\"data:image/svg+xml,%3Csvg%20fill%3D%27white%27%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20d%3D%27M23.374.287a1.5%2C1.5%2C0%2C0%2C0-2.093.345L7.246%2C20.2%2C2.561%2C15.511A1.5%2C1.5%2C0%2C1%2C0%2C.439%2C17.632l5.935%2C5.934a1.525%2C1.525%2C0%2C0%2C0%2C2.279-.186l15.066-21A1.5%2C1.5%2C0%2C0%2C0%2C23.374.287Z%27%20%2F%3E%3C%2Fsvg%3E\") no-repeat 0 0;background-size:100% auto}.duet-checkbox[disabled].sc-duet-checkbox{cursor:default}.duet-checkbox[disabled].sc-duet-checkbox+label.sc-duet-checkbox{color:rgb(101, 119, 135)}.duet-theme-turva.sc-duet-checkbox .duet-checkbox[disabled].sc-duet-checkbox+label.sc-duet-checkbox{color:rgb(116, 116, 117)}.duet-checkbox[disabled].sc-duet-checkbox+label.sc-duet-checkbox::before{border-color:rgb(207, 210, 212)}.duet-theme-turva.sc-duet-checkbox .duet-checkbox[disabled].sc-duet-checkbox+label.sc-duet-checkbox::before{border-color:rgb(207, 207, 209)}.duet-checkbox[disabled].sc-duet-checkbox:checked+label.sc-duet-checkbox::before{background:rgb(101, 119, 135);border:1px solid rgb(101, 119, 135)}.duet-theme-turva.sc-duet-checkbox .duet-checkbox[disabled].sc-duet-checkbox:checked+label.sc-duet-checkbox::before{background:rgb(116, 116, 117);border-color:rgb(116, 116, 117)}.duet-checkbox-error.sc-duet-checkbox{margin-left:31px;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:0.875rem;font-weight:400;line-height:1.25;color:rgb(222, 35, 98);border-radius:4px}.duet-theme-turva.sc-duet-checkbox .duet-checkbox-error.sc-duet-checkbox{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(224, 42, 13)}.duet-label-hidden.sc-duet-checkbox .duet-label.sc-duet-checkbox span.sc-duet-checkbox,.duet-label-hidden.sc-duet-checkbox .duet-checkbox-error.sc-duet-checkbox span.sc-duet-checkbox{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);border:0}";
 
 class DuetCheckbox {
     constructor(hostRef) {
@@ -9933,19 +9958,7 @@ class DuetChip {
     }; }
 }
 
-const focusElement = (element) => {
-    if ("setFocus" in element) {
-        element.setFocus();
-    }
-    else {
-        element.focus();
-    }
-};
-const FocusGuard = ({ moveFocusTo }) => {
-    return hAsync("div", { class: "duet-focus-guard", "aria-hidden": "true", tabIndex: 0, onFocus: () => focusElement(moveFocusTo) });
-};
-
-const duetChoiceCss = "*.sc-duet-choice,*.sc-duet-choice::after,*.sc-duet-choice::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}.sc-duet-choice-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;margin-right:16px !important;margin-bottom:12px !important;display:inline-flex;flex-direction:column;width:auto;max-width:100%;vertical-align:bottom;-webkit-tap-highlight-color:transparent}.sc-duet-choice-h:last-child,.sc-duet-choice-h:last-of-type{margin-right:0 !important}@media (max-width: 35.9375em){.sc-duet-choice-h{width:100%}}.duet-expand.sc-duet-choice-h{width:100% !important}.duet-m-0.sc-duet-choice-h{margin:0 !important}.duet-fixed.sc-duet-choice-h{width:auto !important}.vertical.sc-duet-choice-h{margin-right:0 !important}@media (min-width: 48em){.horizontal.sc-duet-choice-h{margin-bottom:0 !important}}@media (min-width: 48em){.horizontal-responsive.sc-duet-choice-h{margin-bottom:0 !important;margin-right:16px !important}.horizontal-responsive.sc-duet-choice-h:last-child,.horizontal-responsive.sc-duet-choice-h:last-of-type{margin-right:0 !important}}.sc-duet-choice-h:last-child:not(:only-child){margin-right:0 !important}.duet-choice-card.sc-duet-choice{position:relative;display:block;width:100%;min-width:8rem;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:1rem;font-weight:400;-webkit-hyphens:auto;hyphens:auto;line-height:1.1;color:rgb(0, 41, 77) !important;text-align:left;background:rgb(255, 255, 255);border-width:1px}.duet-choice-card.duet-p-0.sc-duet-choice{padding:0 !important}.duet-choice-card.duet-m-0.sc-duet-choice{margin:0 !important}.duet-theme-turva.sc-duet-choice .duet-choice-card.sc-duet-choice{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(23, 28, 58) !important}.duet-choice-card-flextainer.sc-duet-choice{display:flex}.duet-choice-label.sc-duet-choice{-webkit-user-select:none;user-select:none;position:relative;z-index:100;display:flex;gap:1rem;align-items:center;justify-content:flex-start;width:100%;height:100%;min-height:3.875rem;padding:calc(1rem + 1px);font-size:1rem;font-weight:600;text-decoration:none;word-break:break-word;cursor:pointer;border:1px solid rgb(225, 227, 230);border-radius:8px;transition:background-color 150ms ease, border-color 300ms ease}.duet-choice-label.has-before-text.sc-duet-choice .duet-choice-card-icon.sc-duet-choice,.duet-choice-label.has-before-text.sc-duet-choice .duet-choice-card-text.sc-duet-choice{align-self:flex-start;margin-top:0.25rem}.duet-choice-label.sc-duet-choice>div.sc-duet-choice:last-child{flex:1;align-self:flex-start;justify-self:flex-end;margin-top:0.25rem}.has-info.sc-duet-choice .duet-choice-label.sc-duet-choice{border-top-right-radius:0;border-bottom-right-radius:0}.info.sc-duet-choice .duet-choice-label.sc-duet-choice{border-bottom-right-radius:0;border-bottom-left-radius:0}.duet-theme-turva.sc-duet-choice .duet-choice-label.sc-duet-choice{border-color:rgb(228, 228, 230)}.duet-theme-turva.sc-duet-choice .info.sc-duet-choice .duet-choice-label.sc-duet-choice{border-color:rgb(228, 228, 230)}.duet-choice-label.sc-duet-choice:active{opacity:0.75;transition:none !important}.checked.sc-duet-choice>.duet-choice-label.sc-duet-choice{padding:1rem;color:rgb(0, 119, 179) !important;background:rgb(243, 249, 252);border-color:rgb(0, 119, 179) !important;border-width:2px}.checked.sc-duet-choice>.duet-choice-label.sc-duet-choice .duet-checkmark-container.sc-duet-choice{border-color:rgb(0, 119, 179)}.duet-theme-turva.sc-duet-choice .checked.sc-duet-choice>.duet-choice-label.sc-duet-choice{color:rgb(23, 28, 58) !important;background:rgb(245, 245, 247);border-color:rgb(23, 28, 58) !important}.duet-theme-turva.sc-duet-choice .checked.sc-duet-choice>.duet-choice-label.sc-duet-choice .duet-checkmark-container.sc-duet-choice{border-color:rgb(198, 12, 48)}.checked.collapsible.sc-duet-choice>.duet-choice-label.sc-duet-choice,.collapsible-force-expanded.collapsible.sc-duet-choice>.duet-choice-label.sc-duet-choice{padding-bottom:calc(1rem + 1px);border-bottom:0 !important;border-bottom-right-radius:0;border-bottom-left-radius:0}.sc-duet-choice-h:not(.no-hover):not(.disabled):hover>.duet-choice-card-flextainer.sc-duet-choice .duet-choice-label.sc-duet-choice:not(.checked){border-color:rgb(0, 119, 179);border-width:2px}.sc-duet-choice-h:not(.no-hover):not(.disabled):hover>.duet-choice-card-flextainer.sc-duet-choice .duet-choice-label.sc-duet-choice:not(.checked) .duet-checkmark-container.sc-duet-choice{border-color:rgb(144, 149, 153)}.duet-theme-turva .sc-duet-choice-h:not(.no-hover):not(.disabled):hover>.duet-choice-card-flextainer.sc-duet-choice .duet-choice-label.sc-duet-choice:not(.checked){border-color:rgb(116, 116, 117)}.duet-theme-turva .sc-duet-choice-h:not(.no-hover):not(.disabled):hover>.duet-choice-card-flextainer.sc-duet-choice .duet-choice-label.sc-duet-choice:not(.checked) .duet-checkmark-container.sc-duet-choice{border-color:rgb(116, 116, 117)}.duet-theme-turva .info .sc-duet-choice-h:not(.no-hover):not(.disabled):hover>.duet-choice-card-flextainer.sc-duet-choice .duet-choice-label.sc-duet-choice:not(.checked){border-color:rgb(116, 116, 117)}.sc-duet-choice-h:not(.no-hover):not(.disabled):not([checked]):hover>.duet-choice-card-flextainer.sc-duet-choice .duet-choice-label.sc-duet-choice:not(.checked){padding:1rem}input.sc-duet-choice:focus{outline:0}.user-is-tabbing.sc-duet-choice-h input.sc-duet-choice:checked:focus+.duet-choice-label.sc-duet-choice{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3)}.user-is-tabbing.sc-duet-choice-h input.sc-duet-choice:not(:checked):focus+.duet-choice-label.sc-duet-choice{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}.user-is-tabbing.duet-theme-turva.sc-duet-choice-h input.sc-duet-choice:checked:focus+.duet-choice-label.sc-duet-choice{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2)}.user-is-tabbing.duet-theme-turva.sc-duet-choice-h input.sc-duet-choice:not(:checked):focus+.duet-choice-label.sc-duet-choice{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}input[disabled].sc-duet-choice+.duet-choice-label.sc-duet-choice{color:rgb(101, 119, 135) !important;cursor:default !important;background:rgb(245, 248, 250) !important;border-color:rgb(225, 227, 230) !important}input[disabled].sc-duet-choice+.duet-choice-label.sc-duet-choice .duet-checkmark.sc-duet-choice{border-color:rgb(101, 119, 135) !important}input[disabled].sc-duet-choice+.duet-choice-label.sc-duet-choice:hover,input[disabled].sc-duet-choice+.duet-choice-label.sc-duet-choice:active,input[disabled].sc-duet-choice+.duet-choice-label.sc-duet-choice:focus{box-shadow:none !important;opacity:1 !important;transition:none !important}.duet-theme-turva.sc-duet-choice input[disabled].sc-duet-choice+.duet-choice-label.sc-duet-choice{color:rgb(116, 116, 117) !important;background:rgb(245, 245, 247) !important;border-color:rgb(228, 228, 230) !important}.duet-theme-turva.sc-duet-choice input[disabled].sc-duet-choice+.duet-choice-label.sc-duet-choice .duet-checkmark.sc-duet-choice{border-color:rgb(116, 116, 117) !important}.checked.sc-duet-choice>input[disabled].sc-duet-choice+.duet-choice-label.sc-duet-choice{background:rgb(225, 227, 230) !important;border-color:rgb(225, 227, 230) !important}.duet-theme-turva.sc-duet-choice .checked.sc-duet-choice>input[disabled].sc-duet-choice+.duet-choice-label.sc-duet-choice{background:rgb(228, 228, 230) !important;border-color:rgb(228, 228, 230) !important}.duet-checkmark-container.sc-duet-choice{position:relative;width:20px;height:20px;margin-left:auto;border:1px solid rgb(144, 149, 153);border-radius:4px;transition:border 300ms ease}.duet-theme-turva.sc-duet-choice .duet-checkmark-container.sc-duet-choice{border-color:rgb(116, 116, 117)}.checked.sc-duet-choice>.duet-choice-label.sc-duet-choice .duet-checkmark-container.sc-duet-choice{background:rgb(0, 119, 179);border-color:rgb(0, 119, 179);transition:none}.duet-theme-turva.sc-duet-choice .checked.sc-duet-choice>.duet-choice-label.sc-duet-choice .duet-checkmark-container.sc-duet-choice{background:rgb(23, 28, 58);border-color:rgb(23, 28, 58) !important}.duet-checkmark-container.duet-checkmark-radio.sc-duet-choice{border-radius:50%}[disabled].sc-duet-choice+label.sc-duet-choice .duet-checkmark-container.sc-duet-choice{border-color:rgb(207, 210, 212) !important}.duet-theme-turva.sc-duet-choice [disabled].sc-duet-choice+label.sc-duet-choice .duet-checkmark-container.sc-duet-choice{border-color:rgb(207, 207, 209) !important}.checked.sc-duet-choice>[disabled].sc-duet-choice+label.sc-duet-choice .duet-checkmark-container.sc-duet-choice{background:rgb(207, 210, 212) !important}.duet-theme-turva.sc-duet-choice .checked.sc-duet-choice>[disabled].sc-duet-choice+label.sc-duet-choice .duet-checkmark-container.sc-duet-choice{background:rgb(207, 207, 209) !important}.duet-checkmark.sc-duet-choice{position:absolute;top:10px;left:3px;width:5.3333333333px;height:11.8518518519px;border-top:2px solid rgb(255, 255, 255);border-right:2px solid rgb(255, 255, 255);opacity:1;transform:scaleX(-1) rotate(135deg) translateZ(0);transform-origin:left top;animation-name:duet-checkmark;animation-duration:600ms;animation-timing-function:ease-out;animation-fill-mode:forwards}@keyframes duet-checkmark{0%{width:0;height:0;opacity:1}20%{width:5.3333333333px;height:0;opacity:1}40%,100%{width:5.3333333333px;height:11.8518518519px;opacity:1}}.duet-choice-card-icon.sc-duet-choice{position:relative}.duet-choice-card-icon.sc-duet-choice duet-icon.sc-duet-choice{display:block}.duet-choice-section-hidden.sc-duet-choice{display:none}.duet-choice-card-info.duet-choice-card-collapsed.sc-duet-choice,.duet-choice-card-collapsed.duet-choice-card-collapsible.sc-duet-choice{position:relative;width:auto;padding:0 !important;background:unset !important;border:0;border-radius:0}.duet-choice-card-info.sc-duet-choice,.duet-choice-card-collapsible.sc-duet-choice{padding:20px !important;position:relative;width:100%;font-weight:400;color:rgb(0, 41, 77);border:1px solid rgb(225, 227, 230);border-top:0;border-radius:0 0 8px 8px}@media (min-width: 36em){.duet-choice-card-info.sc-duet-choice,.duet-choice-card-collapsible.sc-duet-choice{padding:28px !important}}.duet-theme-turva.sc-duet-choice .duet-choice-card-info.sc-duet-choice,.duet-theme-turva.sc-duet-choice .duet-choice-card-collapsible.sc-duet-choice{color:rgb(23, 28, 58);border-color:rgb(23, 28, 58)}.checked.sc-duet-choice>.duet-choice-card-info.sc-duet-choice,.checked.sc-duet-choice>.duet-choice-card-collapsible.sc-duet-choice{display:block}.duet-choice-card-info-expanded.sc-duet-choice,.duet-choice-card-collapsible-expanded.sc-duet-choice{display:block}.duet-choice-card-collapsible.sc-duet-choice{background:rgb(255, 255, 255);border:1px solid rgb(225, 227, 230);border-top:0}.duet-choice-card-collapsible.duet-theme-turva.sc-duet-choice{background:rgb(255, 255, 255);border-color:rgb(228, 228, 230)}.duet-choice-card-collapsible.checked.sc-duet-choice{border-color:rgb(0, 119, 179);border-width:2px}.duet-choice-card-collapsible.checked.duet-theme-turva.sc-duet-choice{border-color:rgb(23, 28, 58)}.duet-choice-card-collapsible-disabled.sc-duet-choice{background:rgb(245, 248, 250);border-color:rgb(225, 227, 230)}.duet-choice-card-collapsible-disabled.checked.sc-duet-choice{border-color:rgb(225, 227, 230)}.duet-choice-card-collapsible-disabled.duet-theme-turva.sc-duet-choice{background:rgb(245, 245, 247);border-color:rgb(228, 228, 230)}.duet-choice-card-collapsible-disabled.duet-theme-turva.checked.sc-duet-choice{border-color:rgb(228, 228, 230)}.duet-choice-card-info.sc-duet-choice{font-size:0.875rem;line-height:1.5;background:rgb(245, 248, 250);transition:150ms ease-out}.duet-choice-card-info.duet-theme-turva.sc-duet-choice{background:rgb(245, 245, 247);border-color:rgb(228, 228, 230)}.duet-choice-card-info.sc-duet-choice .duet-choice-info-container.sc-duet-choice:focus{outline:none}.duet-choice-card-info.duet-choice-card-collapsed .duet-choice-info-container.sc-duet-choice-s>*,.duet-choice-card-info.duet-choice-card-collapsed .duet-choice-info-container .sc-duet-choice-s>*{display:none}.sc-duet-choice-h:not(.no-hover):not(.disabled):hover>.duet-choice-card-collapsible.sc-duet-choice:not(.checked){border-color:rgb(0, 119, 179);border-width:2px}.duet-theme-turva .sc-duet-choice-h:not(.no-hover):not(.disabled):hover>.duet-choice-card-collapsible.sc-duet-choice:not(.checked){border-color:rgb(116, 116, 117)}.duet-choice-info-toggle.sc-duet-choice{display:flex;flex-shrink:0;align-items:flex-start;justify-content:center;width:57.6px;padding-top:1.25rem;cursor:pointer;background:rgb(255, 255, 255);border:1px solid rgb(225, 227, 230);border-left:0 none;border-top-right-radius:8px;border-bottom-right-radius:8px;-webkit-appearance:none;appearance:none}.duet-choice-info-toggle[aria-expanded=true].sc-duet-choice{background:rgb(245, 248, 250);border-bottom-color:transparent;border-bottom-right-radius:0}.duet-theme-turva.sc-duet-choice .duet-choice-info-toggle[aria-expanded=true].sc-duet-choice{background:rgb(245, 245, 247)}.duet-choice-info-toggle[disabled].sc-duet-choice{pointer-events:none;background:rgb(245, 248, 250) !important;border-color:rgb(225, 227, 230) !important}.duet-choice-info-toggle[disabled].sc-duet-choice .duet-choice-info-icon.sc-duet-choice{color:rgb(144, 149, 153) !important}.duet-choice-info-toggle[disabled].duet-theme-turva.sc-duet-choice{background:rgb(245, 245, 247) !important;border-color:rgb(228, 228, 230) !important}.duet-choice-info-toggle[disabled].duet-theme-turva.sc-duet-choice .duet-choice-info-icon.sc-duet-choice{color:rgb(116, 116, 117) !important}.duet-choice-info-toggle.sc-duet-choice:focus{outline:none}.user-is-tabbing.sc-duet-choice-h .duet-choice-info-toggle.sc-duet-choice:focus{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}.user-is-tabbing.sc-duet-choice-h .duet-theme-turva.sc-duet-choice .duet-choice-info-toggle.sc-duet-choice:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.checked.sc-duet-choice+.duet-choice-info-toggle.sc-duet-choice{border-left-color:rgb(0, 119, 179) !important}.duet-choice-info-toggle.sc-duet-choice duet-icon.sc-duet-choice{display:block}.duet-choice-info-toggle.sc-duet-choice .duet-choice-info-icon.sc-duet-choice{color:rgb(0, 119, 179)}.duet-theme-turva.sc-duet-choice .duet-choice-info-toggle.sc-duet-choice .duet-choice-info-icon.sc-duet-choice{color:rgb(198, 12, 48)}.sc-duet-choice-h:not(.no-hover):not(.disabled):hover>.duet-choice-card-flextainer.sc-duet-choice .duet-choice-label.sc-duet-choice .duet-choice-info-toggle.sc-duet-choice{border-left-color:rgb(144, 149, 153)}.duet-theme-turva .sc-duet-choice-h:not(.no-hover):not(.disabled):hover>.duet-choice-card-flextainer.sc-duet-choice .duet-choice-label.sc-duet-choice .duet-choice-info-toggle.sc-duet-choice{border-left-color:rgb(116, 116, 117)}.duet-choice-input.sc-duet-choice{position:absolute !important;width:100%;height:100%;opacity:0}";
+const duetChoiceCss = "*.sc-duet-choice,*.sc-duet-choice::after,*.sc-duet-choice::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}.sc-duet-choice-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;margin-right:16px !important;margin-bottom:12px !important;display:inline-flex;flex-direction:column;width:auto;max-width:100%;vertical-align:bottom;-webkit-tap-highlight-color:transparent}.sc-duet-choice-h:last-child,.sc-duet-choice-h:last-of-type{margin-right:0 !important}@media (max-width: 35.9375em){.sc-duet-choice-h{width:100%}}.duet-expand.sc-duet-choice-h{width:100% !important}.duet-m-0.sc-duet-choice-h{margin:0 !important}.duet-fixed.sc-duet-choice-h{width:auto !important}.vertical.sc-duet-choice-h{margin-right:0 !important}@media (min-width: 48em){.horizontal.sc-duet-choice-h{margin-bottom:0 !important}}@media (min-width: 48em){.horizontal-responsive.sc-duet-choice-h{margin-bottom:0 !important;margin-right:16px !important}.horizontal-responsive.sc-duet-choice-h:last-child,.horizontal-responsive.sc-duet-choice-h:last-of-type{margin-right:0 !important}}.sc-duet-choice-h:last-child:not(:only-child){margin-right:0 !important}.duet-choice-card.sc-duet-choice{position:relative;display:block;width:100%;min-width:8rem;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:1rem;font-weight:400;-webkit-hyphens:auto;hyphens:auto;line-height:1.1;color:rgb(0, 41, 77) !important;text-align:left;background:rgb(255, 255, 255);border-width:1px}.duet-choice-card.duet-p-0.sc-duet-choice{padding:0 !important}.duet-choice-card.duet-m-0.sc-duet-choice{margin:0 !important}.duet-theme-turva.sc-duet-choice .duet-choice-card.sc-duet-choice{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(23, 28, 58) !important}.duet-choice-card-flextainer.sc-duet-choice{display:flex}.duet-choice-label.sc-duet-choice{-webkit-user-select:none;user-select:none;position:relative;z-index:100;display:flex;gap:12px;align-items:center;justify-content:flex-start;width:100%;height:100%;min-height:3.875rem;padding:calc(1rem + 1px);font-size:1rem;font-weight:600;text-decoration:none;word-break:break-word;cursor:pointer;border:1px solid rgb(225, 227, 230);border-radius:8px;transition:background-color 150ms ease, border-color 300ms ease}.duet-choice-label.has-before-text.sc-duet-choice .duet-choice-card-icon.sc-duet-choice,.duet-choice-label.has-before-text.sc-duet-choice .duet-choice-card-text.sc-duet-choice{align-self:flex-start;margin-top:0.25rem}.duet-choice-label.sc-duet-choice>div.sc-duet-choice:last-child{flex:1;align-self:flex-start;justify-self:flex-end;margin-top:0.25rem}.has-info.sc-duet-choice .duet-choice-label.sc-duet-choice{border-top-right-radius:0;border-bottom-right-radius:0}.info.sc-duet-choice .duet-choice-label.sc-duet-choice{border-bottom-right-radius:0;border-bottom-left-radius:0}.duet-theme-turva.sc-duet-choice .duet-choice-label.sc-duet-choice{border-color:rgb(228, 228, 230)}.duet-theme-turva.sc-duet-choice .info.sc-duet-choice .duet-choice-label.sc-duet-choice{border-color:rgb(228, 228, 230)}.duet-choice-label.sc-duet-choice:active{opacity:0.75;transition:none !important}.checked.sc-duet-choice>.duet-choice-label.sc-duet-choice{padding:1rem;background:rgb(243, 249, 252);border-color:rgb(0, 119, 179) !important;border-width:2px}.checked.sc-duet-choice>.duet-choice-label.sc-duet-choice .duet-checkmark-container.sc-duet-choice{border-color:rgb(0, 119, 179)}.duet-theme-turva.sc-duet-choice .checked.sc-duet-choice>.duet-choice-label.sc-duet-choice{background:rgb(245, 245, 247);border-color:rgb(23, 28, 58) !important}.duet-theme-turva.sc-duet-choice .checked.sc-duet-choice>.duet-choice-label.sc-duet-choice .duet-checkmark-container.sc-duet-choice{border-color:rgb(198, 12, 48)}.checked.collapsible.sc-duet-choice>.duet-choice-label.sc-duet-choice,.collapsible-force-expanded.collapsible.sc-duet-choice>.duet-choice-label.sc-duet-choice{padding-bottom:calc(1rem + 2px) !important;border-bottom:0 !important;border-bottom-right-radius:0;border-bottom-left-radius:0}.sc-duet-choice-h:not(.no-hover):not(.disabled):hover>.duet-choice-card-flextainer.sc-duet-choice .duet-choice-label.sc-duet-choice:not(.checked){border-color:rgb(0, 119, 179);border-width:2px}.sc-duet-choice-h:not(.no-hover):not(.disabled):hover>.duet-choice-card-flextainer.sc-duet-choice .duet-choice-label.sc-duet-choice:not(.checked) .duet-checkmark-container.sc-duet-choice{border-color:rgb(144, 149, 153)}.duet-theme-turva .sc-duet-choice-h:not(.no-hover):not(.disabled):hover>.duet-choice-card-flextainer.sc-duet-choice .duet-choice-label.sc-duet-choice:not(.checked){border-color:rgb(23, 28, 58)}.duet-theme-turva .sc-duet-choice-h:not(.no-hover):not(.disabled):hover>.duet-choice-card-flextainer.sc-duet-choice .duet-choice-label.sc-duet-choice:not(.checked) .duet-checkmark-container.sc-duet-choice{border-color:rgb(116, 116, 117)}.duet-theme-turva .info .sc-duet-choice-h:not(.no-hover):not(.disabled):hover>.duet-choice-card-flextainer.sc-duet-choice .duet-choice-label.sc-duet-choice:not(.checked){border-color:rgb(116, 116, 117)}.sc-duet-choice-h:not(.no-hover):not(.disabled):not([checked]):hover>.duet-choice-card-flextainer.sc-duet-choice .duet-choice-label.sc-duet-choice:not(.checked){padding:1rem}input.sc-duet-choice:focus{outline:0}.user-is-tabbing.sc-duet-choice-h input.sc-duet-choice:checked:focus+.duet-choice-label.sc-duet-choice{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3)}.user-is-tabbing.sc-duet-choice-h input.sc-duet-choice:not(:checked):focus+.duet-choice-label.sc-duet-choice{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}.user-is-tabbing.duet-theme-turva.sc-duet-choice-h input.sc-duet-choice:checked:focus+.duet-choice-label.sc-duet-choice{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2)}.user-is-tabbing.duet-theme-turva.sc-duet-choice-h input.sc-duet-choice:not(:checked):focus+.duet-choice-label.sc-duet-choice{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}input[disabled].sc-duet-choice+.duet-choice-label.sc-duet-choice{color:rgb(101, 119, 135) !important;cursor:default !important;background:rgb(245, 248, 250) !important;border-color:rgb(225, 227, 230) !important}input[disabled].sc-duet-choice+.duet-choice-label.sc-duet-choice .duet-choice-card-icon.sc-duet-choice{color:rgb(101, 119, 135)}.duet-theme-turva.sc-duet-choice input[disabled].sc-duet-choice+.duet-choice-label.sc-duet-choice .duet-choice-card-icon.sc-duet-choice{color:rgb(116, 116, 117)}input[disabled].sc-duet-choice+.duet-choice-label.sc-duet-choice .duet-checkmark.sc-duet-choice{border-color:rgb(101, 119, 135) !important}input[disabled].sc-duet-choice+.duet-choice-label.sc-duet-choice:hover,input[disabled].sc-duet-choice+.duet-choice-label.sc-duet-choice:active,input[disabled].sc-duet-choice+.duet-choice-label.sc-duet-choice:focus{box-shadow:none !important;opacity:1 !important;transition:none !important}.duet-theme-turva.sc-duet-choice input[disabled].sc-duet-choice+.duet-choice-label.sc-duet-choice{color:rgb(116, 116, 117) !important;background:rgb(245, 245, 247) !important;border-color:rgb(228, 228, 230) !important}.duet-theme-turva.sc-duet-choice input[disabled].sc-duet-choice+.duet-choice-label.sc-duet-choice .duet-checkmark.sc-duet-choice{border-color:rgb(116, 116, 117) !important}.checked.sc-duet-choice>input[disabled].sc-duet-choice+.duet-choice-label.sc-duet-choice{border-color:rgb(144, 149, 153) !important}.duet-theme-turva.sc-duet-choice .checked.sc-duet-choice>input[disabled].sc-duet-choice+.duet-choice-label.sc-duet-choice{border-color:rgb(116, 116, 117) !important}.duet-checkmark-container.sc-duet-choice{position:relative;width:20px;height:20px;margin-left:auto;border:1px solid rgb(144, 149, 153);border-radius:4px;transition:border 300ms ease}.duet-theme-turva.sc-duet-choice .duet-checkmark-container.sc-duet-choice{border-color:rgb(116, 116, 117)}.checked.sc-duet-choice>.duet-choice-label.sc-duet-choice .duet-checkmark-container.sc-duet-choice{background:rgb(0, 119, 179);border-color:rgb(0, 119, 179);transition:none}.duet-theme-turva.sc-duet-choice .checked.sc-duet-choice>.duet-choice-label.sc-duet-choice .duet-checkmark-container.sc-duet-choice{background:rgb(23, 28, 58);border-color:rgb(23, 28, 58) !important}.duet-checkmark-container.duet-checkmark-radio.sc-duet-choice{border-radius:50%}[disabled].sc-duet-choice+label.sc-duet-choice .duet-checkmark-container.sc-duet-choice{background:rgb(207, 210, 212) !important;border-color:rgb(207, 210, 212) !important}.duet-theme-turva.sc-duet-choice [disabled].sc-duet-choice+label.sc-duet-choice .duet-checkmark-container.sc-duet-choice{border-color:rgb(207, 207, 209) !important}.checked.sc-duet-choice>[disabled].sc-duet-choice+label.sc-duet-choice .duet-checkmark-container.sc-duet-choice{background:rgb(207, 210, 212) !important}.duet-theme-turva.sc-duet-choice .checked.sc-duet-choice>[disabled].sc-duet-choice+label.sc-duet-choice .duet-checkmark-container.sc-duet-choice{background:rgb(207, 207, 209) !important;border-color:rgb(207, 207, 209) !important}.duet-checkmark.sc-duet-choice{position:absolute;top:10px;left:3px;width:5.3333333333px;height:11.8518518519px;border-top:2px solid rgb(255, 255, 255);border-right:2px solid rgb(255, 255, 255);opacity:1;transform:scaleX(-1) rotate(135deg) translateZ(0);transform-origin:left top;animation-name:duet-checkmark;animation-duration:600ms;animation-timing-function:ease-out;animation-fill-mode:forwards}@keyframes duet-checkmark{0%{width:0;height:0;opacity:1}20%{width:5.3333333333px;height:0;opacity:1}40%,100%{width:5.3333333333px;height:11.8518518519px;opacity:1}}.duet-choice-card-icon.sc-duet-choice{position:relative;color:rgb(0, 119, 179)}.duet-theme-turva.sc-duet-choice .duet-choice-card-icon.sc-duet-choice{color:rgb(173, 11, 43)}.duet-choice-card-icon.sc-duet-choice duet-icon.sc-duet-choice{display:block}.duet-choice-section-hidden.sc-duet-choice{display:none}.duet-choice-card-info.duet-choice-card-collapsed.sc-duet-choice,.duet-choice-card-collapsed.duet-choice-card-collapsible.sc-duet-choice{position:relative;width:auto;padding:0 !important;background:unset !important;border:0;border-radius:0}.duet-choice-card-info.sc-duet-choice,.duet-choice-card-collapsible.sc-duet-choice{padding:20px !important;position:relative;width:100%;font-weight:400;color:rgb(0, 41, 77);border:1px solid rgb(225, 227, 230);border-top:0;border-radius:0 0 8px 8px;transition:border-color 300ms ease}@media (min-width: 36em){.duet-choice-card-info.sc-duet-choice,.duet-choice-card-collapsible.sc-duet-choice{padding:28px !important}}.duet-theme-turva.sc-duet-choice .duet-choice-card-info.sc-duet-choice,.duet-theme-turva.sc-duet-choice .duet-choice-card-collapsible.sc-duet-choice{color:rgb(23, 28, 58);border-color:rgb(23, 28, 58)}.checked.sc-duet-choice>.duet-choice-card-info.sc-duet-choice,.checked.sc-duet-choice>.duet-choice-card-collapsible.sc-duet-choice{display:block}.duet-choice-card-info-expanded.sc-duet-choice,.duet-choice-card-collapsible-expanded.sc-duet-choice{display:block}.duet-choice-card-collapsible.sc-duet-choice{background:rgb(255, 255, 255);border:1px solid rgb(225, 227, 230);border-top:0}.duet-choice-card-collapsible.duet-theme-turva.sc-duet-choice{background:rgb(255, 255, 255);border-color:rgb(228, 228, 230)}.duet-choice-card-collapsible.checked.sc-duet-choice{padding:19px !important;padding-top:20px !important;border-color:rgb(0, 119, 179);border-width:2px}@media (min-width: 36em){.duet-choice-card-collapsible.checked.sc-duet-choice{padding:27px !important;padding-top:28px !important}}.duet-choice-card-collapsible.checked.duet-theme-turva.sc-duet-choice{border-color:rgb(23, 28, 58)}.duet-choice-card-collapsible-disabled.sc-duet-choice{background:rgb(245, 248, 250);border-color:rgb(225, 227, 230)}.duet-choice-card-collapsible-disabled.checked.sc-duet-choice{border-color:rgb(225, 227, 230)}.duet-choice-card-collapsible-disabled.duet-theme-turva.sc-duet-choice{background:rgb(245, 245, 247);border-color:rgb(228, 228, 230)}.duet-choice-card-collapsible-disabled.duet-theme-turva.checked.sc-duet-choice{border-color:rgb(228, 228, 230)}.duet-choice-card-info.sc-duet-choice{font-size:0.875rem;line-height:1.5;background:rgb(245, 248, 250);transition:150ms ease-out}.duet-choice-card-info.duet-theme-turva.sc-duet-choice{background:rgb(245, 245, 247);border-color:rgb(228, 228, 230)}.duet-choice-card-info.duet-choice-card-collapsed .duet-choice-info-container.sc-duet-choice-s>*,.duet-choice-card-info.duet-choice-card-collapsed .duet-choice-info-container .sc-duet-choice-s>*{display:none}.user-is-tabbing.sc-duet-choice-h .duet-choice-info-container.sc-duet-choice:focus{display:block;outline:none;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}.sc-duet-choice-h:not(.no-hover):not(.disabled):hover>.duet-choice-card-collapsible.sc-duet-choice:not(.checked){border-color:rgb(0, 119, 179);border-width:2px}.duet-theme-turva .sc-duet-choice-h:not(.no-hover):not(.disabled):hover>.duet-choice-card-collapsible.sc-duet-choice:not(.checked){border-color:rgb(116, 116, 117)}[collapsible-force-expanded].sc-duet-choice-h:not(.no-hover):not(.disabled):hover>.duet-choice-card-collapsible.sc-duet-choice:not(.checked){padding:19px !important;padding-top:20px !important}@media (min-width: 36em){[collapsible-force-expanded].sc-duet-choice-h:not(.no-hover):not(.disabled):hover>.duet-choice-card-collapsible.sc-duet-choice:not(.checked){padding:27px !important;padding-top:28px !important}}.duet-choice-info-toggle.sc-duet-choice{display:flex;flex-shrink:0;align-items:flex-start;justify-content:center;width:57.6px;padding-top:1.25rem;cursor:pointer;background:rgb(255, 255, 255);border:1px solid rgb(225, 227, 230);border-left:0 none;border-top-right-radius:8px;border-bottom-right-radius:8px;-webkit-appearance:none;appearance:none}.duet-choice-info-toggle[aria-expanded=true].sc-duet-choice{background:rgb(245, 248, 250);border-bottom-color:transparent;border-bottom-right-radius:0}.duet-theme-turva.sc-duet-choice .duet-choice-info-toggle[aria-expanded=true].sc-duet-choice{background:rgb(245, 245, 247)}.duet-choice-info-toggle[disabled].sc-duet-choice{pointer-events:none;background:rgb(245, 248, 250) !important;border-color:rgb(225, 227, 230) !important}.duet-choice-info-toggle[disabled].sc-duet-choice .duet-choice-info-icon.sc-duet-choice{color:rgb(144, 149, 153) !important}.duet-choice-info-toggle[disabled].duet-theme-turva.sc-duet-choice{background:rgb(245, 245, 247) !important;border-color:rgb(228, 228, 230) !important}.duet-choice-info-toggle[disabled].duet-theme-turva.sc-duet-choice .duet-choice-info-icon.sc-duet-choice{color:rgb(116, 116, 117) !important}.duet-choice-info-toggle.sc-duet-choice:focus{outline:none}.user-is-tabbing.sc-duet-choice-h .duet-choice-info-toggle.sc-duet-choice:focus{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}.user-is-tabbing.sc-duet-choice-h .duet-theme-turva.sc-duet-choice .duet-choice-info-toggle.sc-duet-choice:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.checked.sc-duet-choice+.duet-choice-info-toggle.sc-duet-choice{border-left-color:rgb(0, 119, 179) !important}.duet-choice-info-toggle.sc-duet-choice duet-icon.sc-duet-choice{display:block}.duet-choice-info-toggle.sc-duet-choice .duet-choice-info-icon.sc-duet-choice{color:rgb(0, 119, 179)}.duet-theme-turva.sc-duet-choice .duet-choice-info-toggle.sc-duet-choice .duet-choice-info-icon.sc-duet-choice{color:rgb(198, 12, 48)}.sc-duet-choice-h:not(.no-hover):not(.disabled):hover>.duet-choice-card-flextainer.sc-duet-choice .duet-choice-label.sc-duet-choice .duet-choice-info-toggle.sc-duet-choice{border-left-color:rgb(144, 149, 153)}.duet-theme-turva .sc-duet-choice-h:not(.no-hover):not(.disabled):hover>.duet-choice-card-flextainer.sc-duet-choice .duet-choice-label.sc-duet-choice .duet-choice-info-toggle.sc-duet-choice{border-left-color:rgb(116, 116, 117)}.duet-choice-input.sc-duet-choice{position:absolute !important;width:100%;height:100%;opacity:0}";
 
 /**
  * @slot unnamed default slot - The component’s primary content. All child nodes that do not have a slot attribute defined are inserted into this primary slot.
@@ -9968,6 +9981,9 @@ class DuetChoice {
         this.expandId = createID("DuetChoiceExpand");
         this.headerId = createID("DuetChoiceHeader");
         this.infoButtonId = createID("DuetChoiceInfoButton");
+        /**
+         * Component event handling.
+         */
         this.onMouseEnter = () => {
             this.isHovering = true;
         };
@@ -10018,7 +10034,6 @@ class DuetChoice {
             if (this.getDisabled()) {
                 return;
             }
-            this.isInfoOpen = false;
             // if it's a radio button, and it's already checked
             // we shouldn't fire an event, so exit early
             if (this.type === "radio" && this.checked) {
@@ -10038,12 +10053,11 @@ class DuetChoice {
                 setTimeout(() => {
                     var _a;
                     (_a = this.infoContainer) === null || _a === void 0 ? void 0 : _a.focus();
-                });
+                }, 150);
             }
         };
         this.isHovering = false;
         this.isInfoOpen = false;
-        this.isBlurred = false;
         this.theme = "";
         this.label = "label";
         this.accessibleLabelInfoButtonDefaults = DuetStringsExternalDefaults;
@@ -10111,30 +10125,6 @@ class DuetChoice {
         unsubscribeTabbingChange(this);
         this.duetChoiceRemove.emit();
     }
-    /**
-     * Component event handling.
-     */
-    handleHostBlur(ev) {
-        /**
-         * When moving away from a choice, collapse the info bar to assist visually impared people on focusing
-         */
-        if (this.hasInfo && this.isInfoOpen && this.isKeyDown) {
-            // @ts-ignore
-            const isTargetContainedInHost = this.element.contains(ev === null || ev === void 0 ? void 0 : ev.relatedTarget) || false;
-            if (!isTargetContainedInHost) {
-                this.toggleInfo();
-            }
-        }
-    }
-    handleHostKeyDown() {
-        this.isKeyDown = true;
-    }
-    handleHostKeyUp(ev) {
-        this.isKeyDown = false;
-        if (isEscapeKey(ev) && this.isInfoOpen) {
-            this.toggleInfo();
-        }
-    }
     /**
      * Sets focus on the specified `duet-choice`. Use this method instead of the global
      * `input.focus()`.
@@ -10148,6 +10138,16 @@ class DuetChoice {
     async toggleInfoMethod() {
         this.isInfoOpen = !this.isInfoOpen;
     }
+    handleEscape(e) {
+        if (isEscapeKey(e)) {
+            if (this.isInfoOpen) {
+                this.isInfoOpen = false;
+                if (this.infoButtonEl) {
+                    this.infoButtonEl.focus();
+                }
+            }
+        }
+    }
     /**
      * Should the collapsible content be announced by screen readers
      */
@@ -10256,11 +10256,10 @@ class DuetChoice {
             "collapsibleNotification": [1025, "collapsible-notification"],
             "isHovering": [32],
             "isInfoOpen": [32],
-            "isBlurred": [32],
             "setFocus": [64],
             "toggleInfoMethod": [64]
         },
-        "$listeners$": [[2, "blur", "handleHostBlur"], [2, "keydown", "handleHostKeyDown"], [2, "keyup", "handleHostKeyUp"]],
+        "$listeners$": undefined,
         "$lazyBundleId$": "-",
         "$attrsToReflect$": [["value", "value"], ["type", "type"], ["checked", "checked"], ["disabled", "disabled"]]
     }; }
@@ -11063,6 +11062,52 @@ class DuetCombobox {
                 // this.listElement.style.width = `${currentWidth + 1}px`
             }
         }, 100));
+        this.handleInputKeyDownEvent = (e) => {
+            //if selection is made, close the list and update internal and external values
+            // this should be set to undefined on everything BUT up/down arrow according to the aria 1.1 specs
+            // https://www.w3.org/TR/wai-aria-practices-1.1/#combobox
+            this.input.accessibleActiveDescendant = undefined;
+            if (isEnterKey(e)) {
+                e.preventDefault();
+                this.selectActiveItem();
+                this.updateInputText(false);
+                this.listOpen = false;
+                return;
+            }
+            //tabbing out or escaping, restore initial state
+            if (isEscapeKey(e) || isTabKey(e)) {
+                this.updateInputText(true);
+                this.listOpen = false;
+                return;
+            }
+            //handle arrow up/down navigation
+            let nextActiveItem = this.activeItem;
+            if (isArrowUpKey(e)) {
+                e.preventDefault();
+                nextActiveItem = this.activeItem - 1;
+            }
+            else if (isArrowDownKey(e)) {
+                e.preventDefault();
+                nextActiveItem = this.listOpen ? this.activeItem + 1 : this.activeItem;
+                this.listOpen = true;
+            }
+            if (isArrowDownKey(e) || isArrowUpKey(e)) {
+                const listItems = this.shouldListBeFiltered() ? this.getFilteredItems() : this.processedItems;
+                if (nextActiveItem < 0 || !nextActiveItem) {
+                    nextActiveItem = 0;
+                }
+                if (nextActiveItem >= listItems.length) {
+                    nextActiveItem = listItems.length - 1;
+                }
+                // this should be set to undefined on everything BUT up/down arrow according to the aria 1.1 specs
+                // https://www.w3.org/TR/wai-aria-practices-1.1/#combobox
+                this.input.accessibleActiveDescendant = "active_item";
+                this.activeItem = nextActiveItem;
+                this.scrollToActive();
+            }
+            this.announceActive();
+            return;
+        };
         this.processedItems = null;
         this.inputWidth = 0;
         this.inputValue = "";
@@ -11249,52 +11294,6 @@ class DuetCombobox {
         this.inputValue = e.detail.value;
         this.listOpen = String(this.inputValue).length >= this.minCharacters && ((_a = this.getFilteredItems()) === null || _a === void 0 ? void 0 : _a.length) > 0;
     }
-    handleInputKeyDownEvent(e) {
-        //if selection is made, close the list and update internal and external values
-        // this should be set to undefined on everything BUT up/down arrow according to the aria 1.1 specs
-        // https://www.w3.org/TR/wai-aria-practices-1.1/#combobox
-        this.input.accessibleActiveDescendant = undefined;
-        if (isEnterKey(e)) {
-            e.preventDefault();
-            this.selectActiveItem();
-            this.updateInputText(false);
-            this.listOpen = false;
-            return;
-        }
-        //tabbing out or escaping, restore initial state
-        if (isEscapeKey(e) || isTabKey(e)) {
-            this.updateInputText(true);
-            this.listOpen = false;
-            return;
-        }
-        //handle arrow up/down navigation
-        let nextActiveItem = this.activeItem;
-        if (isArrowUpKey(e)) {
-            e.preventDefault();
-            nextActiveItem = this.activeItem - 1;
-        }
-        else if (isArrowDownKey(e)) {
-            e.preventDefault();
-            nextActiveItem = this.listOpen ? this.activeItem + 1 : this.activeItem;
-            this.listOpen = true;
-        }
-        if (isArrowDownKey(e) || isArrowUpKey(e)) {
-            const listItems = this.shouldListBeFiltered() ? this.getFilteredItems() : this.processedItems;
-            if (nextActiveItem < 0 || !nextActiveItem) {
-                nextActiveItem = 0;
-            }
-            if (nextActiveItem >= listItems.length) {
-                nextActiveItem = listItems.length - 1;
-            }
-            // this should be set to undefined on everything BUT up/down arrow according to the aria 1.1 specs
-            // https://www.w3.org/TR/wai-aria-practices-1.1/#combobox
-            this.input.accessibleActiveDescendant = "active_item";
-            this.activeItem = nextActiveItem;
-            this.scrollToActive();
-        }
-        this.announceActive();
-        return;
-    }
     selectActiveItem() {
         if (this.activeItem === undefined) {
             return;
@@ -11543,6 +11542,18 @@ class DuetCookieConsent {
     }; }
 }
 
+const focusElement = (element) => {
+    if ("setFocus" in element) {
+        element.setFocus();
+    }
+    else {
+        element.focus();
+    }
+};
+const FocusGuard = ({ moveFocusTo }) => {
+    return hAsync("div", { class: "duet-focus-guard", "aria-hidden": "true", tabIndex: 0, onFocus: () => focusElement(moveFocusTo) });
+};
+
 const DATE_FORMAT = /^(\d{1,2})[\.\-\/](\d{1,2})[\.\-\/](\d{4})$/;
 const ISO_DATE_FORMAT = /^(\d{4})-(\d{2})-(\d{2})$/;
 const DATE_OUTPUT_FORMAT = "dd.mm.yyyy";
@@ -12398,7 +12409,7 @@ class DuetFieldset {
         this.compactLabel = false;
         this.error = undefined;
         this.accessibleLiveError = "polite";
-        this.labelHeadingLevel = "h3";
+        this.labelHeadingLevel = "span";
         this.labelHidden = false;
     }
     /**
@@ -13918,7 +13929,7 @@ class DuetHero {
                 href: this.processedBack.href,
                 id: this.processedBack.id,
                 analyticsId: this.processedBack.analyticsId,
-            }) }, this.processedBack.label))), (this.variation === "gray" || this.variation === "minimal") && this.categoryIcon && (hAsync("duet-icon", { class: { "duet-hero-icon": true, "duet-hero-icon-has-heading": this.preHeading !== "" }, size: "x-large", background: this.categoryIconColor, name: this.categoryIcon })), hAsync("div", { class: { "duet-hero-text": true }, part: "duet-hero-text" }, (this.preHeading || this.hasPreHeadingSlot) && (hAsync("duet-paragraph", { margin: "none", class: "duet-hero-pre", size: this.variation === "content" ? "small" : "medium" }, this.preHeading ? (this.preHeading) : (hAsync("span", null, hAsync("slot", { name: "pre-heading" }))))), hAsync("slot", { name: "badge" }), (this.heading || this.hasHeadingSlot) && (hAsync("duet-heading", { theme: this.theme, level: this.level, class: { "duet-hero-heading": true, "duet-hero-heading-has-pre": this.preHeading !== "" }, color: headingColor, visualLevel: headingVisualLevel, margin: campaignOrSection ? "none" : "auto" }, this.heading ? (this.heading) : (hAsync("span", null, hAsync("slot", { name: "heading" }))))), campaignOrSection && this.hasSubHeadingSlot && (hAsync("duet-heading", { theme: this.theme, level: this.subHeadingLevel, class: { "duet-hero-subheading": true }, color: this.theme === "turva" ? "secondary-turva" : "secondary", visualLevel: "h2" }, hAsync("span", null, hAsync("slot", { name: "subheading" })))), this.description && (hAsync("duet-paragraph", { theme: this.theme, color: textColor, variation: "intro" }, this.description)), (this.variation === "gray" || this.variation === "minimal") && this.processedListItems && (hAsync("duet-list", { theme: this.theme, "label-width": "30", breakpoint: "large", mobile: this.leftAlign ? undefined : "center" }, this.processedListItems.map(item => (hAsync("duet-list-item", null, hAsync("span", { slot: "label" }, item.label), hAsync("span", { slot: "value" }, item.value)))))), this.buttonLabel && (hAsync("duet-button", { url: this.buttonUrl, icon: this.icon, iconRight: this.iconRight, iconSize: this.iconSize, variation: buttonVariation, theme: this.theme, identifier: this.buttonId, onClick: event => this.handleClick(event, this.buttonData), fixed: true }, this.buttonLabel)), hAsync("div", { class: "duet-hero-slot-unnamed" }, hAsync("slot", null))), (this.variation === "gray" || this.variation === "minimal") && this.processedActions && (hAsync("div", { class: "duet-hero-links" }, this.processedActions.map(item => (hAsync("a", { class: "duet-hero-link", href: item.href, id: item.id, target: item.external ? "_blank" : "_self", onClick: event => this.handleClick(event, item) }, hAsync("div", { class: "duet-hero-action-icon" }, hAsync("duet-icon", { size: "small", margin: "none", name: item.icon, color: "currentColor", outline: outlineColor })), hAsync("span", null, item.label), item.external && hAsync("duet-visually-hidden", null, ", ", this.accessibleLabelExternal), item.external && (hAsync("div", { class: "duet-hero-action-arrow" }, hAsync("duet-icon", { icon: actionNewWindowSmall.svg, size: "xx-small", margin: "none", color: "currentColor" })))))))), this.image &&
+            }) }, this.processedBack.label))), (this.variation === "gray" || this.variation === "minimal") && this.categoryIcon && (hAsync("duet-icon", { class: { "duet-hero-icon": true, "duet-hero-icon-has-heading": this.preHeading !== "" }, size: "x-large", background: this.categoryIconColor, name: this.categoryIcon })), hAsync("div", { class: { "duet-hero-text": true }, part: "duet-hero-text" }, (this.preHeading || this.hasPreHeadingSlot) && (hAsync("duet-paragraph", { margin: "none", class: "duet-hero-pre", size: this.variation === "content" ? "small" : "medium" }, this.preHeading ? (this.preHeading) : (hAsync("span", null, hAsync("slot", { name: "pre-heading" }))))), hAsync("slot", { name: "badge" }), (this.heading || this.hasHeadingSlot) && (hAsync("duet-heading", { theme: this.theme, level: this.level, class: { "duet-hero-heading": true, "duet-hero-heading-has-pre": this.preHeading !== "" }, color: headingColor, visualLevel: headingVisualLevel, margin: campaignOrSection ? "none" : "auto" }, this.heading ? (this.heading) : (hAsync("span", null, hAsync("slot", { name: "heading" }))))), campaignOrSection && this.hasSubHeadingSlot && (hAsync("duet-heading", { theme: this.theme, level: this.subHeadingLevel, class: { "duet-hero-subheading": true }, color: this.theme === "turva" ? "secondary-turva" : "secondary", visualLevel: "h2" }, hAsync("span", null, hAsync("slot", { name: "subheading" })))), this.description && (hAsync("duet-paragraph", { theme: this.theme, color: textColor, variation: "intro" }, this.description)), (this.variation === "gray" || this.variation === "minimal") && this.processedListItems && (hAsync("duet-list", { theme: this.theme, "label-width": "30", breakpoint: "large", mobile: this.leftAlign ? undefined : "center" }, this.processedListItems.map(item => (hAsync("duet-list-item", null, hAsync("span", { slot: "label" }, item.label), hAsync("span", { slot: "value" }, item.value)))))), this.buttonLabel && (hAsync("duet-button", { url: this.buttonUrl, icon: this.icon, iconRight: this.iconRight, iconSize: this.iconSize, variation: buttonVariation, theme: this.theme, identifier: this.buttonId, onClick: event => this.handleClick(event, this.buttonData), fixed: true }, this.buttonLabel)), hAsync("slot", null)), (this.variation === "gray" || this.variation === "minimal") && this.processedActions && (hAsync("div", { class: "duet-hero-links" }, this.processedActions.map(item => (hAsync("a", { class: "duet-hero-link", href: item.href, id: item.id, target: item.external ? "_blank" : "_self", onClick: event => this.handleClick(event, item) }, hAsync("div", { class: "duet-hero-action-icon" }, hAsync("duet-icon", { size: "small", margin: "none", name: item.icon, color: "currentColor", outline: outlineColor })), hAsync("span", null, item.label), item.external && hAsync("duet-visually-hidden", null, ", ", this.accessibleLabelExternal), item.external && (hAsync("div", { class: "duet-hero-action-arrow" }, hAsync("duet-icon", { icon: actionNewWindowSmall.svg, size: "xx-small", margin: "none", color: "currentColor" })))))))), this.image &&
             this.variation !== "image" &&
             !campaignOrSection &&
             this.variation !== "product" &&
@@ -15717,7 +15728,7 @@ class Teleport {
     }
 }
 
-const duetModalCss = "/*!@*,\n*::after,\n*::before*/*.sc-duet-modal,*.sc-duet-modal::after,*.sc-duet-modal::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}/*!@:host*/.sc-duet-modal-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}/*!@.duet-modal-container*/.duet-modal-container.sc-duet-modal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:900;max-height:100vh;overflow-y:auto;visibility:hidden;opacity:0;transition:300ms ease;transition-delay:200ms}/*!@.duet-modal-container.duet-modal-active*/.duet-modal-container.duet-modal-active.sc-duet-modal{visibility:visible;opacity:1;transition:300ms ease;transition-delay:0s}/*!@.duet-modal-container.duet-disable-transitions*/.duet-modal-container.duet-disable-transitions.sc-duet-modal{transition:none}/*!@.duet-modal-container.duet-modal-slide-up*/.duet-modal-container.duet-modal-slide-up.sc-duet-modal{overflow:hidden}/*!@::slotted(img)*/.sc-duet-modal-s>img{width:100%}/*!@.duet-modal-inner*/.duet-modal-inner.sc-duet-modal{display:flex;align-items:center;width:100%;min-height:100%;padding:20px 16px}@media (min-width: 36em){/*!@.duet-modal-inner*/.duet-modal-inner.sc-duet-modal{padding:48px 16px}}/*!@.duet-modal-inner.duet-modal-slide-up*/.duet-modal-inner.duet-modal-slide-up.sc-duet-modal{align-items:stretch;justify-content:center;height:100%;padding-top:48px;padding-bottom:0;overflow:hidden}/*!@.duet-modal-inner.duet-modal-slide-up::after*/.duet-modal-inner.duet-modal-slide-up.sc-duet-modal::after{position:absolute;bottom:0;z-index:300;display:block;width:100%;max-width:686px;height:48px;margin:auto;pointer-events:none;content:\"\";background:linear-gradient(rgba(255, 255, 255, 0), rgb(255, 255, 255))}/*!@.duet-modal-inner.duet-modal-slide-up::after.small*/.duet-modal-inner.duet-modal-slide-up.sc-duet-modal::after.small{max-width:545px}/*!@.duet-modal-inner.duet-modal-slide-up::after.large*/.duet-modal-inner.duet-modal-slide-up.sc-duet-modal::after.large{max-width:100%}@media (min-width: 36em){/*!@.duet-modal-inner.duet-modal-slide-up::after.large*/.duet-modal-inner.duet-modal-slide-up.sc-duet-modal::after.large{max-width:1110px}}@media (max-width: 35.9375em){/*!@.duet-modal-inner.large*/.duet-modal-inner.large.sc-duet-modal{padding-right:0;padding-left:0}/*!@.duet-modal-inner.duet-modal-slide-up*/.duet-modal-inner.duet-modal-slide-up.sc-duet-modal{padding:0;padding-top:28px}}/*!@.duet-modal*/.duet-modal.sc-duet-modal{position:relative;width:100%;max-width:686px;margin:auto;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-weight:400;font-variant-numeric:tabular-nums;line-height:1.5;color:rgb(0, 41, 77);background:rgb(255, 255, 255);border-radius:4px;opacity:0;transition:300ms ease;transition-delay:0ms;transform:scale(0.96)}/*!@.duet-theme-turva .duet-modal*/.duet-theme-turva.sc-duet-modal .duet-modal.sc-duet-modal{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(23, 28, 58)}/*!@.duet-modal-active .duet-modal*/.duet-modal-active.sc-duet-modal .duet-modal.sc-duet-modal{opacity:1;transition:300ms ease;transition-delay:200ms;transform:none}/*!@.duet-modal-active .duet-modal.slide-up*/.duet-modal-active.sc-duet-modal .duet-modal.slide-up.sc-duet-modal{top:0;transition:top 600ms ease}/*!@.duet-modal.loader*/.duet-modal.loader.sc-duet-modal{text-align:center;background:transparent}/*!@.duet-modal.loader .duet-modal-close*/.duet-modal.loader.sc-duet-modal .duet-modal-close.sc-duet-modal{display:none}/*!@.duet-modal.loader .duet-modal-spinner*/.duet-modal.loader.sc-duet-modal .duet-modal-spinner.sc-duet-modal{position:relative;height:120px}/*!@.duet-modal.loader duet-paragraph.duet-loader-message*/.duet-modal.loader.sc-duet-modal duet-paragraph.duet-loader-message.sc-duet-modal{max-height:0;opacity:0;transition:all 300ms ease;transform:scale(0.9)}/*!@.duet-modal.loader duet-paragraph.duet-loader-message.show*/.duet-modal.loader.sc-duet-modal duet-paragraph.duet-loader-message.show.sc-duet-modal{max-height:100px;opacity:1;transform:scale(1)}/*!@.duet-modal.loader duet-paragraph.duet-loader-message:first-of-type::part(duet-paragraph)*/.duet-modal.loader.sc-duet-modal duet-paragraph.duet-loader-message.sc-duet-modal:first-of-type::part(duet-paragraph){font-weight:600}/*!@.duet-disable-transitions .duet-modal*/.duet-disable-transitions.sc-duet-modal .duet-modal.sc-duet-modal{transition:none}/*!@.duet-modal.small*/.duet-modal.small.sc-duet-modal{max-width:545px}/*!@.duet-modal.large*/.duet-modal.large.sc-duet-modal{max-width:100%}@media (min-width: 36em){/*!@.duet-modal.large*/.duet-modal.large.sc-duet-modal{max-width:1110px}}/*!@.duet-modal.slide-up*/.duet-modal.slide-up.sc-duet-modal{top:100vh;margin:0;border-radius:4px 4px 0 0;opacity:1;transition:top 600ms ease}@media (max-width: 35.9375em){/*!@.duet-modal.slide-up*/.duet-modal.slide-up.sc-duet-modal{border-radius:16px 16px 0 0}}/*!@.duet-modal.duet-modal-has-sticky-header*/.duet-modal.duet-modal-has-sticky-header.sc-duet-modal{height:100%;overflow:auto}/*!@.duet-modal:focus*/.duet-modal.sc-duet-modal:focus{outline:0}/*!@.duet-modal-body,\n.duet-modal-sticky-header*/.duet-modal-body.sc-duet-modal,.duet-modal-sticky-header.sc-duet-modal{width:100%;padding:36px 28px}/*!@.duet-modal-body.duet-modal-gutter-none,\n.duet-modal-sticky-header.duet-modal-gutter-none*/.duet-modal-body.duet-modal-gutter-none.sc-duet-modal,.duet-modal-sticky-header.duet-modal-gutter-none.sc-duet-modal{padding:0 !important}/*!@.duet-modal-body.duet-modal-gutter-small,\n.duet-modal-sticky-header.duet-modal-gutter-small*/.duet-modal-body.duet-modal-gutter-small.sc-duet-modal,.duet-modal-sticky-header.duet-modal-gutter-small.sc-duet-modal{padding:36px 20px}/*!@.duet-modal-body.duet-modal-gutter-large,\n.duet-modal-sticky-header.duet-modal-gutter-large*/.duet-modal-body.duet-modal-gutter-large.sc-duet-modal,.duet-modal-sticky-header.duet-modal-gutter-large.sc-duet-modal{padding:48px 36px}@media (max-width: 22.5em){/*!@.duet-modal-body,\n  .duet-modal-sticky-header*/.duet-modal-body.sc-duet-modal,.duet-modal-sticky-header.sc-duet-modal{padding:36px 20px}/*!@.duet-modal-body.duet-modal-gutter-large,\n  .duet-modal-sticky-header.duet-modal-gutter-large*/.duet-modal-body.duet-modal-gutter-large.sc-duet-modal,.duet-modal-sticky-header.duet-modal-gutter-large.sc-duet-modal{padding:48px 28px}}@media (max-width: 35.9375em){/*!@.duet-modal-body,\n  .duet-modal-sticky-header*/.duet-modal-body.sc-duet-modal,.duet-modal-sticky-header.sc-duet-modal{padding:36px 20px}/*!@.duet-modal-body.duet-modal-gutter-large,\n  .duet-modal-sticky-header.duet-modal-gutter-large*/.duet-modal-body.duet-modal-gutter-large.sc-duet-modal,.duet-modal-sticky-header.duet-modal-gutter-large.sc-duet-modal{padding:48px 36px}}@media (min-width: 36em){/*!@.duet-modal-body,\n  .duet-modal-sticky-header*/.duet-modal-body.sc-duet-modal,.duet-modal-sticky-header.sc-duet-modal{padding:36px}/*!@.duet-modal-body.duet-modal-gutter-large,\n  .duet-modal-sticky-header.duet-modal-gutter-large*/.duet-modal-body.duet-modal-gutter-large.sc-duet-modal,.duet-modal-sticky-header.duet-modal-gutter-large.sc-duet-modal{padding:28px 72px}}@media (min-width: 48em){/*!@.duet-modal-body,\n  .duet-modal-sticky-header*/.duet-modal-body.sc-duet-modal,.duet-modal-sticky-header.sc-duet-modal{padding:36px 72px}/*!@.duet-modal-body.duet-modal-gutter-large,\n  .duet-modal-sticky-header.duet-modal-gutter-large*/.duet-modal-body.duet-modal-gutter-large.sc-duet-modal,.duet-modal-sticky-header.duet-modal-gutter-large.sc-duet-modal{padding:36px 72px}}@media (min-width: 76.25em){/*!@.duet-modal-body,\n  .duet-modal-sticky-header*/.duet-modal-body.sc-duet-modal,.duet-modal-sticky-header.sc-duet-modal{padding:36px 48px 48px}/*!@.duet-modal-body.duet-modal-gutter-large,\n  .duet-modal-sticky-header.duet-modal-gutter-large*/.duet-modal-body.duet-modal-gutter-large.sc-duet-modal,.duet-modal-sticky-header.duet-modal-gutter-large.sc-duet-modal{padding:48px 94px}/*!@.small .duet-modal-body,\n  .small .duet-modal-sticky-header*/.small.sc-duet-modal .duet-modal-body.sc-duet-modal,.small.sc-duet-modal .duet-modal-sticky-header.sc-duet-modal{padding:36px 48px}}/*!@.duet-modal-header*/.duet-modal-header.sc-duet-modal{text-align:center}/*!@.duet-modal-sticky-header*/.duet-modal-sticky-header.sc-duet-modal{position:sticky;top:0;z-index:200;display:block;padding-bottom:12px;text-align:left;background:rgb(243, 249, 252);border-bottom:1px solid rgb(225, 227, 230)}/*!@.duet-theme-turva .duet-modal-sticky-header*/.duet-theme-turva.sc-duet-modal .duet-modal-sticky-header.sc-duet-modal{background:rgb(245, 245, 247);border-bottom:1px solid rgb(228, 228, 230)}/*!@.duet-modal-close*/.duet-modal-close.sc-duet-modal{position:absolute;top:12px;right:12px}/*!@.duet-modal-heading*/.duet-modal-heading.sc-duet-modal{width:100%;padding-right:60px;overflow:hidden;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:1.25rem;font-style:normal;font-weight:600;font-variant-numeric:tabular-nums;line-height:1.25;color:rgb(0, 41, 77);text-decoration:none;text-overflow:ellipsis;letter-spacing:-0.01rem;white-space:nowrap}/*!@.duet-modal-heading.duet-p-0*/.duet-modal-heading.duet-p-0.sc-duet-modal{padding:0 !important}/*!@.duet-modal-heading.duet-m-0*/.duet-modal-heading.duet-m-0.sc-duet-modal{margin:0 !important}";
+const duetModalCss = "/*!@*,\n*::after,\n*::before*/*.sc-duet-modal,*.sc-duet-modal::after,*.sc-duet-modal::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}/*!@:host*/.sc-duet-modal-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}/*!@.duet-modal-container*/.duet-modal-container.sc-duet-modal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:900;max-height:100vh;overflow-y:auto;visibility:hidden;opacity:0;transition:300ms ease;transition-delay:200ms}/*!@.duet-modal-container.duet-modal-active*/.duet-modal-container.duet-modal-active.sc-duet-modal{visibility:visible;opacity:1;transition:300ms ease;transition-delay:0s}/*!@.duet-modal-container.duet-disable-transitions*/.duet-modal-container.duet-disable-transitions.sc-duet-modal{transition:none}/*!@.duet-modal-container.duet-modal-slide-up*/.duet-modal-container.duet-modal-slide-up.sc-duet-modal{overflow:hidden}/*!@::slotted(img)*/.sc-duet-modal-s>img{width:100%}/*!@.duet-modal-inner*/.duet-modal-inner.sc-duet-modal{display:flex;align-items:center;width:100%;min-height:100%;padding:20px 16px}@media (min-width: 36em){/*!@.duet-modal-inner*/.duet-modal-inner.sc-duet-modal{padding:48px 16px}}/*!@.duet-modal-inner.duet-modal-slide-up*/.duet-modal-inner.duet-modal-slide-up.sc-duet-modal{align-items:stretch;justify-content:center;height:100%;padding-top:48px;padding-bottom:0;overflow:hidden}/*!@.duet-modal-inner.duet-modal-slide-up::after*/.duet-modal-inner.duet-modal-slide-up.sc-duet-modal::after{position:absolute;bottom:0;z-index:300;display:block;width:100%;max-width:686px;height:48px;margin:auto;pointer-events:none;content:\"\";background:linear-gradient(rgba(255, 255, 255, 0), rgb(255, 255, 255))}/*!@.duet-modal-inner.duet-modal-slide-up::after.small*/.duet-modal-inner.duet-modal-slide-up.sc-duet-modal::after.small{max-width:545px}/*!@.duet-modal-inner.duet-modal-slide-up::after.large*/.duet-modal-inner.duet-modal-slide-up.sc-duet-modal::after.large{max-width:100%}@media (min-width: 36em){/*!@.duet-modal-inner.duet-modal-slide-up::after.large*/.duet-modal-inner.duet-modal-slide-up.sc-duet-modal::after.large{max-width:1110px}}@media (max-width: 35.9375em){/*!@.duet-modal-inner.large*/.duet-modal-inner.large.sc-duet-modal{padding-right:0;padding-left:0}/*!@.duet-modal-inner.duet-modal-slide-up*/.duet-modal-inner.duet-modal-slide-up.sc-duet-modal{padding:0;padding-top:28px}}/*!@.duet-modal*/.duet-modal.sc-duet-modal{position:relative;width:100%;max-width:686px;margin:auto;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-weight:400;font-variant-numeric:tabular-nums;line-height:1.5;color:rgb(0, 41, 77);background:rgb(255, 255, 255);border-radius:4px;opacity:0;transition:300ms ease;transition-delay:0ms;transform:scale(0.96)}/*!@.duet-theme-turva .duet-modal*/.duet-theme-turva.sc-duet-modal .duet-modal.sc-duet-modal{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(23, 28, 58)}/*!@.duet-modal-active .duet-modal*/.duet-modal-active.sc-duet-modal .duet-modal.sc-duet-modal{opacity:1;transition:300ms ease;transition-delay:200ms;transform:none}/*!@.duet-modal-active .duet-modal.slide-up*/.duet-modal-active.sc-duet-modal .duet-modal.slide-up.sc-duet-modal{top:0;transition:top 600ms ease}/*!@.duet-modal.loader*/.duet-modal.loader.sc-duet-modal{text-align:center;background:transparent}/*!@.duet-modal.loader .duet-modal-close*/.duet-modal.loader.sc-duet-modal .duet-modal-close.sc-duet-modal{display:none}/*!@.duet-modal.loader .duet-modal-spinner*/.duet-modal.loader.sc-duet-modal .duet-modal-spinner.sc-duet-modal{position:relative;height:120px}/*!@.duet-modal.loader .duet-modal-inner-slot-default*/.duet-modal.loader.sc-duet-modal .duet-modal-inner-slot-default.sc-duet-modal{position:relative;backdrop-filter:blur(10px)}/*!@.duet-modal.loader duet-paragraph.duet-loader-message*/.duet-modal.loader.sc-duet-modal duet-paragraph.duet-loader-message.sc-duet-modal{position:absolute;opacity:0;transition:all 300ms ease;transform:scaleY(0);transform-origin:top}/*!@.duet-modal.loader duet-paragraph.duet-loader-message.show*/.duet-modal.loader.sc-duet-modal duet-paragraph.duet-loader-message.show.sc-duet-modal{opacity:1;transform:scaleY(1);transform-origin:bottom}/*!@.duet-modal.loader duet-paragraph.duet-loader-message.show::part(duet-paragraph)*/.duet-modal.loader.sc-duet-modal duet-paragraph.duet-loader-message.show.sc-duet-modal::part(duet-paragraph){backdrop-filter:blur(10px)}/*!@.duet-disable-transitions .duet-modal*/.duet-disable-transitions.sc-duet-modal .duet-modal.sc-duet-modal{transition:none}/*!@.duet-modal.small*/.duet-modal.small.sc-duet-modal{max-width:545px}/*!@.duet-modal.large*/.duet-modal.large.sc-duet-modal{max-width:100%}@media (min-width: 36em){/*!@.duet-modal.large*/.duet-modal.large.sc-duet-modal{max-width:1110px}}/*!@.duet-modal.slide-up*/.duet-modal.slide-up.sc-duet-modal{top:100vh;margin:0;border-radius:4px 4px 0 0;opacity:1;transition:top 600ms ease}@media (max-width: 35.9375em){/*!@.duet-modal.slide-up*/.duet-modal.slide-up.sc-duet-modal{border-radius:16px 16px 0 0}}/*!@.duet-modal.duet-modal-has-sticky-header*/.duet-modal.duet-modal-has-sticky-header.sc-duet-modal{height:100%;overflow:auto}/*!@.duet-modal:focus*/.duet-modal.sc-duet-modal:focus{outline:0}/*!@.duet-modal-body,\n.duet-modal-sticky-header*/.duet-modal-body.sc-duet-modal,.duet-modal-sticky-header.sc-duet-modal{width:100%;padding:36px 28px}/*!@.duet-modal-body.duet-modal-gutter-none,\n.duet-modal-sticky-header.duet-modal-gutter-none*/.duet-modal-body.duet-modal-gutter-none.sc-duet-modal,.duet-modal-sticky-header.duet-modal-gutter-none.sc-duet-modal{padding:0 !important}/*!@.duet-modal-body.duet-modal-gutter-small,\n.duet-modal-sticky-header.duet-modal-gutter-small*/.duet-modal-body.duet-modal-gutter-small.sc-duet-modal,.duet-modal-sticky-header.duet-modal-gutter-small.sc-duet-modal{padding:36px 20px}/*!@.duet-modal-body.duet-modal-gutter-large,\n.duet-modal-sticky-header.duet-modal-gutter-large*/.duet-modal-body.duet-modal-gutter-large.sc-duet-modal,.duet-modal-sticky-header.duet-modal-gutter-large.sc-duet-modal{padding:48px 36px}@media (max-width: 22.5em){/*!@.duet-modal-body,\n  .duet-modal-sticky-header*/.duet-modal-body.sc-duet-modal,.duet-modal-sticky-header.sc-duet-modal{padding:36px 20px}/*!@.duet-modal-body.duet-modal-gutter-large,\n  .duet-modal-sticky-header.duet-modal-gutter-large*/.duet-modal-body.duet-modal-gutter-large.sc-duet-modal,.duet-modal-sticky-header.duet-modal-gutter-large.sc-duet-modal{padding:48px 28px}}@media (max-width: 35.9375em){/*!@.duet-modal-body,\n  .duet-modal-sticky-header*/.duet-modal-body.sc-duet-modal,.duet-modal-sticky-header.sc-duet-modal{padding:36px 20px}/*!@.duet-modal-body.duet-modal-gutter-large,\n  .duet-modal-sticky-header.duet-modal-gutter-large*/.duet-modal-body.duet-modal-gutter-large.sc-duet-modal,.duet-modal-sticky-header.duet-modal-gutter-large.sc-duet-modal{padding:48px 36px}}@media (min-width: 36em){/*!@.duet-modal-body,\n  .duet-modal-sticky-header*/.duet-modal-body.sc-duet-modal,.duet-modal-sticky-header.sc-duet-modal{padding:36px}/*!@.duet-modal-body.duet-modal-gutter-large,\n  .duet-modal-sticky-header.duet-modal-gutter-large*/.duet-modal-body.duet-modal-gutter-large.sc-duet-modal,.duet-modal-sticky-header.duet-modal-gutter-large.sc-duet-modal{padding:28px 72px}}@media (min-width: 48em){/*!@.duet-modal-body,\n  .duet-modal-sticky-header*/.duet-modal-body.sc-duet-modal,.duet-modal-sticky-header.sc-duet-modal{padding:36px 72px}/*!@.duet-modal-body.duet-modal-gutter-large,\n  .duet-modal-sticky-header.duet-modal-gutter-large*/.duet-modal-body.duet-modal-gutter-large.sc-duet-modal,.duet-modal-sticky-header.duet-modal-gutter-large.sc-duet-modal{padding:36px 72px}}@media (min-width: 76.25em){/*!@.duet-modal-body,\n  .duet-modal-sticky-header*/.duet-modal-body.sc-duet-modal,.duet-modal-sticky-header.sc-duet-modal{padding:36px 48px 48px}/*!@.duet-modal-body.duet-modal-gutter-large,\n  .duet-modal-sticky-header.duet-modal-gutter-large*/.duet-modal-body.duet-modal-gutter-large.sc-duet-modal,.duet-modal-sticky-header.duet-modal-gutter-large.sc-duet-modal{padding:48px 94px}/*!@.small .duet-modal-body,\n  .small .duet-modal-sticky-header*/.small.sc-duet-modal .duet-modal-body.sc-duet-modal,.small.sc-duet-modal .duet-modal-sticky-header.sc-duet-modal{padding:36px 48px}}/*!@.duet-modal-header*/.duet-modal-header.sc-duet-modal{text-align:center}/*!@.duet-modal-sticky-header*/.duet-modal-sticky-header.sc-duet-modal{position:sticky;top:0;z-index:200;display:block;padding-bottom:12px;text-align:left;background:rgb(243, 249, 252);border-bottom:1px solid rgb(225, 227, 230)}/*!@.duet-theme-turva .duet-modal-sticky-header*/.duet-theme-turva.sc-duet-modal .duet-modal-sticky-header.sc-duet-modal{background:rgb(245, 245, 247);border-bottom:1px solid rgb(228, 228, 230)}/*!@.duet-modal-close*/.duet-modal-close.sc-duet-modal{position:absolute;top:12px;right:12px}/*!@.duet-modal-heading*/.duet-modal-heading.sc-duet-modal{width:100%;padding-right:60px;overflow:hidden;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:1.25rem;font-style:normal;font-weight:600;font-variant-numeric:tabular-nums;line-height:1.25;color:rgb(0, 41, 77);text-decoration:none;text-overflow:ellipsis;letter-spacing:-0.01rem;white-space:nowrap}/*!@.duet-modal-heading.duet-p-0*/.duet-modal-heading.duet-p-0.sc-duet-modal{padding:0 !important}/*!@.duet-modal-heading.duet-m-0*/.duet-modal-heading.duet-m-0.sc-duet-modal{margin:0 !important}";
 
 // The transition below is slightly higher than the actual CSS transition as VoiceOver on
 // iOS has otherwise problems moving the focus from modal back to the original element.
@@ -15885,11 +15896,9 @@ class DuetModal {
         const el = document.createElement(visible ? "duet-paragraph" : "duet-visually-hidden");
         el.textContent = message;
         el.classList.add("duet-loader-message");
-        if (this.variation === "loader" && visible) {
-            el.setAttribute("color", "gray-lightest");
-        }
         if (visible) {
             setTimeout(() => {
+                this.slotContainerEl.querySelectorAll(".duet-loader-message").forEach(el => el.classList.remove("show"));
                 el.classList.add("show");
             }, 10);
         }
@@ -15929,7 +15938,7 @@ class DuetModal {
                 "duet-modal-active": this.open,
                 "duet-modal-slide-up": this.variation === "slide-up",
                 "duet-modal-has-sticky-header": this.hasStickyHeader,
-            } }, hAsync(FocusGuard, { moveFocusTo: this.buttonEl }), hAsync("duet-overlay", { "z-index": "-1", visible: this.open, dark: this.variation === "loader" }), hAsync("div", { ref: modalInner => (this.modalInnerEl = modalInner), class: {
+            } }, hAsync(FocusGuard, { moveFocusTo: this.buttonEl }), hAsync("duet-overlay", { "z-index": "-1", visible: this.open, variation: this.variation === "loader" ? "white" : "default" }), hAsync("div", { ref: modalInner => (this.modalInnerEl = modalInner), class: {
                 "duet-modal-inner": true,
                 [this.size]: true,
                 "duet-modal-slide-up": this.variation === "slide-up",
@@ -15951,7 +15960,7 @@ class DuetModal {
                 "duet-modal-gutter-small": this.gutterSize === "small",
                 "duet-modal-gutter-medium": this.gutterSize === "medium",
                 "duet-modal-gutter-large": this.gutterSize === "large",
-            } }, hAsync("div", { class: "duet-modal-header" }, hAsync("span", { class: "duet-modal-inner-slot-top" }, hAsync("slot", { name: "top" })), this.icon && hAsync("duet-icon", { name: this.icon, size: "xx-large", color: this.color || iconColor }), this.heading && (hAsync("duet-heading", { "visual-level": (_a = this.headingVisualLevel) !== null && _a !== void 0 ? _a : this.headingLevel, level: this.headingLevel, theme: this.theme, id: this.modalId }, this.heading))), this.variation === "loader" && (hAsync("div", { class: "duet-modal-spinner" }, hAsync("duet-spinner", { size: "large", color: "gray-lightest" }))), hAsync("div", { class: "duet-modal-inner-slot-default", id: this.slotDefaultId, ref: el => (this.slotContainerEl = el), "aria-live": this.variation === "loader" ? "assertive" : "off" }, hAsync("slot", null))))), hAsync(FocusGuard, { moveFocusTo: this.buttonEl })));
+            } }, hAsync("div", { class: "duet-modal-header" }, hAsync("span", { class: "duet-modal-inner-slot-top" }, hAsync("slot", { name: "top" })), this.icon && hAsync("duet-icon", { name: this.icon, size: "xx-large", color: this.color || iconColor }), this.heading && (hAsync("duet-heading", { "visual-level": (_a = this.headingVisualLevel) !== null && _a !== void 0 ? _a : this.headingLevel, level: this.headingLevel, theme: this.theme, id: this.modalId }, this.heading))), this.variation === "loader" && (hAsync("div", { class: "duet-modal-spinner" }, hAsync("duet-spinner", { size: "large", color: "primary" }))), hAsync("div", { class: "duet-modal-inner-slot-default", id: this.slotDefaultId, ref: el => (this.slotContainerEl = el), "aria-live": this.variation === "loader" ? "assertive" : "off" }, hAsync("slot", null))))), hAsync(FocusGuard, { moveFocusTo: this.buttonEl })));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -16896,7 +16905,7 @@ class DuetNumberInput {
     }; }
 }
 
-const duetOverlayCss = "/*!@.duet-overlay*/.duet-overlay.sc-duet-overlay{position:fixed;top:0;left:0;display:block;width:100%;height:100%;visibility:visible;background:rgb(0, 41, 77);opacity:0.3}/*!@.duet-overlay.duet-theme-turva*/.duet-overlay.duet-theme-turva.sc-duet-overlay{background:rgb(23, 28, 58)}/*!@.duet-overlay.keep-stacking-context*/.duet-overlay.keep-stacking-context.sc-duet-overlay{position:absolute;top:unset;left:unset;z-index:unset !important}/*!@.duet-overlay.modal-overlay*/.duet-overlay.modal-overlay.sc-duet-overlay{z-index:-1}/*!@.duet-overlay.hidden*/.duet-overlay.hidden.sc-duet-overlay{visibility:hidden;opacity:0}/*!@.duet-overlay.dark*/.duet-overlay.dark.sc-duet-overlay{opacity:0.5}/*!@.duet-overlay.display-x-small*/.duet-overlay.display-x-small.sc-duet-overlay{display:none}@media (max-width: 35.9375em){/*!@.duet-overlay.display-x-small*/.duet-overlay.display-x-small.sc-duet-overlay{display:block}}/*!@.duet-overlay.display-x-small.not*/.duet-overlay.display-x-small.not.sc-duet-overlay{display:block}@media (max-width: 35.9375em){/*!@.duet-overlay.display-x-small.not*/.duet-overlay.display-x-small.not.sc-duet-overlay{display:none}}/*!@.duet-overlay.display-small*/.duet-overlay.display-small.sc-duet-overlay{display:none}@media (min-width: 36em){/*!@.duet-overlay.display-small*/.duet-overlay.display-small.sc-duet-overlay{display:block}}/*!@.duet-overlay.display-small.not*/.duet-overlay.display-small.not.sc-duet-overlay{display:block}@media (min-width: 36em){/*!@.duet-overlay.display-small.not*/.duet-overlay.display-small.not.sc-duet-overlay{display:none}}/*!@.duet-overlay.display-medium*/.duet-overlay.display-medium.sc-duet-overlay{display:none}@media (min-width: 48em){/*!@.duet-overlay.display-medium*/.duet-overlay.display-medium.sc-duet-overlay{display:block}}/*!@.duet-overlay.display-medium.not*/.duet-overlay.display-medium.not.sc-duet-overlay{display:block}@media (min-width: 48em){/*!@.duet-overlay.display-medium.not*/.duet-overlay.display-medium.not.sc-duet-overlay{display:none}}/*!@.duet-overlay.display-large*/.duet-overlay.display-large.sc-duet-overlay{display:none}@media (min-width: 62em){/*!@.duet-overlay.display-large*/.duet-overlay.display-large.sc-duet-overlay{display:block}}/*!@.duet-overlay.display-large.not*/.duet-overlay.display-large.not.sc-duet-overlay{display:block}@media (min-width: 62em){/*!@.duet-overlay.display-large.not*/.duet-overlay.display-large.not.sc-duet-overlay{display:none}}/*!@.duet-overlay.transition-slowly*/.duet-overlay.transition-slowly.sc-duet-overlay{transition:600ms ease}/*!@.duet-overlay.transition-quickly*/.duet-overlay.transition-quickly.sc-duet-overlay{transition:300ms ease}";
+const duetOverlayCss = "/*!@.duet-overlay*/.duet-overlay.sc-duet-overlay{position:fixed;top:0;left:0;display:block;width:100%;height:100%;visibility:visible;background:rgb(0, 41, 77);opacity:0.3}/*!@.duet-overlay.duet-theme-turva*/.duet-overlay.duet-theme-turva.sc-duet-overlay{background:rgb(23, 28, 58)}/*!@.duet-overlay.keep-stacking-context*/.duet-overlay.keep-stacking-context.sc-duet-overlay{position:absolute;top:unset;left:unset;z-index:unset !important}/*!@.duet-overlay.modal-overlay*/.duet-overlay.modal-overlay.sc-duet-overlay{z-index:-1}/*!@.duet-overlay.hidden*/.duet-overlay.hidden.sc-duet-overlay{visibility:hidden;opacity:0}/*!@.duet-overlay.dark*/.duet-overlay.dark.sc-duet-overlay{opacity:0.85}/*!@.duet-overlay.white*/.duet-overlay.white.sc-duet-overlay{background:rgb(255, 255, 255);opacity:0.9}/*!@.duet-overlay.white.duet-theme-turva*/.duet-overlay.white.duet-theme-turva.sc-duet-overlay{background:rgb(255, 255, 255)}/*!@.duet-overlay.display-x-small*/.duet-overlay.display-x-small.sc-duet-overlay{display:none}@media (max-width: 35.9375em){/*!@.duet-overlay.display-x-small*/.duet-overlay.display-x-small.sc-duet-overlay{display:block}}/*!@.duet-overlay.display-x-small.not*/.duet-overlay.display-x-small.not.sc-duet-overlay{display:block}@media (max-width: 35.9375em){/*!@.duet-overlay.display-x-small.not*/.duet-overlay.display-x-small.not.sc-duet-overlay{display:none}}/*!@.duet-overlay.display-small*/.duet-overlay.display-small.sc-duet-overlay{display:none}@media (min-width: 36em){/*!@.duet-overlay.display-small*/.duet-overlay.display-small.sc-duet-overlay{display:block}}/*!@.duet-overlay.display-small.not*/.duet-overlay.display-small.not.sc-duet-overlay{display:block}@media (min-width: 36em){/*!@.duet-overlay.display-small.not*/.duet-overlay.display-small.not.sc-duet-overlay{display:none}}/*!@.duet-overlay.display-medium*/.duet-overlay.display-medium.sc-duet-overlay{display:none}@media (min-width: 48em){/*!@.duet-overlay.display-medium*/.duet-overlay.display-medium.sc-duet-overlay{display:block}}/*!@.duet-overlay.display-medium.not*/.duet-overlay.display-medium.not.sc-duet-overlay{display:block}@media (min-width: 48em){/*!@.duet-overlay.display-medium.not*/.duet-overlay.display-medium.not.sc-duet-overlay{display:none}}/*!@.duet-overlay.display-large*/.duet-overlay.display-large.sc-duet-overlay{display:none}@media (min-width: 62em){/*!@.duet-overlay.display-large*/.duet-overlay.display-large.sc-duet-overlay{display:block}}/*!@.duet-overlay.display-large.not*/.duet-overlay.display-large.not.sc-duet-overlay{display:block}@media (min-width: 62em){/*!@.duet-overlay.display-large.not*/.duet-overlay.display-large.not.sc-duet-overlay{display:none}}/*!@.duet-overlay.transition-slowly*/.duet-overlay.transition-slowly.sc-duet-overlay{transition:600ms ease}/*!@.duet-overlay.transition-quickly*/.duet-overlay.transition-quickly.sc-duet-overlay{transition:300ms ease}";
 
 /**
  * @internal
@@ -16918,7 +16927,7 @@ class DuetOverlay {
         this.displayDevice = "all";
         this.transition = "slowly";
         this.zIndex = "400";
-        this.dark = false;
+        this.variation = "default";
     }
     /**
      * Component lifecycle events.
@@ -16942,7 +16951,7 @@ class DuetOverlay {
                 "display-large": this.getDisplayBreakpoint() === "large",
                 not: this.displayDevice.startsWith("not"),
                 hidden: !this.visible,
-                dark: this.dark,
+                [this.variation]: true,
             } })));
     }
     static get style() { return duetOverlayCss; }
@@ -16957,7 +16966,7 @@ class DuetOverlay {
             "displayDevice": [1025, "display-device"],
             "transition": [1025],
             "zIndex": [1025, "z-index"],
-            "dark": [1028]
+            "variation": [1]
         },
         "$listeners$": undefined,
         "$lazyBundleId$": "-",