dialog{max-width:1376px;padding:40px 20px 20px;border:none;border-radius:16px;background:#fff;opacity:0;transition-behavior:allow-discrete;transition-duration:.45s;transition-property:overlay display opacity;translate:0 25vh}@media (min-width: 768px){dialog{padding:25px}}@media (min-width: 1200px){dialog{padding:40px}}@media (min-width: 1800px){dialog{padding:60px}}dialog::backdrop{background:#000000b3;opacity:0;transition-behavior:allow-discrete;transition-duration:.45s;transition-property:overlay display opacity}dialog[open]{opacity:1;translate:0 0}@starting-style{dialog[open]{opacity:0;translate:0 -25vh}}dialog[open]::backdrop{opacity:1}@starting-style{dialog[open]::backdrop{opacity:0}}.popup-close{position:absolute;top:10px;right:10px;color:var(--primary-color-50)}@media (min-width: 1200px){.popup-close{top:30px;right:30px}}.no-touch .popup-close:hover{color:#131820}.popup-close:focus-visible:before{border-color:currentcolor}.popup-close:before{border:2px dashed transparent;transition:border-color .45s cubic-bezier(.42,0,0,1)}button.popup-close{padding:0;border:none;background:none;cursor:pointer;font:inherit;outline:inherit}.d2l-dialog .filter-button{align-items:center}.d2l-dialog .filter-button:hover svg .top-circle{transform:translate(6px)}.d2l-dialog .filter-button:hover svg .bottom-circle{transform:translate(-6px)}.d2l-dialog .filter-button svg circle{transition:.27s}.d2l-dialog .filter-button span{display:none}@media (min-width: 1024px){.d2l-dialog .filter-button span{display:inline-block}}.d2l-dialog .filter-dialog form details{width:400px}.d2l-dialog .filter-dialog form details[open] summary{margin-bottom:1rem}.d2l-dialog .filter-dialog form .checkbox-group{display:flex;max-height:400px;flex-direction:column;gap:.5rem;overflow-y:auto}.d2l-dialog .filter-dialog form button.btn{margin-top:2rem}.d2l-dialog .d2l-dialog-icon{width:30px}.demo-section{overflow:initial}.demo-section.grey-waves{position:relative;overflow:hidden;padding:50px 0;background:#f7fafe}@media (min-width: 1200px){.demo-section.grey-waves{padding:60px 0}}@media (min-width: 1440px){.demo-section.grey-waves{padding:80px 0}}@media (min-width: 1800px){.demo-section.grey-waves{padding:140px 0}}@media (max-width: 1199px){.demo-section.grey-waves .bg-waves{display:none}}.demo-section.grey-waves>.container{position:relative;z-index:10}.ui-bar{--ui-bar-color: #dedee3;--ui-bar-height: 26px;display:flex;width:100%;height:var(--ui-bar-height);flex:0 1 auto;flex-basis:var(--ui-bar-height);align-items:center;justify-content:flex-start;padding-left:13px;border-radius:16px 16px 0 0;background-color:var(--ui-bar-color);gap:5px}.ui-bar .dot{display:block;width:8px;height:8px;border-radius:100%;background-color:var(--ui-bar-dot-color, #f0463d)}.ui-bar .dot:nth-child(2){--ui-bar-dot-color: #e9c300}.ui-bar .dot:nth-child(3){--ui-bar-dot-color: #4cc844}.demo-section-inner{position:relative;display:grid}.demo-section-inner .static-image{display:none}.demo-section-inner .interactive-screen:has(.h5p-iframe-wrapper){overflow:hidden;border-radius:16px}@media (min-width: 768px){.demo-section-inner{grid-template-columns:20% 29% 1fr 29% 20%}.demo-section-inner .interactive-screen{position:relative;grid-column:2/5;grid-row:1;scale:1}.demo-section-inner .interactive-screen:before{position:absolute;z-index:-1;background:#000;content:"";filter:blur(30px);top:2em;right:.5em;bottom:.75em;left:.5em}.demo-section-inner .interactive-screen.has-bg-layer:before{display:none}.demo-section-inner .interactive-screen.has-bg-layer .video-holder{margin:0}.demo-section-inner .interactive-screen .layer-bg{position:absolute;z-index:-1;bottom:-1rem;left:-1rem;width:75%;height:75%;border-radius:1.5rem;animation:bg-layer-anim 1s 3s forwards;pointer-events:none;transform:scale(0)}@keyframes bg-layer-anim{0%{transform:scale(0)}to{transform:scale(1)}}.demo-section-inner .static-image{--translateX-direction: 1;position:relative;z-index:0;display:grid;align-self:center;border:1px solid #BEC3CD;border-radius:16px;background-size:cover;cursor:pointer;grid-row:1;justify-items:center;transform:translate(0);transition:transform .5s ease-out}.demo-section-inner .static-image:hover,.demo-section-inner .static-image:focus-visible{transform:translate(calc(var(--translateX-direction) * 10%))}.demo-section-inner .static-image img{border-radius:0 0 16px 16px}.demo-section-inner .static-image.move-front{animation:moveFront 1s forwards ease-out}.demo-section-inner .static-image.move-back{animation:moveBack 1s forwards ease-out}.demo-section-inner .static-image:before{position:absolute;z-index:-1;bottom:0;display:block;width:90%;height:20px;border-radius:100px;background-color:#000;content:"";filter:blur(15px);opacity:.9}.demo-section-inner .static-image.move-front:after{position:absolute;top:0;right:.8em;display:block;content:"X";font-family:system-ui;font-size:.8em;font-weight:700}.demo-section-inner .static-image--left{--translateX-direction: -1;grid-column:1/3;justify-self:start}.demo-section-inner .static-image--right{--translateX-direction: 1;grid-column:4/6;justify-self:end}}@keyframes moveFront{0%{z-index:0;transform:translate(calc(var(--translateX-direction) * 10%)) translateZ(0)}49%{z-index:0;transform:translate(calc(var(--translateX-direction) * 70%)) translateZ(80px)}50%{z-index:6;transform:translate(calc(var(--translateX-direction) * 70%)) translateZ(80px)}to{z-index:6;transform:translate(calc(var(--translateX-direction) * 0)) translateZ(80px)}}@keyframes moveBack{0%{z-index:6;transform:translate(calc(var(--translateX-direction) * 0)) translateZ(80px)}49%{z-index:6;transform:translate(calc(var(--translateX-direction) * 70%)) translateZ(80px)}50%{z-index:0;transform:translate(calc(var(--translateX-direction) * 70%)) translateZ(80px)}to{z-index:0;transform:translate(calc(var(--translateX-direction) * 10%)) translateZ(0)}}