:root{
    --aloptwah-pages-ink:#111;
    --aloptwah-pages-muted:#6d6d6d;
    --aloptwah-pages-line:rgba(17,17,17,.16);
    --aloptwah-pages-bone:#f4f1ea;
}

.aloptwah-journal-opening,
.aloptwah-journal-opening *,
.aloptwah-about,
.aloptwah-about *{box-sizing:border-box}

.aloptwah-journal-opening{
    display:grid;
    width:100%;
    min-height:var(--aloptwah-journal-height,62svh);
    place-items:center;
    padding:clamp(70px,10vw,150px) clamp(24px,6vw,90px);
    background:#fff;
    color:var(--aloptwah-pages-ink);
}

.aloptwah-journal-opening__inner{
    width:min(100%,980px);
}

.aloptwah-journal-opening--center .aloptwah-journal-opening__inner{
    margin-inline:auto;
    text-align:center;
}

.aloptwah-journal-opening--right .aloptwah-journal-opening__inner{
    margin-left:auto;
    text-align:right;
}

.aloptwah-journal-opening__eyebrow,
.aloptwah-about__eyebrow{
    margin:0 0 24px;
    color:var(--aloptwah-pages-muted);
    font:500 10px/1.3 Arial,Helvetica,sans-serif;
    letter-spacing:.3em;
    text-transform:uppercase;
}

.aloptwah-journal-opening h1{
    max-width:12ch;
    margin:0;
    font-size:clamp(64px,11vw,168px);
    font-weight:400;
    letter-spacing:-.065em;
    line-height:.84;
    text-wrap:balance;
}

.aloptwah-journal-opening--center h1{
    margin-inline:auto;
}

.aloptwah-journal-opening--right h1{
    margin-left:auto;
}

.aloptwah-journal-opening__description{
    max-width:48ch;
    margin:36px 0 0;
    color:var(--aloptwah-pages-muted);
    font-size:clamp(15px,1.3vw,20px);
    line-height:1.75;
}

.aloptwah-journal-opening--center .aloptwah-journal-opening__description{
    margin-inline:auto;
}

.aloptwah-journal-opening--right .aloptwah-journal-opening__description{
    margin-left:auto;
}


.aloptwah-about{
    width:100%;
    overflow:hidden;
    background:var(--aloptwah-pages-bone);
    color:var(--aloptwah-pages-ink);
}

.aloptwah-about--white{background:#fff}
.aloptwah-about--black{background:#0e0e0e;color:#f3f0e9}

.aloptwah-about__wordmark{
    display:flex;
    align-items:center;
    justify-content:inherit;
    color:inherit;
}

.aloptwah-about__wordmark-text{
    display:inline-flex;
    align-items:center;
    gap:.32em;
    font-family:Arial,Helvetica,sans-serif;
    font-size:clamp(14px,1.2vw,18px);
    font-weight:300;
    line-height:1;
    letter-spacing:0;
}

.aloptwah-about__letter{
    display:inline-block;
    font-weight:300;
}

.aloptwah-about__letter--a{
    transform:scaleX(.88);
}

.aloptwah-about__wordmark-image{
    display:block;
    width:auto;
    max-width:min(260px,72vw);
    height:clamp(20px,2.4vw,30px);
    object-fit:contain;
}

/* Monograph layout */
.aloptwah-about__monograph{
    width:min(calc(100% - 40px),1280px);
    margin-inline:auto;
    padding:clamp(100px,14vw,220px) 0 clamp(110px,15vw,240px);
}

.aloptwah-about__portrait{
    width:min(76vw,760px);
    margin:0 auto;
    overflow:hidden;
    background:#ddd8cf;
}

.aloptwah-about__portrait img{
    display:block;
    width:100%;
    height:auto;
    max-height:82svh;
    object-fit:cover;
}

.aloptwah-about__identity{
    width:min(100%,760px);
    margin:clamp(48px,7vw,92px) auto 0;
    text-align:center;
}

.aloptwah-about__identity .aloptwah-about__wordmark{
    justify-content:center;
}

.aloptwah-about__identity .aloptwah-about__wordmark-text{
    font-size:clamp(18px,2vw,28px);
    gap:.34em;
}

.aloptwah-about__identity .aloptwah-about__wordmark-image{
    height:clamp(24px,3vw,38px);
}

.aloptwah-about__identity .aloptwah-about__intro{
    max-width:36ch;
    margin:32px auto 0;
    color:var(--aloptwah-pages-muted);
    font-size:clamp(20px,2.1vw,30px);
    line-height:1.5;
    text-wrap:balance;
}

.aloptwah-about__statement{
    display:grid;
    grid-template-columns:minmax(180px,.42fr) minmax(0,1fr);
    gap:clamp(44px,8vw,130px);
    width:min(100%,1040px);
    margin:clamp(64px,9vw,120px) auto 0;
    padding-top:clamp(54px,7vw,90px);
    border-top:1px solid var(--aloptwah-pages-line);
}

.aloptwah-about--black .aloptwah-about__statement{
    border-color:rgba(243,240,233,.18);
}

.aloptwah-about__statement .aloptwah-about__eyebrow{
    margin:9px 0 0;
}

.aloptwah-about__statement h1{
    grid-column:2;
    max-width:10ch;
    margin:0;
    font-size:clamp(46px,6.5vw,98px);
    font-weight:400;
    letter-spacing:-.06em;
    line-height:.9;
    text-wrap:balance;
}

.aloptwah-about__statement .aloptwah-about__body,
.aloptwah-about__statement .aloptwah-about__link{
    grid-column:2;
}

.aloptwah-about__statement .aloptwah-about__body{
    max-width:60ch;
    margin-top:34px;
}

/* Split layout */
.aloptwah-about__inner{
    display:grid;
    grid-template-columns:minmax(0,1.05fr) minmax(320px,.95fr);
    gap:clamp(48px,8vw,130px);
    width:min(calc(100% - 40px),1440px);
    min-height:min(88svh,980px);
    align-items:center;
    margin-inline:auto;
    padding:clamp(72px,10vw,150px) 0;
}

.aloptwah-about--image-right .aloptwah-about__media{
    grid-column:2;
    grid-row:1;
}

.aloptwah-about--image-right .aloptwah-about__copy{
    grid-column:1;
    grid-row:1;
}

.aloptwah-about--image-top .aloptwah-about__inner{
    grid-template-columns:1fr;
    width:min(calc(100% - 40px),1120px);
}

.aloptwah-about__media{
    margin:0;
    overflow:hidden;
    background:#ddd8cf;
}

.aloptwah-about__media img{
    display:block;
    width:100%;
    height:min(72svh,880px);
    object-fit:cover;
}

.aloptwah-about__copy{
    max-width:640px;
}

.aloptwah-about__copy .aloptwah-about__wordmark{
    margin-bottom:38px;
}

.aloptwah-about--text-center .aloptwah-about__copy{
    margin-inline:auto;
    text-align:center;
}

.aloptwah-about--text-center .aloptwah-about__wordmark{
    justify-content:center;
}

.aloptwah-about--text-right .aloptwah-about__copy{
    margin-left:auto;
    text-align:right;
}

.aloptwah-about--text-right .aloptwah-about__wordmark{
    justify-content:flex-end;
}

.aloptwah-about__eyebrow{
    margin:0 0 24px;
    color:var(--aloptwah-pages-muted);
    font:500 10px/1.3 Arial,Helvetica,sans-serif;
    letter-spacing:.3em;
    text-transform:uppercase;
}

.aloptwah-about h1{
    max-width:10ch;
    margin:0;
    font-size:clamp(54px,7vw,112px);
    font-weight:400;
    letter-spacing:-.06em;
    line-height:.88;
    text-wrap:balance;
}

.aloptwah-about--text-center h1{margin-inline:auto}
.aloptwah-about--text-right h1{margin-left:auto}

.aloptwah-about__intro{
    max-width:44ch;
    margin:38px 0 0;
    font-size:clamp(19px,1.8vw,27px);
    line-height:1.55;
}

.aloptwah-about__body{
    max-width:58ch;
    margin-top:34px;
    color:var(--aloptwah-pages-muted);
    font-size:16px;
    line-height:1.85;
}

.aloptwah-about--black .aloptwah-about__body,
.aloptwah-about--black .aloptwah-about__eyebrow,
.aloptwah-about--black .aloptwah-about__identity .aloptwah-about__intro{
    color:rgba(243,240,233,.62);
}

.aloptwah-about__body p{
    margin:0 0 1.4em;
}

.aloptwah-about__link{
    display:inline-flex;
    gap:18px;
    align-items:center;
    margin-top:30px;
    color:inherit;
    font:500 11px/1.2 Arial,Helvetica,sans-serif;
    letter-spacing:.18em;
    text-decoration:none;
    text-transform:uppercase;
}

@media(max-width:800px){
    .aloptwah-journal-opening{
        min-height:min(var(--aloptwah-journal-height,62svh),680px);
    }

    .aloptwah-about__monograph{
        width:min(calc(100% - 32px),1280px);
        padding:78px 0 110px;
    }

    .aloptwah-about__portrait{
        width:100%;
    }

    .aloptwah-about__portrait img{
        max-height:none;
    }

    .aloptwah-about__identity{
        margin-top:52px;
    }

    .aloptwah-about__statement{
        grid-template-columns:1fr;
        gap:22px;
        margin-top:64px;
        padding-top:52px;
    }

    .aloptwah-about__statement h1,
    .aloptwah-about__statement .aloptwah-about__body,
    .aloptwah-about__statement .aloptwah-about__link{
        grid-column:1;
    }

    .aloptwah-about__statement .aloptwah-about__eyebrow{
        margin:0;
    }

    .aloptwah-about__inner{
        grid-template-columns:1fr;
        gap:42px;
        min-height:0;
        padding:70px 0 88px;
    }

    .aloptwah-about--image-right .aloptwah-about__media,
    .aloptwah-about--image-right .aloptwah-about__copy{
        grid-column:auto;
        grid-row:auto;
    }

    .aloptwah-about__media img{
        height:auto;
        max-height:72svh;
    }
}

/* Version 1.2 responsive image art direction */
.aloptwah-about__image-frame{
    width:var(--aloptwah-about-image-desktop-width,76%);
    max-width:100%;
    border-radius:var(--aloptwah-about-image-desktop-radius,0);
    opacity:var(--aloptwah-about-image-desktop-opacity,1);
}
.aloptwah-about__image-frame picture{display:block;width:100%;height:100%}
.aloptwah-about__image-frame img{
    display:block;
    width:100%;
    height:var(--aloptwah-about-image-desktop-height,82svh);
    max-height:var(--aloptwah-about-image-desktop-height,82svh);
    object-fit:cover;
    object-position:center;
}
.aloptwah-about__image-frame[data-desktop-show="0"]{display:none}
.aloptwah-about__image-frame[data-desktop-ratio="4-5"]{aspect-ratio:4/5}
.aloptwah-about__image-frame[data-desktop-ratio="3-4"]{aspect-ratio:3/4}
.aloptwah-about__image-frame[data-desktop-ratio="1-1"]{aspect-ratio:1/1}
.aloptwah-about__image-frame[data-desktop-ratio="4-3"]{aspect-ratio:4/3}
.aloptwah-about__image-frame[data-desktop-ratio="16-9"]{aspect-ratio:16/9}
.aloptwah-about__image-frame:not([data-desktop-ratio="original"]) img{height:100%;max-height:none}
.aloptwah-about__image-frame[data-desktop-fit="contain"] img{object-fit:contain}
.aloptwah-about__image-frame[data-desktop-focus="top"] img{object-position:center top}
.aloptwah-about__image-frame[data-desktop-focus="bottom"] img{object-position:center bottom}
.aloptwah-about__image-frame[data-desktop-focus="left"] img{object-position:left center}
.aloptwah-about__image-frame[data-desktop-focus="right"] img{object-position:right center}
.aloptwah-about__image-frame[data-desktop-effect="monochrome"] img{filter:grayscale(1)}
.aloptwah-about__image-frame[data-desktop-effect="soft"] img{filter:saturate(.82) contrast(.94) brightness(1.03)}
.aloptwah-about__image-frame[data-desktop-effect="contrast"] img{filter:contrast(1.16) saturate(.92)}
.aloptwah-about__portrait.aloptwah-about__image-frame{margin-inline:auto}
.aloptwah-about__media.aloptwah-about__image-frame{align-self:center}

@media(max-width:900px){
    .aloptwah-about__image-frame{
        display:block;
        width:var(--aloptwah-about-image-tablet-width,88%);
        border-radius:var(--aloptwah-about-image-tablet-radius,0);
        opacity:var(--aloptwah-about-image-tablet-opacity,1);
    }
    .aloptwah-about__image-frame[data-tablet-show="0"]{display:none}
    .aloptwah-about__image-frame img{height:var(--aloptwah-about-image-tablet-height,70svh);max-height:var(--aloptwah-about-image-tablet-height,70svh);filter:none;object-fit:cover;object-position:center}
    .aloptwah-about__image-frame[data-tablet-ratio="original"]{aspect-ratio:auto}
    .aloptwah-about__image-frame[data-tablet-ratio="4-5"]{aspect-ratio:4/5}
    .aloptwah-about__image-frame[data-tablet-ratio="3-4"]{aspect-ratio:3/4}
    .aloptwah-about__image-frame[data-tablet-ratio="1-1"]{aspect-ratio:1/1}
    .aloptwah-about__image-frame[data-tablet-ratio="4-3"]{aspect-ratio:4/3}
    .aloptwah-about__image-frame[data-tablet-ratio="16-9"]{aspect-ratio:16/9}
    .aloptwah-about__image-frame:not([data-tablet-ratio="original"]) img{height:100%;max-height:none}
    .aloptwah-about__image-frame[data-tablet-fit="contain"] img{object-fit:contain}
    .aloptwah-about__image-frame[data-tablet-focus="top"] img{object-position:center top}
    .aloptwah-about__image-frame[data-tablet-focus="bottom"] img{object-position:center bottom}
    .aloptwah-about__image-frame[data-tablet-focus="left"] img{object-position:left center}
    .aloptwah-about__image-frame[data-tablet-focus="right"] img{object-position:right center}
    .aloptwah-about__image-frame[data-tablet-effect="monochrome"] img{filter:grayscale(1)}
    .aloptwah-about__image-frame[data-tablet-effect="soft"] img{filter:saturate(.82) contrast(.94) brightness(1.03)}
    .aloptwah-about__image-frame[data-tablet-effect="contrast"] img{filter:contrast(1.16) saturate(.92)}
}

@media(max-width:600px){
    .aloptwah-about__image-frame{
        display:block;
        width:var(--aloptwah-about-image-mobile-width,100%);
        border-radius:var(--aloptwah-about-image-mobile-radius,0);
        opacity:var(--aloptwah-about-image-mobile-opacity,1);
    }
    .aloptwah-about__image-frame[data-mobile-show="0"]{display:none}
    .aloptwah-about__image-frame img{height:var(--aloptwah-about-image-mobile-height,62svh);max-height:var(--aloptwah-about-image-mobile-height,62svh);filter:none;object-fit:cover;object-position:center}
    .aloptwah-about__image-frame[data-mobile-ratio="original"]{aspect-ratio:auto}
    .aloptwah-about__image-frame[data-mobile-ratio="4-5"]{aspect-ratio:4/5}
    .aloptwah-about__image-frame[data-mobile-ratio="3-4"]{aspect-ratio:3/4}
    .aloptwah-about__image-frame[data-mobile-ratio="1-1"]{aspect-ratio:1/1}
    .aloptwah-about__image-frame[data-mobile-ratio="4-3"]{aspect-ratio:4/3}
    .aloptwah-about__image-frame[data-mobile-ratio="16-9"]{aspect-ratio:16/9}
    .aloptwah-about__image-frame:not([data-mobile-ratio="original"]) img{height:100%;max-height:none}
    .aloptwah-about__image-frame[data-mobile-fit="contain"] img{object-fit:contain}
    .aloptwah-about__image-frame[data-mobile-focus="top"] img{object-position:center top}
    .aloptwah-about__image-frame[data-mobile-focus="bottom"] img{object-position:center bottom}
    .aloptwah-about__image-frame[data-mobile-focus="left"] img{object-position:left center}
    .aloptwah-about__image-frame[data-mobile-focus="right"] img{object-position:right center}
    .aloptwah-about__image-frame[data-mobile-effect="monochrome"] img{filter:grayscale(1)}
    .aloptwah-about__image-frame[data-mobile-effect="soft"] img{filter:saturate(.82) contrast(.94) brightness(1.03)}
    .aloptwah-about__image-frame[data-mobile-effect="contrast"] img{filter:contrast(1.16) saturate(.92)}
}