/* =====================================================
   ZKR REAL ESTATE — MANIFESTE
===================================================== */

.zkr-manifesto {
    background: #f4f2ed;
    color: #0a0a0a;

    padding:
        clamp(96px, 10vw, 140px)
        32px;
}


.zkr-manifesto__container {
    width: min(1280px, 100%);

    margin: 0 auto;

    display: grid;

    grid-template-columns:
        minmax(0, 1fr)
        minmax(380px, .78fr);

    gap:
        clamp(70px, 9vw, 150px);

    align-items: center;
}


/* =====================================================
   LABEL
===================================================== */

.zkr-section-label {
    display: flex;

    align-items: center;

    gap: 18px;

    margin-bottom: 42px;

    font-family:
        Inter,
        Arial,
        sans-serif;

    font-size: 9px;

    letter-spacing: 2px;

    text-transform: uppercase;
}


.zkr-section-label span:first-child {
    opacity: .4;
}


/* =====================================================
   TITLE
===================================================== */

.zkr-manifesto__title {
    margin: 0;

    max-width: 720px;

    font-family:
        Didot,
        "Bodoni MT",
        Georgia,
        serif;

    font-weight: 400;

    font-size:
        clamp(54px, 5.2vw, 78px);

    line-height: .96;

    letter-spacing: -3.5px;
}


.zkr-manifesto__title em {
    display: block;

    font-weight: 400;

    font-style: italic;
}


/* =====================================================
   TEXT
===================================================== */

.zkr-manifesto__copy {
    max-width: 530px;

    margin-top: 48px;

    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 34px;

    font-family:
        Inter,
        Arial,
        sans-serif;

    font-size: 15px;

    line-height: 1.65;

    color: rgba(10,10,10,.72);
}


.zkr-manifesto__copy p {
    margin: 0;
}


/* =====================================================
   LINK
===================================================== */

.zkr-manifesto__link {
    display: inline-flex;

    align-items: center;

    gap: 35px;

    margin-top: 45px;

    padding-bottom: 7px;

    border-bottom:
        1px solid rgba(10,10,10,.35);

    color: #0a0a0a;

    text-decoration: none;

    text-transform: uppercase;

    font-family:
        Inter,
        Arial,
        sans-serif;

    font-size: 10px;

    letter-spacing: 1.3px;
}


/* =====================================================
   IMAGE
===================================================== */

.zkr-manifesto__visual {
    position: relative;

    overflow: hidden;

    aspect-ratio: 4 / 5;

    border-radius: 10px;

    background: #a7a298;
}


.zkr-manifesto__visual img {
    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;

    transition:
        transform 700ms cubic-bezier(.2,.7,.2,1);
}


.zkr-manifesto__visual:hover img {
    transform: scale(1.03);
}


.zkr-manifesto__image-caption {
    position: absolute;

    left: 30px;
    right: 30px;
    bottom: 28px;

    display: flex;
    flex-direction: column;

    color: #f4f2ed;
}


.zkr-manifesto__image-caption span {
    margin-bottom: 5px;

    font-family:
        Inter,
        Arial,
        sans-serif;

    font-size: 8px;

    letter-spacing: 2px;
}


.zkr-manifesto__image-caption em {
    font-family:
        Didot,
        Georgia,
        serif;

    font-size: 35px;

    font-weight: 400;

    line-height: 1;

    font-style: italic;
}


/* =====================================================
   TABLETTE
===================================================== */

@media (min-width: 768px) and (max-width: 1180px) {

    .zkr-manifesto {
        padding:
            96px
            24px;
    }


    .zkr-manifesto__container {
        grid-template-columns:
            minmax(0, 1fr)
            minmax(300px, .8fr);

        gap: 55px;
    }


    .zkr-manifesto__title {
        font-size:
            clamp(50px, 6vw, 64px);

        letter-spacing: -2.5px;
    }


    .zkr-manifesto__copy {
        grid-template-columns: 1fr;

        gap: 20px;

        margin-top: 35px;
    }

}


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

@media (max-width: 767px) {

    .zkr-manifesto {
        padding:
            72px
            20px;
    }


    .zkr-manifesto__container {
        display: flex;

        flex-direction: column;

        gap: 55px;
    }


    .zkr-section-label {
        margin-bottom: 28px;
    }


    .zkr-manifesto__title {
        font-size:
            clamp(44px, 12vw, 52px);

        line-height: .98;

        letter-spacing: -2px;
    }


    .zkr-manifesto__copy {
        max-width: none;

        margin-top: 32px;

        grid-template-columns: 1fr;

        gap: 18px;

        font-size: 16px;

        line-height: 1.55;
    }


    .zkr-manifesto__link {
        min-height: 44px;

        margin-top: 28px;
    }


    .zkr-manifesto__visual {
        width: 100%;

        aspect-ratio: 4 / 5;
    }


    .zkr-manifesto__visual:hover img {
        transform: none;
    }


    .zkr-manifesto__image-caption {
        left: 22px;
        bottom: 22px;
    }


    .zkr-manifesto__image-caption em {
        font-size: 28px;
    }

}