:root{--pg-primary:#7000ff;--pg-secondary:#ff6594;--pg-accent:#0f0bbf}.pg-aware-grid{display:grid;padding:20px}.pg-aware-item{position:relative;box-shadow:.5rem -.5rem 0 var(--pg-accent),0 .5rem 0 transparent,-.5rem -1rem 0 var(--pg-secondary)}.pg-aware-title{margin:0;align-self:center;padding:.25em;position:relative;z-index:1;font-size:30px;text-align:center;text-transform:uppercase}.pg-aware-image-wrap .pg-aware-img{height:100%;width:100%}@supports (clip-path:circle(25%)){.pg-aware-style-1 .pg-aware-item:hover .pg-aware-img{clip-path:polygon(0% 0%,100% 0%,100% 50%,100% 100%,0% 100%)}.pg-aware-style-1 .pg-aware-img{clip-path:polygon(18.11% 16.5%,50% 0%,75% 50%,54.09% 90.44%,13.7% 63.94%)}}@supports (clip-path:circle(25%)){.pg-aware-style-2 .pg-aware-item:hover .pg-aware-img{clip-path:polygon(18.11% 16.5%,50% 0%,75% 50%,54.09% 90.44%,13.7% 63.94%)}.pg-aware-style-2 .pg-aware-img{clip-path:polygon(0% 0%,100% 0%,100% 50%,100% 100%,0% 100%)}}@supports (clip-path:circle(25%)){.pg-aware-style-3 .pg-aware-item:hover .pg-aware-img{clip-path:circle(70.7% at 50% 50%)}.pg-aware-style-3 .pg-aware-img{clip-path:circle(30% at 50% 50%)}}@supports (clip-path:circle(25%)){.pg-aware-style-4 .pg-aware-item:hover .pg-aware-img{clip-path:polygon(0% 0%,100% 0,100% 75%,100% 100%,75% 100%,44% 100%,0 100%)}.pg-aware-style-4 .pg-aware-img{clip-path:polygon(0% 0%,100% 0,100% 75%,75% 75%,75% 100%,50% 75%,0% 75%)}}@supports (clip-path:circle(25%)){.pg-aware-style-5 .pg-aware-item:hover .pg-aware-img{clip-path:polygon(100% 0,100% 50%,100% 99%,0% 100%,0 50%,0% 0%)}.pg-aware-style-5 .pg-aware-img{clip-path:polygon(75% 0%,100% 50%,75% 100%,0% 100%,25% 50%,0% 0%)}}@supports (clip-path:circle(25%)){.pg-aware-item{clip-path:circle(0%);animation:circle-grow 2s .45s forwards}.pg-aware-img{transition:clip-path .4s ease-in-out}.pg-aware-title{clip-path:inset(50% 50%);animation:heading-in .4s 1s forwards}}@keyframes circle-grow{to{clip-path:circle(100%)}}@keyframes heading-in{to{clip-path:inset(0% 0%)}}@supports (mix-blend-mode:darken){.pg-aware-item{background-image:linear-gradient(45deg,var(--pg-primary),rgba(8,61,169,.651))}}@supports (-webkit-text-stroke:1px black){.pg-aware-title{color:#fff}}@media screen and (min-width:25rem){.pg-aware-title:before{content:"";position:absolute;inset-inline-start:0;inset-block-start:0;width:100%;height:60%;clip-path:circle(3% at 95%);background:var(--pg-secondary);z-index:-1;transition:clip-path .4s ease-in-out}.pg-aware-item:hover .pg-aware-title:before{clip-path:circle(100%)}}