/*=========================================================
HOME - ABOUT JUSTYNA
=========================================================*/

.home_about
{
    padding:var(--space_3xl) 0;

    background:var(--aob-ivory);

    border-bottom:1px solid var(--aob-gold);
}


/*=========================================================
ABOUT LAYOUT
=========================================================*/

.home_about_layout
{
    display:grid;

    grid-template-columns:1fr;
    grid-template-areas:
        "header"
        "image"
        "copy";

    gap:var(--space_xl);

    align-items:start;
}


/*=========================================================
ABOUT HEADER
=========================================================*/

.home_about_header
{
    grid-area:header;

    width:100%;

    margin:0;

    text-align:center;
}

.home_about_header .eyebrow
{
    margin-bottom:0.9rem;

    color:var(--aob-champagne-gold);
}

.home_about_header_divider
{
    display:flex;

    width:min(100%,14rem);

    margin:0 auto 1.25rem;

    align-items:center;
    justify-content:center;

    gap:0.75rem;
}

.home_about_header_divider span:not(.home_about_header_heart)
{
    display:block;

    height:1px;

    flex:1 1 auto;

    background:var(--aob-gold);
}

.home_about_header_heart
{
    color:var(--aob-champagne-gold);

    font-family:var(--font_display);
    font-size:1rem;
    line-height:1;
}

.home_about_header h2
{
    margin:0;

    color:var(--aob-black);

    font-family:var(--font_script);
    font-size:clamp(3.7rem,15vw,5.8rem);
    font-weight:400;
    letter-spacing:0;
    line-height:0.9;

    text-align:center;
}


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

.home_about_image
{
    grid-area:image;

    position:relative;

    width:100%;

    overflow:hidden;

    background:var(--aob-black);

    border:1px solid var(--aob-gold);

    box-shadow:
        0 1.7rem 3.5rem rgba(31,21,14,0.18),
        0 0.4rem 1rem rgba(31,21,14,0.12);
}

.home_about_image img
{
    display:block;

    width:100%;
    height:auto;

    aspect-ratio:1 / 1;

    object-fit:cover;
    object-position:center center;

    transition:
        filter 450ms ease,
        transform 450ms ease;
}


/*=========================================================
ABOUT COPY
=========================================================*/

.home_about_copy
{
    grid-area:copy;

    width:100%;

    text-align:center;
}

.home_about_text
{
    width:100%;
}

.home_about_copy p
{
    max-width:42rem;

    margin-right:auto;
    margin-left:auto;

    color:var(--aob-text-soft);

    line-height:1.75;
}

.home_about_lead
{
    margin-top:0;

    color:var(--aob-text);

    font-size:1.05rem;
    line-height:1.75;
}


/*=========================================================
ABOUT CTA
=========================================================*/

.home_about_cta
{
    width:100%;

    margin-top:var(--space_lg);

    text-align:center;
}

.home_about_copy .home_about_signature
{
    max-width:none;

    margin:0 auto;

    color:var(--aob-champagne-gold);

    font-family:var(--font_script);
    font-size:clamp(2.5rem,10vw,3.75rem);
    font-weight:400;
    line-height:0.95;

    text-align:center;
}


/*=========================================================
CTA DIVIDER
=========================================================*/

.home_about_cta_divider
{
    display:flex;

    width:min(100%,18rem);

    margin:1.15rem auto 1rem;

    align-items:center;
    justify-content:center;

    gap:0.75rem;
}

.home_about_cta_divider span:not(.home_about_cta_heart)
{
    display:block;

    height:1px;

    flex:1 1 auto;

    background:var(--aob-gold);
}

.home_about_cta_heart
{
    color:var(--aob-champagne-gold);

    font-family:var(--font_display);
    font-size:1rem;
    line-height:1;
}


/*=========================================================
ABOUT BUTTON
=========================================================*/

.home_about_button_wrap
{
    display:flex;

    justify-content:center;
}

.home_about_button
{
    border-color:var(--aob-champagne-gold);

    color:var(--aob-champagne-gold);
}

.home_about_button:hover,
.home_about_button:focus-visible
{
    background:var(--aob-gold);
    border-color:var(--aob-champagne-gold);
    color:var(--aob-black);
}


/*=========================================================
ABOUT STATISTICS
=========================================================*/

.home_about_stats
{
    display:grid;

    width:100%;

    margin:var(--space_2xl) 0 0;
    padding:0;

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

    gap:0.9rem;
}

.home_about_stat
{
    margin:0;
    padding:0;

    border:1px solid rgba(184,138,79,0.72);

    background:rgba(255,255,255,0.18);
}

.home_about_stat dt
{
    display:flex;

    min-height:9.5rem;

    margin:0;
    padding:1rem;

    flex-direction:column;
    align-items:center;
    justify-content:center;

    text-align:center;
}

.home_about_stat_value
{
    color:var(--aob-champagne-gold);

    font-family:var(--font_display);
    font-size:clamp(2.3rem,9vw,3.2rem);
    font-weight:500;
    line-height:1;
}

.home_about_stat_divider
{
    display:flex;

    width:min(100%,10rem);

    margin:0.65rem auto;

    align-items:center;
    justify-content:center;

    gap:0.5rem;
}

.home_about_stat_divider span:first-child,
.home_about_stat_divider span:last-child
{
    display:block;

    height:1px;

    flex:1 1 auto;

    background:var(--aob-gold);
}

.home_about_stat_divider span:nth-child(2)
{
    color:var(--aob-champagne-gold);

    font-family:var(--font_display);
    font-size:0.9rem;
    line-height:1;
}

.home_about_stat_label
{
    color:var(--aob-black);

    font-size:0.68rem;
    font-weight:700;
    letter-spacing:0.1em;
    line-height:1.4;
    text-transform:uppercase;
}


/*=========================================================
TABLET
=========================================================*/

@media (min-width:48rem)
{
    .home_about
    {
        padding:var(--space_4xl) 0;
    }

    .home_about_layout
    {
        gap:var(--space_2xl);
    }

    .home_about_header,
    .home_about_copy
    {
        max-width:48rem;

        margin-right:auto;
        margin-left:auto;
    }

    .home_about_image
    {
        max-width:40rem;

        margin-right:auto;
        margin-left:auto;
    }

    .home_about_stats
    {
        max-width:52rem;

        margin-right:auto;
        margin-left:auto;

        gap:1rem;
    }

    .home_about_stat dt
    {
        min-height:10.5rem;

        padding:1.25rem;
    }

    .home_about_stat_label
    {
        font-size:0.72rem;
    }
}


/*=========================================================
DESKTOP
=========================================================*/

@media (min-width:68rem)
{
    .home_about_layout
    {
        grid-template-columns:minmax(0,1.08fr) minmax(22rem,0.92fr);

        grid-template-areas:
            "header image"
            "copy   image";

        column-gap:clamp(5.5rem,8vw,9rem);
        row-gap:1.5rem;

        align-items:center;
    }

    .home_about_header,
    .home_about_copy
    {
        width:min(100%,44rem);
        max-width:44rem;

        margin-right:auto;
        margin-left:auto;
    }

    .home_about_header
    {
        text-align:center;
    }

    .home_about_header h2
    {
        width:100%;

        font-size:clamp(4.45rem,5vw,5.85rem);
        line-height:0.88;

        text-align:center;
        white-space:nowrap;

        transform:translateX(1.15rem);
    }

    .home_about_copy
    {
        text-align:center;
    }

    .home_about_text
    {
        width:100%;
    }

    .home_about_copy p
    {
        width:100%;
        max-width:40rem;

        margin-right:auto;
        margin-left:auto;

        text-align:center;
    }

    .home_about_cta
    {
        width:100%;

        margin-right:auto;
        margin-left:auto;

        text-align:center;
    }

    .home_about_copy .home_about_signature
    {
        width:100%;
        max-width:none;

        font-size:clamp(2.25rem,2.65vw,3.15rem);

        text-align:center;
        white-space:nowrap;
    }

    .home_about_image
    {
        max-width:none;

        margin:0;
    }

    .home_about_image img
    {
        aspect-ratio:1.12 / 1;

        object-position:center 22%;
    }

    .home_about_stats
    {
        max-width:none;

        margin-top:var(--space_3xl);

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

        gap:1.25rem;
    }

    .home_about_stat dt
    {
        min-height:9.25rem;

        padding:1rem;
    }
}


/*=========================================================
INTERMEDIATE DESKTOP
=========================================================*/

@media (min-width:68rem) and (max-width:79.99rem)
{
    .home_about_layout
    {
        grid-template-columns:minmax(0,1.15fr) minmax(20rem,0.85fr);

        column-gap:4rem;
    }

    .home_about_header,
    .home_about_copy
    {
        width:min(100%,39rem);
        max-width:39rem;
    }

    .home_about_header h2
    {
        font-size:3.95rem;

        transform:translateX(0.75rem);
    }

    .home_about_copy .home_about_signature
    {
        font-size:2.15rem;
    }
}


/*=========================================================
LARGE DESKTOP
=========================================================*/

@media (min-width:90rem)
{
    .home_about_layout
    {
        grid-template-columns:minmax(0,1.05fr) minmax(24rem,0.95fr);

        column-gap:clamp(7rem,9vw,11rem);
    }

    .home_about_header,
    .home_about_copy
    {
        width:min(100%,48rem);
        max-width:48rem;
    }

    .home_about_header h2
    {
        font-size:6.15rem;

        transform:translateX(1.25rem);
    }

    .home_about_copy .home_about_signature
    {
        font-size:3.45rem;
    }

    .home_about_image img
    {
        aspect-ratio:1.14 / 1;
    }

    .home_about_stat dt
    {
        min-height:9.75rem;
    }

    .home_about_stat_value
    {
        font-size:3.25rem;
    }
}


/*=========================================================
IMAGE HOVER - POINTER DEVICES ONLY
=========================================================*/

@media (hover:hover) and (pointer:fine)
{
    .home_about_image:hover img
    {
        filter:brightness(1.035);
        transform:scale(1.015);
    }
}


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

@media (max-width:29.99rem)
{
    .home_about
    {
        padding:var(--space_2xl) 0;
    }

    .home_about_layout
    {
        gap:var(--space_lg);
    }

    .home_about_header h2
    {
        font-size:clamp(3.3rem,17vw,4.5rem);
    }

    .home_about_copy .home_about_signature
    {
        font-size:clamp(2.25rem,11vw,3rem);
    }

    .home_about_button
    {
        width:100%;
    }

    .home_about_stats
    {
        margin-top:var(--space_xl);

        gap:0.75rem;
    }

    .home_about_stat dt
    {
        min-height:8.5rem;

        padding:0.75rem;
    }

    .home_about_stat_value
    {
        font-size:clamp(2rem,11vw,2.7rem);
    }

    .home_about_stat_label
    {
        font-size:0.6rem;
        letter-spacing:0.08em;
    }
}


/*=========================================================
REDUCED MOTION
=========================================================*/

@media (prefers-reduced-motion:reduce)
{
    .home_about_image img
    {
        transition:none;
    }

    .home_about_image:hover img
    {
        filter:none;
        transform:none;
    }
}