/*==========================================
Performance Hero
==========================================*/


.performance-page{

    color:#403a32;
    line-break:strict;

}

/* Header
========================= */

.performance-hero{

    text-align:center;
    max-width:800px;

    margin:160px auto 120px;

    text-align:center;

    padding:0 30px;
    

}


.page-label{

    font-size:13px;

    letter-spacing:.35em;

    color:#8b8175;

}


.performance-hero h1{

    font-family:var(--font-title);

    font-size:clamp(1.8rem,4vw,2.7rem);

    font-weight:400;

    letter-spacing:.15em;

    line-height:1.7;

    margin:40px auto;

}

.performance-hero__lead{

    line-height:2.2;

    color:#6f665d;

    margin:50px auto 0;

}


/*==========================================
Feature
==========================================*/

.performance-feature{

    padding:90px 0;

}

.feature-grid{

    display:grid;

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

    gap:80px;

    align-items:center;

}


.feature-image{

    width:100%;

}


.feature-image img{

    display:block;

    width:100%;

    aspect-ratio:4/5;

    object-fit:cover;

    border-radius:6px;

}


.feature-zehimage img{

    display:block;

    width:100%;

    object-fit:cover;

    border-radius:6px;

    aspect-ratio:4/5;

}



.feature-text{

    max-width:520px;

}


.feature-number{

    display:block;

    margin-bottom:18px;

    font-size:.8rem;

    letter-spacing:.35em;

    color:#b8aa98;

}


.feature-text h2{

    margin-bottom:28px;

    font-family:var(--font-title);

    font-size:clamp(1.7rem,3vw,2.3rem);

    font-weight:400;

    color:#433b34;

}


.feature-text p{

    margin-bottom:22px;

    line-height:2.2;

    color:#5f5750;

}


.feature-text p:last-child{

    margin-bottom:0;

}


/*==========================================
Section Border
==========================================*/

.performance-feature+.performance-feature{

    border-top:1px solid #ece8e2;

}


/*==========================================
Tablet
==========================================*/

@media(max-width:1024px){

.feature-grid{

    gap:50px;

}

.feature-text{

    max-width:100%;

}

}


/*==========================================
Mobile
==========================================*/

@media(max-width:768px){

.performance-hero{

    padding:130px 0 70px;

}


.performance-hero h1{

    font-size:2rem;

    line-height:1.8;

}


.performance-feature{

    padding:70px 0;

}


.feature-grid{

    grid-template-columns:1fr;

    gap:35px;

}


.feature-image{

    order:1;

}


.feature-text{

    order:2;

    max-width:100%;

}


.feature-image img{

    aspect-ratio:4/3;

}


.feature-text h2{

    font-size:1.8rem;

}


.feature-text p{

    line-height:2;

}

}

.feature-link{

    display:inline-block;

    margin-top:28px;

    padding-bottom:6px;

    border-bottom:1px solid #8f8173;

    color:#5b5148;

    letter-spacing:.08em;

    transition:.3s;

}

.feature-link:hover{

    color:#000;

    border-color:#000;

    padding-right:8px;

}