.astoundCaseStudyListViewTitleBox{
    width:100%;
    display: flex;
    justify-content: end;
    margin-bottom:6px;
}
.astoundCaseStudyListViewTitleBoxRules{
    border-left:solid 1px black;
    border-top:solid 1px black;
    border-bottom:solid 1px black;
    padding-left:3em;
    padding-top:1em;
    padding-bottom:1em;
    padding-right:3rem;

}

    .astoundCaseStudyGridViewContainer{
        padding:8px;
        display: grid;
        column-gap: 8px; 
        row-gap: 8px; 
        grid-template-columns: 1fr 1fr 1fr  1fr; /* Three equal columns */
    }
    .astoundCaseStudyGridViewItem{
        position: relative;
          aspect-ratio: 1 / 1;
        width:100%;
        background-color:#fff;
        transition: 0.3s all;


    }
    .astoundCaseStudyGridViewItem:hover{

        padding:20px;
        background-color:#fff;

    }
    .astoundCaseStudyGridViewItem a{
        position: absolute;
        inset: 0px; 
        overflow: hidden;
        border-top-left-radius: 0px;
        border-bottom-right-radius: 0px;
        transition: 0.3s all;
        padding:0px;
        z-index:200;

    }
    .astoundCaseStudyGridViewItem a:hover{

        border-top-left-radius: 50%;
        border-bottom-right-radius: 50%;

        border-top-right-radius: 50%;
        border-bottom-left-radius: 50%;
        inset: 1px; 
        opacity:1.0;

    }

    .astoundCaseStudyGridViewItemImage{
        position: absolute;
        width:100%;
        height:100%;

    }
    .astoundCaseStudyGridViewItemImage img{
        width:100%;
        height:100%;
        transform: scale(1);
        transition: 0.4s all;
    }

        .astoundCaseStudyGridViewItem a:hover .astoundCaseStudyGridViewItemImage img{
        transform: scale(1.25);
        }
.astoundCaseStudyGridViewItemDetails{
        position: absolute;
        width:100%;
        height:100%;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: row;

}
.astoundCaseStudyGridViewItemDetails .astoundLargeAnimatedButton{
    transform: translateY(0px);
    background-color:rgba(255,255,255,1);
    border-radius: 50%;
    transition: 0.4s all;
    opacity:0.0;
        transform: scale(1);


}

.astoundCaseStudyGridViewItem a:hover .astoundLargeAnimatedButton{

        transform: scale(.75);
    opacity:1.0;
}


    @media (max-width: 1940px) {
        .astoundCaseStudyGridViewContainer{
            grid-template-columns: 1fr 1fr 1fr ; /* Three equal columns */
        }
    }

    @media (max-width: 1199px) {
        .astoundCaseStudyGridViewContainer{
            grid-template-columns: 1fr 1fr; /* Three equal columns */
        }
    }

    @media (max-width: 699px) {
        .astoundCaseStudyGridViewContainer{
            grid-template-columns: 1fr; /* Three equal columns */
            padding-left:0px;
            padding-right:0px;
        }
    }



    .astoundCaseStudyGridViewItem{
  perspective: 1000px;
}

.astoundCaseStudyGridViewItemImage{
  transform-style: preserve-3d;
  will-change: transform;
  transition: transform 160ms ease;
  position: absolute;
  inset: 0;
}

/* subtle light cue */
.astoundCaseStudyGridViewItemImage::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity: 0;
  transition: opacity 160ms ease;
  background:
    radial-gradient(
      220px 220px at var(--mx, 50%) var(--my, 50%),
      rgba(255,255,255,0.22),
      rgba(255,255,255,0) 60%
    );
}

.astoundCaseStudyGridViewItem:hover .astoundCaseStudyGridViewItemImage::after{
  opacity: 1;
}




.astoundCaseStudyGridViewItemDetailsTextContainer{
    position: absolute;
    z-index:400;
    width:100%;
    height:50%;
    display: flex;
    justify-content: center;
    text-align: center;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0) 100%);
    opacity:0.0;
    transition: 0.4s all;
    transform: scale(1.2);

}
.astoundCaseStudyGridViewItemDetailsText{
    display: flex;
    flex-direction: column;
    justify-content: center;
    width:100%;

}

.astoundCaseStudyGridViewItemDetailsText .astoundCaseStudyGridViewItemDetailsTextClient{
    font-family: 'ArchivoSemiBold';
    font-size:32px;
    line-height: 1em;
    margin-bottom: 5px;
    text-transform: none;
    color:#fff;
    padding-left:15%;
    padding-right:15%;
    text-wrap: balance;
    width:100%;

}
.astoundCaseStudyGridViewItemDetailsText .astoundCaseStudyGridViewItemDetailsTextProject{
    font-family: 'Archivo';
    font-size:24px;
    line-height: 1em;
    margin-bottom: 0px;
    text-transform: none;
    color:#fff;
    padding-left:15%;
    padding-right:15%;
    text-wrap: balance;
    width:100%;
}

.astoundCaseStudyGridViewItem a:hover .astoundCaseStudyGridViewItemDetailsTextContainer{
    opacity:1.0;
    transform: scale(1.0);

}