@supports(font-size:clamp(1rem, 0.38vw + .93rem, 1.382rem)){
    :root{
        --base-unit:clamp(1rem, 0.45vw + 0.85rem, 1.618rem);
        --ch-unit:calc(var(--base-unit)*.5145);
    }
}

main{font-family: merriweather,georgia,serif}
main>:last-child{padding-bottom: 0}

section{
    background-image:linear-gradient(to bottom,rgba(237,236,235,1) 0%,rgba(237,236,235,.5) 10%,rgba(237,236,235,.5) 90%,rgba(237,236,235,1) 100%),url('https://s3.theark.cloud/sp-comm-arkfiles/website/images/2024-ethiopia/img/bg_S.jpg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover
}

section>figure{
    position:relative;
    height:61.8vh;
    -webkit-mask-image:linear-gradient(to top, rgba(0,0,0,.2)2vh, rgba(0,0,0,1)21vh);
            mask-image:linear-gradient(to top, rgba(0,0,0,.2)2vh, rgba(0,0,0,1)21vh);
    margin-bottom: -13vh;
}

#overview>figure{
    height: min(100vmin,61.8vh);
    height: min(61.8vmin,61.8vh);
    margin-bottom: 0;
}

@media(max-aspect-ratio:1/1) and (max-width:64rem){
    #overview>figure{
        -webkit-mask-image:none;
                mask-image:none;
    }
}

figure>div{height: 100%}
video{object-fit: cover}

figure>div :is(img,video){
    height: 100%;
    -webkit-mask-mode: luminance;
            mask-mode: luminance;
    -webkit-mask-size:100% 100%;
            mask-size:100% 100%;
}

section:nth-of-type(1)>figure>div video{
    -webkit-mask-image:url('https://s3.theark.cloud/sp-comm-arkfiles/website/images/2024-ethiopia/masks/mask-01_sL.jpg');
            mask-image:url('https://s3.theark.cloud/sp-comm-arkfiles/website/images/2024-ethiopia/masks/mask-01_sL.jpg');
}

section:nth-of-type(2)>figure>div img{
    -webkit-mask-image:url('https://s3.theark.cloud/sp-comm-arkfiles/website/images/2024-ethiopia/masks/mask-02_sL.jpg');
            mask-image:url('https://s3.theark.cloud/sp-comm-arkfiles/website/images/2024-ethiopia/masks/mask-02_sL.jpg');
}

section:nth-of-type(3)>figure>div img{
    -webkit-mask-image:url('https://s3.theark.cloud/sp-comm-arkfiles/website/images/2024-ethiopia/masks/mask-03_sL.jpg');
            mask-image:url('https://s3.theark.cloud/sp-comm-arkfiles/website/images/2024-ethiopia/masks/mask-03_sL.jpg');
}

section:nth-of-type(4)>figure>div img{
    -webkit-mask-image:url('https://s3.theark.cloud/sp-comm-arkfiles/website/images/2024-ethiopia/masks/mask-04_sL.jpg');
            mask-image:url('https://s3.theark.cloud/sp-comm-arkfiles/website/images/2024-ethiopia/masks/mask-04_sL.jpg');
}

section:nth-of-type(5)>figure>div img{
    -webkit-mask-image:url('https://s3.theark.cloud/sp-comm-arkfiles/website/images/2024-ethiopia/masks/mask-02_sL.jpg');
            mask-image:url('https://s3.theark.cloud/sp-comm-arkfiles/website/images/2024-ethiopia/masks/mask-02_sL.jpg');
}

section:not(#overview)>div{
    padding-bottom: 8em;
    position: relative
}

section>header{position: relative}

#overview header{
    flex-direction: column;
    padding-bottom: 8vh;
    padding-bottom: 8svh
}

#overview hgroup{
    margin-bottom: 3vh;
    margin-bottom: 3svh
}

.donationItem{
    margin-inline:0;
    width: 100%!important;
    height: auto;
    background-color: #fdfcfb;
    background-color: #edeceb;
    font-size: .75em
}

section:not(#overview) .donationItem{
    position: sticky;
    top: calc(100vh - 6.382em);
    top: calc(100dvh - 6.382em);
    height: 6.382em;
    padding:1em;
    z-index: 5;
}

section:is(#overview,:last-of-type) .donationItem{border-bottom: none}

.donationItem>span{
    font-size: 1.146em;
    text-align: center
}

.diSlimWrap{margin-top: .618em}
.diSlimBtn{white-space: nowrap}
h1,p .edo{letter-spacing: -.03ch}

blockquote{
    border-left: none!important;
    padding-left: 0!important
}

header blockquote{margin-bottom: 0}
@supports not (hanging-punctuation: first force-end last){.quote{margin-left: -1.1ch}}
blockquote p{color:#555}
blockquote i{color: #000}
.scripture{text-align: right}

@media(min-aspect-ratio:1/1) and (min-width:64rem){
    main::after{
        content: '';
        display: block;
        width: 100%;
        height: 100vh;
        position: fixed;
        top: 0;
        left: 0;
        z-index: -1;
        background-image: url('https://s3.theark.cloud/sp-comm-arkfiles/website/images/2024-ethiopia/img/bg.jpg')
    }
    
    main>*>*{
        width: 50%;
        margin-inline:0;
        padding-inline:1.618em;
    }
    
    main>*>*>*:not(section>figure div,#overview header *){margin-inline:calc((100% - min(100%, var(--ch-unit)*62))/2);}
    
    section{
        position: relative;
        padding-bottom: 13vh;
        --header-height:100vh;
        background-image:linear-gradient(to bottom,rgba(237,236,235,1) 0%,rgba(237,236,235,.13) 15%,rgba(237,236,235,.13) 80%,rgba(237,236,235,1) 100%),linear-gradient(to right,rgba(237,236,235,.1) 38%,rgba(237,236,235,.95) 62%);
        background-image:linear-gradient(to bottom,rgba(237,236,235,1) 0%,rgba(237,236,235,0) 15%,rgba(237,236,235,0) 85%,rgba(237,236,235,1) 100%);
        background-size: cover;
        background-repeat: no-repeat
    }
    
    section:nth-of-type(even){
/*        background-image:linear-gradient(to bottom,rgba(237,236,235,1) 0%,rgba(237,236,235,.13) 15%,rgba(237,236,235,.13) 80%,rgba(237,236,235,1) 100%),linear-gradient(to left,rgba(237,236,235,.1) 38%,rgba(237,236,235,.95) 62%);*/
        
    }
    
    section:first-of-type{--header-height:calc(100vh - var(--nav-2))}
    
    #overview{
        padding-bottom: 0;
/*        background-image:linear-gradient(to bottom,rgba(237,236,235,0) 0%,rgba(237,236,235,0) 15%,rgba(237,236,235,0) 85%,rgba(237,236,235,1) 100%);*/
    }
    
    section>figure{
        width: 61.8%;
        padding: 0;
    }
    
    section:nth-of-type(odd)>figure{
        width: 61.8%;
        -webkit-mask-image:linear-gradient(to right, rgba(0,0,0,0)3%, rgba(0,0,0,1)24vw);
                mask-image:linear-gradient(to right, rgba(0,0,0,0)3%, rgba(0,0,0,1)24vw);
    }
    
    section:nth-of-type(even)>figure{
        -webkit-mask-image:linear-gradient(to left, rgba(0,0,0,0)5%, rgba(0,0,0,1)24vw);
                mask-image:linear-gradient(to left, rgba(0,0,0,0)5%, rgba(0,0,0,1)24vw);
    }
    
    .sticky-img{
        position: sticky;
        top: 0;
        margin-bottom: 0;
        margin-left: auto;
        height: var(--header-height)!important;
    }
    
    #overview>.sticky-img{
        width: 70vw;
        top: calc((100vh - var(--header-height))/2);
        display: flex;
        justify-content: flex-end;
        align-items: center;
        
        
    }
    
    #overview header{
/*        justify-content: flex-end;*/
/*        padding-block:0 */
    }
    
    #overview>div:not(.donationItem){
        position: relative;
        margin-top: var(--nav-2)
    }
    
    #overview>.sticky-img div{
        height: calc(70vw * .5625);
/*        margin-bottom: 13vh*/
    }
    
    #overview img{aspect-ratio:unset}
    section:nth-of-type(even)>.sticky-img{margin-left: 0}
    
    section:nth-of-type(1)>figure>div video{
        -webkit-mask-image:url('https://s3.theark.cloud/sp-comm-arkfiles/website/images/2024-ethiopia/masks/mask-01_L.jpg');
                mask-image:url('https://s3.theark.cloud/sp-comm-arkfiles/website/images/2024-ethiopia/masks/mask-01_L.jpg');
    }
    
    section:nth-of-type(2)>figure>div img{
        -webkit-mask-image:url('https://s3.theark.cloud/sp-comm-arkfiles/website/images/2024-ethiopia/masks/mask-02_L.jpg');
                mask-image:url('https://s3.theark.cloud/sp-comm-arkfiles/website/images/2024-ethiopia/masks/mask-02_L.jpg');
    }
    
    section:nth-of-type(3)>figure>div img{
        -webkit-mask-image:url('https://s3.theark.cloud/sp-comm-arkfiles/website/images/2024-ethiopia/masks/mask-03_L.jpg');
                mask-image:url('https://s3.theark.cloud/sp-comm-arkfiles/website/images/2024-ethiopia/masks/mask-03_L.jpg');
    }
    
    section:nth-of-type(4)>figure>div img{
        -webkit-mask-image:url('https://s3.theark.cloud/sp-comm-arkfiles/website/images/2024-ethiopia/masks/mask-04_L.jpg');
                mask-image:url('https://s3.theark.cloud/sp-comm-arkfiles/website/images/2024-ethiopia/masks/mask-04_L.jpg');
    }
    
    section:nth-of-type(5)>figure>div img{
        -webkit-mask-image:url('https://s3.theark.cloud/sp-comm-arkfiles/website/images/2024-ethiopia/masks/mask-02_L.jpg');
                mask-image:url('https://s3.theark.cloud/sp-comm-arkfiles/website/images/2024-ethiopia/masks/mask-02_L.jpg');
    }
    
    #outro figure>div img{
        -webkit-mask-image:url('https://s3.theark.cloud/sp-comm-arkfiles/website/images/2024-ethiopia/masks/mask-03_L.jpg');
                mask-image:url('https://s3.theark.cloud/sp-comm-arkfiles/website/images/2024-ethiopia/masks/mask-03_L.jpg');
    }
    
    section:nth-of-type(even)>:is(header,div){margin-left: auto}

    section:not(#overview)>.sticky-img>div:first-of-type{
        height: calc(100vh - 2.618em);
        margin-bottom: 2.618em;
        font-size: .75em
    }
    
    section>header{
        height:var(--header-height);
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: flex-start;
    }
    
    .sticky-img+header{margin-top: calc(var(--header-height)*-1)}
    
    #overview hgroup{margin-inline:0}
    h1{font-size: var(--h0)}
    #overview hgroup{margin-block:0 5vh}
    
    #overview hgroup p{
        font-size: 1em;
        max-width: 50ch
    }
    
    #overview p .edo{
        font-size: var(--h1);
        white-space: nowrap
    }
    
    #ethiopia-projects{margin-left: 0}
    
    .donationItem{
        margin-left: auto;
        width: 61.8%!important;
        display: flex;
        justify-content: flex-end;
        align-items: center;
        gap:1em; 
        background-color: unset;
    }
    
    section:nth-of-type(odd) .donationItem{padding-left: 13%!important}
    section:nth-of-type(even) .donationItem{padding-right: 13%!important}
    
    #overview .donationItem{
        margin-top: 1.618em;
        width: min(100%, var(--ch-unit)*38)!important;
        padding: 0!important
    }
    
    section:not(#overview) .donationItem{
        margin-top: -4.618em;
        top: calc(100vh - 4.618em);
        top: calc(100dvh - 4.618em);
        height: 4.618em;
        border-bottom:none
    }
    
    section:nth-of-type(even) .donationItem{margin-left: 0}
    
    .donationItem>*{
        margin: 0!important;
        flex: 1 1 50%}
    
    .donationItem>span{
        font-size: 1.382em;
        text-align: right;
    }
    
    .diSlimWrap{flex-wrap: nowrap}
    .diSlimTitleWrap{z-index: 1}
    
    .diSlimAmt,.diSlimBtn{
        position: relative;
        z-index: 2
    }
    
    section>div{padding-bottom: 13vh;}
    section:nth-of-type(odd)>:is(header,div:not(.donationItem)){padding-right: 0}
    section:nth-of-type(even)>:is(header,div:not(.donationItem)){padding-left: 0}
/*    #overview>div{margin-top: var(--nav-2)}*/
    .hide-on-large-screen{display: none}
    
    @media(min-width:80rem){
        .h1{
            font-size: calc(var(--h1) + .5vw)
        }
    }
    
    .mask-wipe-section{padding-bottom: 0}
    
    .mask-wipe{
        position: absolute;
        top: 0;
        z-index: 0;
        width: 61.8%;
        height: 100%;
        height: calc(100% - 2.618rem)
    }
    
    section:nth-of-type(odd) .mask-wipe{right: 0}
    section:nth-of-type(even) .mask-wipe{left: 0;}
    
    .mask-wipe div{
        height: calc(100% / var(--img-count));
        display: block;
        -webkit-mask-mode: luminance;
                mask-mode: luminance;
        -webkit-mask-size:100% 100%;
                mask-size:100% 100%;
    }
    
    .mask-wipe div:nth-of-type(1){
        -webkit-mask-image:url('https://s3.theark.cloud/sp-comm-arkfiles/website/images/2024-ethiopia/masks/mask-03_P.jpg');
                mask-image:url('https://s3.theark.cloud/sp-comm-arkfiles/website/images/2024-ethiopia/masks/mask-03_P.jpg')
    }
    
    .mask-wipe div:nth-of-type(2){
        -webkit-mask-image:url('https://s3.theark.cloud/sp-comm-arkfiles/website/images/2024-ethiopia/masks/mask-03_P.jpg');
                mask-image:url('https://s3.theark.cloud/sp-comm-arkfiles/website/images/2024-ethiopia/masks/mask-03_P.jpg')
    }
    
    #food .mask-wipe div:nth-of-type(4){left: -5%}
    
    .mask-wipe div:nth-of-type(3){
        margin-top: -10vh;
        height: calc(100% / var(--img-count) + 10vh);
    }
    
    #occupation .mask-wipe div:nth-of-type(2),
    .mask-wipe div:nth-of-type(3){
        -webkit-mask-image:url('https://s3.theark.cloud/sp-comm-arkfiles/website/images/2024-ethiopia/masks/mask-01_P.jpg');
                mask-image:url('https://s3.theark.cloud/sp-comm-arkfiles/website/images/2024-ethiopia/masks/mask-01_P.jpg')
    }
    
    .mask-wipe div:nth-of-type(4){
        margin-top: -21vh;
        height: calc(100% / var(--img-count) + 30vh);
    }
    
    #trauma .mask-wipe div:nth-of-type(1),
    .mask-wipe div:nth-of-type(4){
        -webkit-mask-image:url('https://s3.theark.cloud/sp-comm-arkfiles/website/images/2024-ethiopia/masks/mask-04_P.jpg');
                mask-image:url('https://s3.theark.cloud/sp-comm-arkfiles/website/images/2024-ethiopia/masks/mask-04_P.jpg')
    }
    
    .mask-wipe div+div{margin-top: -8vh}
    
    :is(#trauma,#occupation) .mask-wipe div:nth-of-type(2){
        margin-top: -21vh;
        height: calc(100% / var(--img-count) + 21vh);
    }
    
    .mask-wipe img{
        position: fixed;
        top: 0;
        width: 61.8%;
        width: 65.8%;
        height: calc(100vh - 2.618em);
        -webkit-mask-image:url('https://s3.theark.cloud/sp-comm-arkfiles/website/images/2024-ethiopia/masks/mask-01_P.jpg')!important;
                mask-image:url('https://s3.theark.cloud/sp-comm-arkfiles/website/images/2024-ethiopia/masks/mask-01_P.jpg')!important
    }
    
    #trauma .mask-wipe img{
        -webkit-mask-image:url('https://s3.theark.cloud/sp-comm-arkfiles/website/images/2024-ethiopia/masks/mask-02_L.jpg')!important;
                mask-image:url('https://s3.theark.cloud/sp-comm-arkfiles/website/images/2024-ethiopia/masks/mask-02_L.jpg')!important;
    }
    
    #occupation .mask-wipe img{
        -webkit-mask-image:url('https://s3.theark.cloud/sp-comm-arkfiles/website/images/2024-ethiopia/masks/mask-03_L.jpg')!important;
                mask-image:url('https://s3.theark.cloud/sp-comm-arkfiles/website/images/2024-ethiopia/masks/mask-03_L.jpg')!important;
    }
    
    section:nth-of-type(odd) .mask-wipe img{right: -2%}
    section:nth-of-type(even) .mask-wipe img{left: -2%;}
    .mask-wipe div:last-of-type{position: relative}
    
    .mask-wipe~:is(header,div){
        position: relative;
        z-index: 8
    }
    
    .mask-wipe-section header{
        height: 38vh;
        height: auto;
        margin-top: 0;
        padding-block: 13vh
    }
    
    #outro header{
        height: auto;
        padding-block:21vh 13vh
    }
    
    #outro>div:not(.donationItem){z-index: 5}
}

@media(min-width:88rem){
    @supports(font-size:clamp(1rem, 0.38vw + .93rem, 1.382rem)){
        :root{
            --base-unit:clamp(1rem, 0.5vw + 1rem, 1.77rem);
        }
    }
    
    h1{
/*        font-size: calc(var(--h0) * .9);*/
        font-size:calc(var(--h1) * 1.618 )
    }
    
    main{line-height: 1.8}
    main>*>*>*:not(section>figure div,#overview header){margin-inline:calc((100% - min(100%, var(--ch-unit)*70))/2)}
    main>*>*>*:not(a,aside,button,div,figcaption,h1,.h1,h2,.h2,header,header img,header video,hgroup,hgroup p,small,.small){width: min(100%, var(--ch-unit)*70)}
}