.loader{--size:600px;--duration:2.5s;--logo-color:#1a3562;--background:linear-gradient(0deg, #1a356226 0%, #ea935026 100%);height:var(--size);aspect-ratio:1;pointer-events:none;position:relative}.loader .box{background:var(--background);animation:ripple var(--duration) infinite ease-in-out;inset:var(--inset);animation-delay:calc(var(--i) * .15s);z-index:calc(var(--i) * -1);pointer-events:all;border-radius:50%;transition:all .3s;position:absolute;box-shadow:0 10px 10px #1a35624d,inset 0 5px 10px -7px #ea9350}.loader .box:last-child{filter:blur(30px)}.loader .logo{place-content:center;padding:10%;display:grid;position:absolute;inset:0}.loader .logo svg{fill:var(--logo-color);width:140%;animation:color-change var(--duration) infinite ease-in-out}.st0{fill:#fff;stroke:#000;stroke-miterlimit:10}.st1{fill:#fff}.st2{fill:#1a3562}.st3{fill:#ea9350}.st4{fill:#1a3562}.st5{fill:#ea9350}@keyframes ripple{0%{transform:scale(1);box-shadow:0 10px 10px #00000080,inset 0 5px 10px -7px #ea9350}65%{transform:scale(1.4);box-shadow:0 0 #0000}to{transform:scale(1);box-shadow:0 10px 10px #00000080,inset 0 5px 10px -7px #1a3562}}@keyframes color-change{0%{fill:var(--logo-color)}50%{fill:#ea9350}to{fill:var(--logo-color)}}