/* =========================================
   ART IN SCRIPTURE
========================================= */

.ais-page {

    --paper: #eee2ce;
    --paper-light: #f6efe3;

    --ink: #211916;
    --muted: #77695f;

    --bronze: #956a47;

    --wine: #381310;
    --wine-dark: #220b09;

    background:
        var(--paper);

    color:
        var(--ink);

}



/* =========================================
   INTRO
========================================= */

.ais-intro {

    padding:
        clamp(4.5rem, 8vw, 7rem)
        1.5rem
        clamp(4rem, 7vw, 6rem);

    background:
        radial-gradient(
            circle at 72% 25%,
            rgba(134,56,42,0.22),
            transparent 38%
        ),
        linear-gradient(
            135deg,
            var(--wine),
            var(--wine-dark)
        );

    color:
        var(--paper-light);

}



.ais-intro__inner {

    width:
        min(1050px, 100%);

    margin:
        0 auto;

}



.ais-eyebrow {

    margin:
        0;

    font-size:
        0.67rem;

    letter-spacing:
        0.3em;

    color:
        #bf895b;

}



.ais-intro h1 {

    margin:
        1rem 0
        0;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:
        clamp(3.7rem, 9vw, 7.4rem);

    line-height:
        0.9;

    font-weight:
        400;

    letter-spacing:
        -0.02em;

}



.ais-lead {

    margin:
        1.8rem 0
        0;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:
        clamp(1.15rem, 2.4vw, 1.55rem);

    font-style:
        italic;

    color:
        rgba(246,239,227,0.78);

}



.ais-rule {

    width:
        90px;

    height:
        1px;

    margin:
        2.3rem 0;

    background:
        #ad7950;

}



.ais-intro blockquote {

    max-width:
        720px;

    margin:
        0;

    padding:
        0;

    border:
        0;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:
        clamp(1.3rem, 3vw, 1.9rem);

    line-height:
        1.45;

    font-style:
        italic;

}



.ais-reference {

    display:
        block;

    margin-top:
        1rem;

    font-size:
        0.65rem;

    letter-spacing:
        0.27em;

    color:
        #bf895b;

}



/* =========================================
   COLLECTION
========================================= */

.ais-collection {

    width:
        min(1320px, calc(100% - 2.4rem));

    margin:
        0 auto;

    padding:
        clamp(4rem, 7vw, 6.5rem)
        0
        clamp(5rem, 9vw, 8rem);

}



.ais-collection__header {

    max-width:
        720px;

    margin-bottom:
        clamp(3rem, 6vw, 5rem);

}



.ais-section-label {

    margin:
        0;

    font-size:
        0.67rem;

    letter-spacing:
        0.3em;

    color:
        var(--bronze);

}



.ais-collection__header h2 {

    margin:
        0.7rem 0
        0;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:
        clamp(2.3rem, 5vw, 4.3rem);

    font-weight:
        400;

    line-height:
        1;

}



.ais-collection__header > p:last-child {

    max-width:
        600px;

    margin:
        1.1rem 0
        0;

    line-height:
        1.65;

    color:
        var(--muted);

}



/* =========================================
   STABLE TWO-COLUMN GALLERY
========================================= */

.ais-gallery {

    display:
        grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap:
        clamp(3.5rem, 6vw, 6rem)
        clamp(1.4rem, 3vw, 3rem);

    align-items:
        start;

}



.ais-work {

    min-width:
        0;

    width:
        100%;

}



.ais-work__image {

    display:
        block;

    width:
        100%;

    overflow:
        hidden;

    background:
        #d8cab5;

    text-decoration:
        none;

}



.ais-work__image img {

    display:
        block;

    width:
        100%;

    height:
        auto;

    transition:
        transform 0.55s ease,
        opacity 0.55s ease;

}



.ais-work__image:hover img {

    transform:
        scale(1.012);

    opacity:
        0.96;

}



.ais-work__placeholder {

    min-height:
        380px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    font-size:
        0.65rem;

    letter-spacing:
        0.28em;

    color:
        var(--muted);

}



/* =========================================
   CAPTIONS
========================================= */

.ais-work__caption {

    padding-top:
        1.15rem;

}



.ais-work__style {

    margin:
        0;

    font-size:
        0.68rem;

    line-height:
        1.5;

    letter-spacing:
        0.14em;

    text-transform:
        uppercase;

    color:
        var(--bronze);

}



.ais-work__caption h3 {

    margin:
        0.55rem 0
        0;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:
        clamp(1.5rem, 2.8vw, 2.25rem);

    line-height:
        1.08;

    font-weight:
        400;

}



.ais-work__caption h3 a {

    color:
        inherit;

    text-decoration:
        none;

}



.ais-work__caption h3 a:hover {

    color:
        #6e452f;

}



/* =========================================
   EMPTY
========================================= */

.ais-empty {

    padding:
        5rem 1rem;

    text-align:
        center;

    border-top:
        1px solid
        rgba(72,50,36,0.2);

    border-bottom:
        1px solid
        rgba(72,50,36,0.2);

}



.ais-empty span {

    color:
        var(--bronze);

}



/* =========================================
   CLOSING
========================================= */

.ais-closing {

    padding:
        clamp(4.5rem, 8vw, 7rem)
        1.5rem;

    text-align:
        center;

    background:
        var(--wine-dark);

    color:
        var(--paper-light);

}



.ais-closing > span {

    color:
        #bd885a;

}



.ais-closing p {

    margin:
        1.4rem 0
        0;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:
        clamp(1.3rem, 3vw, 1.95rem);

    line-height:
        1.55;

    font-style:
        italic;

}



/* =========================================
   MOBILE
========================================= */

@media (max-width: 650px) {

    .ais-intro {

        padding-left:
            1.2rem;

        padding-right:
            1.2rem;

    }


    .ais-collection {

        width:
            calc(100% - 1.4rem);

    }


    .ais-gallery {

        grid-template-columns:
            1fr;

        gap:
            4rem;

    }


    .ais-work__caption {

        padding-left:
            0.15rem;

        padding-right:
            0.15rem;

    }

}
