.modal-side{--modal-backdrop-color:rgba(0,0,0,.5);--modal-content-bg-color:var(--site-bg,#fff);--modal-header-bg-color:var(--color-accent-2,#c1c7d1);--modal-padding:var(--spacing-5,2rem)}.modal-side[open]{background:var(--modal-content-bg-color);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);height:100vh;bottom:0;inset:unset;max-height:unset;opacity:0;border:none;flex-direction:column;width:100%;max-width:800px;margin:0;padding:0;transition:transform .3s,opacity .3s;display:flex;position:fixed;top:0;left:auto;right:0;transform:translate(100%);box-shadow:-2px 0 8px rgba(0,0,0,.2)}.modal-side[open]::backdrop{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background-color:var(--modal-backdrop-color);opacity:0;transition:all .3s}.modal-side[open].show{opacity:1;transform:translate(0)}.modal-side[open].show::backdrop{opacity:1;transition:all .2s}.modal-side[open].fixed-footer-cta .modal-content{margin-bottom:6.5rem;overflow-x:hidden;overflow-y:auto}.modal-side[open].fixed-footer-cta .modal-footer{z-index:1;margin:0;position:absolute;left:0;right:0;box-shadow:0 0 10px rgba(0,0,0,.2)}.modal-side[open] .btn.close{color:var(--color-brand-1);cursor:pointer;padding:var(--spacing-1,.25rem);right:var(--spacing-3,1rem);top:var(--spacing-3,1rem);justify-content:center;align-items:center;transition:all .2s;display:inline-flex;position:absolute}.modal-side[open] .btn.close:hover{transition:all .2s;rotate:-90deg}.modal-side[open] .modal-header{background:var(--modal-header-bg-color);border-bottom:1px solid var(--global-border-color);padding:var(--spacing-4,1.5rem)var(--modal-padding);z-index:101;width:100%;position:-webkit-sticky;position:sticky;top:0;box-shadow:0 0 10px rgba(0,0,0,.2)}.modal-side[open] .header-title{text-align:center}.modal-side[open] .header-title.with-header-content{border-bottom:1px solid var(--global-border-color);margin-bottom:var(--spacing-3,1rem);padding-bottom:var(--spacing-3,1rem)}.modal-side[open] .modal-content{background:var(--modal-content-bg-color)url(/images/testing/card-bg/circles.png) 0 0/cover no-repeat;padding:var(--modal-padding);flex-direction:column;flex-grow:1;display:flex}.modal-side[open] .modal-footer{background:var(--modal-content-bg-color);border-top:1px solid var(--global-border-color);align-content:center;gap:var(--spacing-3,1rem);padding:var(--modal-padding);flex-wrap:wrap;justify-content:space-between;margin:auto -2rem -1rem;display:flex;bottom:0}.modal-side[open] .modal-footer .btn{flex:1}
