/*PHOTOS*/
.circle figure{
    width: 100%;
    height: 100%;
}
/*END PHOTOS*/

/*STATS*/
.stat-container{
    color: #fff;
    width: 100%;
    height: 100%;
    margin-inline:auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap:1rem;
    padding: 1rem;
    --lg-ch:calc(var(--h1) * .6327);
}

.windows #intro .stat-container{gap:0}

.circle{background-color: #00a651}
.stat{
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap:1rem
}

.windows .stat{gap:.75em!important}

:is(main>header,#intro) .stat{gap:0rem}
#share .stat{gap:0}
/*#disciple .stat{gap:0}*/

.stat div{
    display: flex;
    justify-content: center;
    gap:.236rem;
    width: fit-content;
    height: calc(var(--h1) * .72);
    position: relative;
}

.stat span{display: block;}

.stat-number{
    font-size: var(--h1);
    line-height: .4;
    line-height: 1;
    position: relative;
    z-index: 0;
}

.stat-title{
    font-size: var(--h4);
    line-height: .8;}

.stat div .stat-title{
    align-self: flex-end
}

.windows .stat div .stat-title{
    position: relative;
    top: .382em
}

.windows #disciple .stat:first-of-type .stat-title,
.windows #pack .stat .stat-title{
    position: relative;
    top: .236em
}

.stat>.stat-title{
    text-align: center;}

.stat-desc{
    font-size: .75em;
    line-height: 1.382;
    text-align: center;
}

@media(min-aspect-ratio:1.001/1){
    @media(max-width:64rem){
        #intro .circle .stat-container{
            transform: scale(.87)
        }
    }
    
    #disciple .stat-container{
        padding-top: 4vw;
        transform: scale(.87)
    }
}

@media(min-width:100rem){
    :is(#intro,#pack) .circle .stat-container{
        scale:.83
    }
}
/*END STATS*/